PSD'yi PNG olarak dışa aktarma: Katmanların ve şeffaflığın korunması

Şeffaflığı koruyarak PSD'yi PNG'ye dönüştürmek için Adobe Photoshop'taki File > Export > Export As (Dosya > Dışa Aktar > Farklı Dışa Aktar) işlevini kullanın. PNG formatını seçin, Transparency (Şeffaflık) kutusunun işaretli olduğundan emin olun ve "Export All" (Tümünü Dışa Aktar) düğmesine tıklayın. Tek tek katmanları ayrı PNG dosyaları olarak dışa aktarmak için tüm katmanları dışa aktarma seçeneğini etkinleştirin veya katmanlar paneli aracılığıyla "Quick Export as PNG" (PNG Olarak Hızlı Dışa Aktar) özelliğini kullanın.

Aşağıda, tek bir görseli kaydetmekten UI ögelerinin toplu dışa aktarımına kadar farklı görevler için yöntemler detaylıca incelenmiştir.

Dışa aktarmadan önce dosyanın hazırlanması

Nihai PNG'nin kalitesi, PSD dosyasının nasıl organize edildiğine bağlıdır. Dışa aktarmadan önce şu üç işlemi gerçekleştirin:

1. Arka plan şeffaflığını kontrol edin. Arka plan katmanının (Background) kapalı veya silinmiş olduğundan emin olun. Arka plan beyaz renkle doldurulmuşsa, PNG'de de beyaz kalacaktır. Şeffaf alanlar dama tahtası deseniyle görüntülenmelidir.
2. Gereksiz kısımları kırpın. Nesnenin etrafındaki boş şeffaf alanları kaldırmak için Image > Trim (Görüntü > Kırp) işlevini kullanın. Bu, dosya boyutunu küçültür.
3. Katmanları doğru adlandırın. Photoshop'taki katman adları, toplu dışa aktarımda dosya adları haline gelecektir. Latin alfabesi ve alt çizgiler kullanın (örneğin, Кнопка Отправить.psd yerine btn_submit.png).

Yöntem 1: Tüm görüntünün dışa aktarılması (tek dosya)

Şeffaf arka plana sahip tek bir hazır görsel (banner, illüstrasyon) gerektiğinde uygundur.

1. File > Export > Export As… menüsüne gidin (veya Alt + Shift + Ctrl + W tuşlarına basın).
2. Sağ üst köşeden PNG formatını seçin.
3. Image Size bölümünde istenen boyutları (yüzde veya piksel cinsinden) belirleyin.
4. Transparency bölümünde kutunun işaretli olduğundan emin olun.
5. Export All düğmesine tıklayın ve kaydetme klasörünü seçin.

Yöntem 2: Tek tek katmanların toplu dışa aktarılması

Her ögenin (simgeler, butonlar) ayrı bir dosya olması gerektiğinde web tasarımı ve arayüz geliştirme için idealdir.

"Farklı Dışa Aktar" (Export As) aracılığıyla

1. Katmanlar panelinde istenen katmanları seçin (çoklu seçim için Ctrl/Cmd tuşunu basılı tutun).
2. Seçili katmanlara sağ tıklayın ve Export As… seçeneğini belirleyin.
3. Tüm seçili ögeler için PNG formatını ve şeffaflığı aynı anda ayarlayın.
4. Export düğmesine tıklayın. Photoshop, her katmanı belirtilen klasöre ayrı bir dosya olarak kaydeder.

"PNG Olarak Hızlı Dışa Aktar" (Quick Export) aracılığıyla

Ek ayarlar yapmadan katmanları mümkün olan en hızlı şekilde kaydetmek gerekiyorsa:

1. Katmanları seçin.
2. Sağ tıklayın ve Quick Export as PNG seçeneğini belirleyin.
3. Dosyalar, Photoshop ayarlarında (Preferences > Export) belirtilen klasöre kaydedilir.

Yöntem 3: Slice Tool (Dilimleme Aracı) kullanımı

