Web Tasarımcıları için En İyi 10 Photoshop Eklentisi

Web Tasarımcıları için En İyi 10 Photoshop Eklentisi

​​​​​​​Adobe Photoshop, 2018'de hala web tasarımcıları için en iyi yazılım seçeneklerinden biridir. Kendi başına inanılmaz derecede güçlü ve çok yönlü bir araçtır, ancak Photoshop eklentileri varsayılan işlevlerini daha da geliştirebilir. Bunları kullanarak, farklı görevleri otomatikleştirebilir, iş akışınızı hızlandırabilir, PSD tasarımınızı HTML ve CSS dosyalarına dönüştürebilir, renkleri yönetebilir veya tasarımınıza özel yazı tipleri ve görüntüler ekleyebilirsiniz.

Bu yazıda, web tasarımcıları için oluşturulmuş 6'sı ücretsiz ve 4'ü premium olan 10 harika Photoshop eklentisine bir göz atacağız.

1. CSS3Ps

Fiyat: Ücretsiz

CSS3Ps eklentisi, Photoshop katmanlarınızı kolaylıkla CSS3'e dönüştürmenizi sağlar. Sadece CSS3'e dönüştürmek istediğiniz katmanları seçmeniz ve dönüşümü gerçekleştirmek için CSS3Ps düğmesini tıklamanız yeterlidir. Eklenti, farklı Photoshop efektlerini CSS3 özellikleri olarak dışa aktarır. Örneğin, PSD vuruşları border özelliklere ve box-shadow iç gölge özelliklerine dönüştürülür.

CSS3Ps bulut tabanlı bir eklenti olduğundan, güncellemeler ve hatalar hakkında endişelenmenize gerek yok. Hesaplamalar bulutta yapılır ve sonucu tarayıcınızda kolayca kontrol edebilirsiniz.

CSS3Ps şu anda web tasarımcıları için en iyi ücretsiz Photoshop eklentileri biridir. Popüler tarayıcılar için satıcı önekleri, çoklu katman seçimi, Sass ve SCSS dönüştürme, metin katmanları için destek ve diğerleri gibi bir çok harika özellik ile birlikte geliyor.

2. Font Awesome PS

Fiyat: Ücretsiz

Font Awesome, çoğu web tasarımcılarının düzenli olarak kullandığı en popüler simge yazı tipidir. Photoshop'ta Font Awesome'ı uzun süre kullanmak kolay değildi, ancak bu kullanışlı küçük eklentinin kullanımıyla bu durum değişti. Tasarımlarınıza eklemek için tüm ücretsiz Font Awesome simgelerine anında erişmenizi sağlar.

Eklentinin kullanımı oldukça kolaydır. Öncelikle, Font Awesome PS panelinde kullanmak istediğiniz simgeyi aramanız gerekir. Ardından, seçilen simgeyi tasarımınıza yeni bir Photoshop katmanı olarak eklemeniz gerekir. Eklentinin varsayılan şekli düzenlemenize izin verdiği için herhangi bir simgenin tasarımını değiştirmek de mümkündür.

3. Prisma

Fiyat: Ücretsiz

Sık sık renk örnekleri ile çalışıyorsanız, Prisma Photoshop eklentisi tam size göre. Prisma size çok yönlü olarak kullanabileceğiniz global renk örnekleri sunar. Aynı renkleri birçok sayfa boyunca kullanma eğiliminde olan web tasarımcıları için özellikle yararlı olabilir.

Prisma ile renkleri çeşitli PSD dosyalarında senkronize edebilir, katmanları birbirine bağlayabilir ve toplu olarak yeniden düzenleyebilirsiniz. Üç farklı yerden renkleri seçebilirsiniz: normal Photoshop renk örnekleri, renk seçici iletişim kutusu ve renk paneli. Genel renk örneklerini istediğiniz kadar katmana bağlayabilirsiniz.

Prisma ayrıca renk örneklerinizi ekibinizle paylaşmayı da mümkün kılar. Proje renklerin Sass, SCSS, Less ve Stylus değişkenlerine dönüştürüldüğü ve tarayıcıda görüntülendiği dört paylaşılabilir URL elde edersiniz.

4. Ink

Fiyat: Ücretsiz

Hiç Photoshop katmanları için özellikler oluşturmayı düşündünüz mü? Aslında, tasarımcılar ve geliştiriciler arasında muazzam bir işbirliğini kolaylaştırabilir. Ücretsiz Ink Photoshop eklentisi sadece bunu yapmanıza izin verir. Bunu kullanarak, tasarım ve geliştirme ekipleri arasındaki yanlış anlamaları önleyebilirsiniz. Temel olarak, mockup'unuza ekstra bilgi parçaları ekleyerek Photoshop katmanlarınızı belgelersiniz.

