Vektör Çizim Nedir, Yollar ve Eğriler Nasıl Çalışır?

Haberci

SEO UZMANI
Yönetici
Katılım
21 May 2023
Mesajlar
602
Tepki
17
Puan
18
848




Aynı çizimi tabelaya bastığınızda net, kartvizite koyduğunuzda da net görünüyorsa, o dosya piksel yığını değildir. Vektör çizimin farkı burada başlıyor: görüntü kaydedilmiyor, görüntünün nasıl çizileceği kaydediliyor.

Bu yazı vektör çizimin ne olduğunu, çizgilerin ve eğrilerin dosyada hangi komutlarla tarif edildiğini ve tasarıma oturmadan önce hangi kararların verildiğini W3C belirtimine ve MDN'nin yol dersine dayanarak anlatıyor.

Vektör çizim nedir?​


Vektör çizim, şekli koordinatlar ve komutlarla tanımlama biçimi. Web tarafındaki karşılığı SVG ve tanımı standartta yazılı. W3C'nin SVG belirtimi SVG'yi iki boyutlu grafikleri tarif etmeye yarayan, XML söz dizimine dayanan bir dil olarak tanımlıyor.

Belirtim üç tür grafik nesnesi sayıyor: doğru ve eğrilerden oluşan yollar gibi vektör şekilleri, görüntüler ve metin. Kapsamda iç içe dönüşümler, kırpma yolları, alfa maskeleri, filtre efektleri, etkileşimli içerik ve DOM erişimi de var.

Yani vektör dosyası bir çizim programının özel biçimi olmak zorunda değil; okunabilir, düzenlenebilir ve standarda bağlı bir tarif.

Yol: çizimin omurgası​


MDN'nin yollar dersine göre yol elemanı SVG'deki en güçlü şekil; çizgiler, eğriler ve yaylar onunla kuruluyor. Şeklin kendisi `d` özniteliğinde, komut ve parametre dizisi olarak tutuluyor.

Komutlar tek harfle temsil ediliyor ve mantık öğrenildiğinde okunabilir hâle geliyor:

  • Taşı: Kalemi kâğıttan kaldırıp yeni bir noktaya götürür.
  • Çizgi: Bulunduğu noktadan hedefe düz çizgi çeker; yatay ve dikey için kısa yolları vardır.
  • Eğri: Kontrol noktalarıyla Bézier eğrisi tanımlar.
  • Yay: Elips ya da daire parçası çizer.
  • Kapat: Yolu başlangıç noktasına döndürerek kapatır.

MDN'nin altını çizdiği bir ayrıntı çizim yaparken sürekli karşınıza çıkıyor: komut harfinin büyük yazılması sayfadaki mutlak koordinatı, küçük yazılması ise son noktaya göre göreli koordinatı belirtiyor. Aynı ders göreli komutların şekli taşımayı ve yeniden boyutlandırmayı kolaylaştırdığını söylüyor.

Eğri neden ayrı bir konu?​


Düz çizgilerle her şey çizilebilir gibi görünse de MDN bunun bedelini açıkça yazıyor: karmaşık eğrileri çok sayıda küçük çizgiyle kurmak hem çok parça gerektiriyor hem de büyük boyutlara ölçeklenmiyor. Yol elemanı bu yüzden daha verimli.

Eğri komutlarının kendi içinde de kademesi var. Kübik Bézier iki kontrol noktası ve bir bitiş noktası istiyor; kuadratik Bézier tek kontrol noktasıyla daha basit bir eğri kuruyor. Yumuşak varyantlar ise bir önceki kontrol noktasının yansımasını kendiliğinden hesaplayarak zincirleme eğrileri kolaylaştırıyor.

Pratik karşılığı' Alıntı:
Bir logoyu vektöre çevirirken "kaç düğüm kullandım" sorusu, dosya boyutundan çok düzenlenebilirliği belirler. Az sayıda iyi yerleştirilmiş düğüm, sonradan biçim değiştirmeyi kolaylaştırır.

Aynı şekli farklı yollarla yazmak​