Tüm katmanlar yerine yalnızca belirli alanların dışa aktarılması gereken karmaşık taslaklar için eski ama güvenilir bir yöntemdir.

1. Slice Tool aracını seçin (C tuşu, Crop Tool grubunda geçiş yapılır).
2. Dışa aktarılması gereken ögelerin etrafına çerçeveler çizin.
3. File > Export > Save for Web (Legacy) menüsüne gidin (Alt + Shift + Ctrl + S).
4. PNG-24 formatını seçin ve Transparency kutusunu işaretleyin.
5. Save düğmesine tıklayın. İletişim kutusunda, tüm tuvali dışa aktarmamak için "Selected Slices" (Yalnızca seçili dilimler) seçeneğini belirleyin.

Şeffaflık ve kalite ayarları

PNG olarak dışa aktarırken, artefaktlardan veya gereksiz dosya boyutundan kaçınmak için doğru parametreleri seçmek son derece önemlidir.

Dışa aktarmada sık yapılan hatalar

• Şeffaflık yerine beyaz arka plan.
  • Neden: "Background" katmanı görünür durumdaydı veya normal bir katmana dönüştürüldü ancak beyaz renkle dolduruldu.
  • Çözüm: Dışa aktarmadan önce arka plan katmanını gizleyin. Tuvalde dama tahtası deseninin bulunduğunu kontrol edin.
• Tırtıklı kenarlar (aliasing).
  • Neden: Yazı tiplerinin veya şekillerin yanlış yumuşatılması.
  • Çözüm: Dışa aktarma ayarlarında "Matte" (Alt zemin rengi) kutusunun işaretli olmadığından veya "None" olarak ayarlandığından emin olun.
• Dosya boyutunun aşırı büyük olması.
  • Neden: Küçük bir simge için devasa bir görüntünün dışa aktarılması veya basit iki renkli logolar için PNG-24 kullanılması.
  • Çözüm: Dışa aktarmadan önce görüntü boyutunu küçültün. Basit grafikler için PNG-8'i deneyin. Dışa aktarımdan sonra sıkıştırma hizmetlerini (örneğin TinyPNG) kullanın.
• Yanlış dosya adları.
  • Neden: Katmanların "Layer 1 copy" gibi varsayılan adlarla dışa aktarılması.
  • Çözüm: Dışa aktarmadan önce PSD'deki katmanları yeniden adlandırın.

SSS

PNG-8 ile PNG-24 arasındaki fark nedir? PNG-24, 16 milyon rengi ve tam şeffaflığı (256 düzeyde opaklık) destekler. PNG-8, 256 renkle sınırlıdır ve yalnızca ikili şeffaflığı destekler (piksel ya tamamen şeffaftır ya da değildir), bu da yarı tonlarda "tırtıklı" bir kenar oluşturabilir. Fotoğraflar ve karmaşık grafikler için her zaman PNG-24 kullanın.

Tüm katmanları tek seferde ayrı dosyalara nasıl dışa aktarabilirim? Katmanlar panelinde tüm gerekli katmanları seçin, sağ tıklayın ve "Export As" seçeneğini belirleyin. Açılan pencerenin sol tarafında seçili tüm katmanların listesi görünecektir. "Export All" düğmesine tıklayın; Photoshop her biri için ayrı bir PNG dosyası oluşturacaktır.

Şeffaflık korunuyor ama kenarlar kirli görünüyor, neden? Bu, "Matting" (alt zemin) efektiyle ilgili olabilir. "Save for Web" veya "Export As" penceresinde Matte ayarını bulun ve değerini None olarak belirleyin. Ayrıca, gerek olmayan yerlerde yumuşatmanın (Anti-aliasing) açık olup olmadığını kontrol edin.

Dışa aktarma otomatikleştirilebilir mi? Evet. Photoshop'ta Actions (Eylemler) özelliğini kullanın. Bir katmanın dışa aktarma eylemini kaydedin, ardından bunu File > Automate > Batch aracılığıyla bir dosya grubuna uygulayın. Daha karmaşık otomasyon için JSX betiklerini veya LayerExporter gibi eklentileri kullanın.