Mürekkep paneli size birkaç farklı seçenek sunar. Örneğin, katman ölçülerini ve renklerini yazdırabilir, bir XML dosyası oluşturabilir ve tipografi, degradeler, kontur efektleri ve diğer stil öğelerini belgeleyebilirsiniz. Sadece belgelemek istediğiniz katmanı seçmeniz ve geliştiricilere iletmek istediğiniz bilgileri eklemeye başlayabilirsiniz. Oluşturduğunuz belgeler _ink, kolayca erişebileceğiniz klasörde saklanır.

5. Fontea

Fiyat: Ücretsiz

Fontea, mevcut tüm Google Yazı Tiplerini Photoshop'un içinde kullanmanıza olanak tanır. Bu şu anda 800'den fazla ücretsiz ve açık kaynaklı yazı tipi ailelerinden biraz daha fazlasını ifade ediyor. Tasarımlarınızda düzenli olarak Google Yazı Tiplerini kullanıyorsanız, bu eklenti size çok zaman kazandırabilir. Temel olarak, hangi font ailesinin tasarımınıza en uygun olduğunu denemek için Photoshop'tan çıkmanız gerekmez.

Yazı tiplerini serif, sans-serif veya ekran gibi kategorilere göre arayabilir, tek bir tıklamayla farklı yazı tipleri arasında geçiş yapabilir, favorilerinizi kaydedebilir ve daha pek çok şey yapabilirsiniz. Fontea'nın ana sayfasında, eklentiyi yüklemeden işlevselliklerini deneyebileceğiniz canlı bir demo da var.

6. Pexels Photoshop Plugin

Fiyat: Ücretsiz

Tasarımınız için doğru görüntüleri bulmak, bazen düşündüğünüz kadar kolay olmayan günlük bir sorundur. Web'de birçok stok fotoğraf sitesi vardır, ancak ücretsiz ve atıf yapmadan kullanabileceğiniz resimler bulmak daha zor bir sorudur. Pexels stok fotoğraf sitesinde, tüm fotoğraflar Creative Commons Zero (CC0) Lisansı altında lisanslanmıştır; bu, herhangi bir amaç için yasal olarak, ücretsiz ve atıf olmadan kullanılabilir demektir.

Pexels, web tasarım topluluğuna iş akışınızı büyük ölçüde geliştirebilecek kullanımı kolay bir Photoshop eklentisi sağlar. Pexels Photoshop Eklentisi, tüm Pexels kütüphanesini Photoshop'un içinde mevcut hale getirir. Şu an, bu, özgürce kullanabileceğiniz 30k yüksek kaliteli fotoğraflar anlamına geliyor.

Ayrıca, eklenti Pexels web sitesiyle de senkronize oluyor. Dolayısıyla, sitede bir fotoğrafı seviyorsanız, Photoshop'ta Pexels panelinin “Beğen” sekmesinde aynı resme kolayca erişebilirsiniz.

7. ColorKit

Fiyatı: Ücretli

ColorKit eklentisi, renklerinizi Photoshop içinde profesyonel bir şekilde yönetmenize yardımcı olur. Renk örneklerini oluşturmak, kaydetmek ve değiştirmek çok zaman alabilir, özellikle de büyük bir projede çalışıyorsanız. ColorKit, normal iş akışını Photoshop örnekleriyle birlikte atlamanıza olanak tanır.

Kullanmak istediğiniz renkleri toplayabilir ve bunları kullanışlı projelere dönüştürebilirsiniz. Üstelik, renklerinizi farklı katmanlara bağlayabilir ve aynı zamanda tek bir tıklamayla tüm bağlı katmanların renklerini de değiştirebilirsiniz.

ColorKit ücretsiz gelmese de, renklerle sıklıkla çalışıyorsanız veya renkleri tek tek elle güncellemek istemediğiniz büyük projeleriniz varsa iyi bir fiyat etiketi vardır.

8. Glifo

Fiyatı: Ücretli

Hiç kendi simge web font koleksiyonunuzu oluşturmak istediniz mi? Eğer evet ise Glifo Photoshop eklentisi tam size göre. Herhangi bir PSD dosyasından vektör simge katmanlarını kullanıma hazır bir simge web yazı tipi olarak dışa aktarmanıza olanak tanır. Glifo ile iş akışı oldukça basittir. Sadece web yazı tipine eklemek istediğiniz simgeleri seçmeniz gerekir ve Glifo her birini otomatik olarak bir Unicode karakterine (özel alandan) atar. Ardından, sadece bir düğmeyi tıklamanız yeterlidir ve Glifo özel simge yazı tipinizi hazırlar.

Glifo size bir SVG, bir HTML ve bir CSS dosyası sunar. SVG dosyası, simgeleri kendileri depolar; HTML ve CSS dosyaları ise, bireysel simgelere ait belirli CSS sınıflarının adlarını ve stillerini tutar. TTF gibi başka bir yazı tipine ihtiyacınız varsa, SVG dosyasını herhangi bir çevrimiçi font dosyası dönüştürücüsüyle kolayca dönüştürebilirsiniz. Bir projede web yazı tipini kullanmak için, projeye SVG, HTML ve CSS dosyalarını içeren klasörü eklemeniz yeterlidir.

9. WebZap