Bir dikdörtgeni dört ayrı çizgi komutuyla da, yatay-dikey kısa yollarıyla da tanımlayabilirsiniz; sonuç aynı görünür ama dosya ve düzenleme kolaylığı değişir. MDN'nin dersinde aynı şeklin hem uzun hem kısa yazımı örneklenmesinin nedeni bu.

Kısa yazım, sonradan şekli taşımak ya da ölçeklendirmek gerektiğinde daha az yerde değişiklik yapmayı sağlıyor. Karmaşık çizimlerde bu fark, dosyayı elle düzenlenebilir tutmakla tutmamak arasındaki ayrımı belirliyor.

Koordinatlar birimsiz​


MDN, yol tanımındaki koordinatların her zaman birimsiz olduğunu ve kullanıcı koordinat sisteminde yer aldığını belirtiyor. Bunun anlamı şu: çizimin "gerçek" boyutu dosyada sabit değil, gösterim anında belirleniyor.

Tabela ile kartvizit arasındaki fark da buradan çıkıyor. Aynı tarif, hedef boyuta göre yeniden çiziliyor; büyütülen bir fotoğraf gibi bozulmuyor.

Çizime başlamadan önce​


Vektör dosyası oluşturmadan önce iki karar işi kolaylaştırıyor. Birincisi metin: yazı çizime gömülecekse yazı tipinin nasıl taşınacağını baştan düşünmek gerekiyor. Dosya başka bir bilgisayarda açıldığında yazı tipi bulunamazsa görünüm bozulabiliyor; bunun nasıl önleneceğini eksik font hatasını ele aldığımız yazıda anlatmıştık.

İkincisi kaynak: hazır parçalar kullanacaksanız lisanslarını baştan kontrol etmek gerekiyor. Marka çalışmalarında hangi lisansın işe yaramadığını ücretsiz logo tasarımını ele aldığımız yazıda işlemiştik. Araç tarafında nereden başlayacağınıza ücretsiz tasarım araçlarını derlediğimiz yazıdan bakabilirsiniz.

Sık Sorulan Sorular​


Vektör çizim nedir?
Şeklin koordinat ve komutlarla tarif edilmesidir. W3C'nin belirtimi SVG'yi iki boyutlu grafikleri tarif eden, XML söz dizimine dayanan bir dil olarak tanımlıyor.

Yol elemanı ne işe yarar?
MDN'ye göre SVG'deki en güçlü şekildir; çizgiler, eğriler, yaylar ve karmaşık şekiller onunla oluşturulur ve şekil `d` özniteliğinde komut dizisi olarak tutulur.

Komutlarda büyük ve küçük harf farkı ne?
Büyük harf sayfadaki mutlak koordinatı, küçük harf ise son noktaya göre göreli koordinatı belirtir.

Neden düz çizgi yerine eğri komutu kullanılıyor?
MDN, karmaşık eğrileri küçük çizgilerle kurmanın çok sayıda parça gerektirdiğini ve büyük boyutlara ölçeklenmediğini belirtiyor.

Vektör dosyasında ölçü birimi var mı?
Yol tanımındaki koordinatlar birimsizdir; kullanıcı koordinat sisteminde yer alırlar.

Özetle​


Vektör çizim, sonucu değil tarifi saklıyor: taşı, çiz, eğ, kapat komutlarıyla kurulan bir yol. Koordinatlar birimsiz olduğu için aynı dosya her boyutta yeniden çiziliyor. Eğri komutları da bu tarifi kısaltıyor; düz çizgi yığınıyla kurulan bir şekil hem büyüyor hem ölçeklendiğinde bozuluyor.

Elinizdeki logo dosyası tarif mi tutuyor, yoksa sabit çözünürlüklü bir görüntü mü?

Güncelleme: 26 Ağustos 2026.



Dijital Dünyanıza Yön Veren Pusula
 

Ekli dosyalar

  • banner_03.jpg
    banner_03.jpg
    5.5 KB · Görüntüleme: 1
Benzer konular Forum alanı Tarih
Haberci Grafik ve Tasarım Eğitimleri 0 450

Benzer konular

Geri
Üst