Fiyatı: Ücretli

WebZap eklentisi, UI tasarımınıza ve mockup iş akışınıza entegre edebileceğiniz, Photoshop'a ekstra araçlar ve işlevler ekler. WebZap'ın en önemli parçası, 960 ızgara sisteminin üstünde hızlı bir şekilde web sayfası maketlerini oluşturmayı mümkün kılan kullanışlı bir düzen üreticisidir.

WebZap ayrıca, form giriş alanları, düğmeler, açılır pencereler, gezinmeler, aralık kaydırıcıları ve diğerleri gibi sık kullanılan UI öğelerini de sağlar. Ayrıca, her UI öğesinin şeklini ve rengini düzenleyebilir ve Lorem Ipsum metin bloklarını kolayca oluşturabilirsiniz.

WebZap ayrıca, mockup'unuzdaki farklı noktalara kıvrımları yerleştirmenizi sağlayan bir katlama motoruna sahiptir. Arkaplanınızı da kolayca şekillendirebilirsiniz ve WebZap tasarımınızı geliştirmek için farklı desenler kullanmanıza olanak tanır.

10. Social Kit Pro

Fiyatı: Ücretli

Sosyal Kit Pro eklentisi, Photoshop'ta farklı sosyal medya şablonları oluşturmayı mümkün kılar. Sosyal Kit Pro, Facebook, Twitter, Youtube, Google Plus, Instagram, Linkedin ve diğer sosyal medya siteleri için şablonlara sahiptir. Eklentiyi kullanarak sosyal medya kimliğinizi kolayca oluşturabilir ve yeniden oluşturabilirsiniz. Örneğin, sosyal reklamları tasarlayabilir, sosyal grafiklerinizi güncelleyebilir veya profil sayfalarınızı özelleştirebilirsiniz.

Social Kit Pro ile temelde Photoshop'un içinde Facebook, Twitter ve diğer sosyal medya sitelerinin canlı bir önizlemesini görüyorsunuz. Neden buna ihtiyacın vardı? Sosyal medya siteleri için tasarım yapmak zordur çünkü doğru ölçümleri tutmanız ve her bir varlığı ayrı ayrı dışa aktarmanız ve yüklemeniz gerekir. Tasarımın farklı versiyonlarını denemek istiyorsanız bu oldukça yorucu olabilir. Social Kit Pro bu hantal süreci kolaylaştırır ve sosyal medya sayfa tasarımını önemli ölçüde hızlandırır.

Sonuç

Adobe Photoshop'a Alternatif Programlar

Windows, Mac, Web, iPhone, Linux ve daha fazlası için Adobe Photoshop'a alternatifler. Bu listede Adobe Photoshop'a benzer toplam birçok uygulama bulunmaktadır.

İyi seçilmiş Photoshop eklentileri, günlük tasarım çalışmalarında muazzam bir yardım olabilir. Düzenli bir Photoshop kullanıcısıysanız, bu makalede bahsedilen eklentilerden bazılarıyla birlikte işlevselliğini geliştirmekte tereddüt etmeyin.

Ogznet.com

Yorumlar

    Bu yazıya henuz bir yorum yapılmamış. İlk yorumu yapan siz olun!
Yorum Yaz


yenile

Bir reklam engelleyici kullandığınızı fark ettik

Sorun yok. Kim kullanmıyor ki? Ancak reklam geliri olmadan bu siteyi geliştirmeye devam edemeyiz.

Reklam engelleyicimi devre dışı bıraktım. Devam etmeme izin ver! Reklam engelleyici ile devam etmek istiyorum! Reklam engelleyicimi nasıl devre dışı bırakabilirim?
logo

Bu site için için reklam engelleyici nasıl devre dışı bırakabilirim:

AdblockAdblock / Adblock Plus
  • Tarayıcınızın sağ üst kısmındaki AdBlock / AdBlock Plus simgesine tıklayın.
  • "Aşağıdaki adreste reklamları engelle" seçeneğini kapalı konuma getirin.
  • Değişiklikleri etkinleştirmek için "Tazele" butonuna tıklayın.
FirefoxFirefox Özel Tarama
  • Firefox'ta Özel Tarama yapıyorsanız, "İzleme Koruması" adblock bildirimini kullanabilir. Adres çubuğundaki "Kalkan" simgesini tıklayarak geçici olarak devre dışı bırakılabilir.
  • İşlem bittiğinde bu yardım kutusunu kapatın.
GhosteryGhostery
  • Tarayıcınızda Ghostery simgesini tıklayın.
  • Ghostery versiyon 6.0 altı ise "Whitelist site.", versiyon 6.0 ise "Trust site." ye tıklayın.
  • İşlem bittiğinde bu yardım kutusunu kapatın.
uBlockuBlock / uBlock Origin
  • Tarayıcınızda Ublock / Ublock Origin simgesini tıklayın.
  • Mevcut web sitesini beyaz listeye almak için görünen menüde "power" düğmesine tıklayın.
  • İşlem bittiğinde bu yardım kutusunu kapatın.