WebZap Eklentisi-(Photoshop Plugin)

WebZap bir Adobe Photoshop eklentisidir. WebZap ile çok hızlı, kolay ve düzenli bir sekılde arayüz çizimi gerçekleştirebilirsiniz. Aslında ona çizmek bile denilemez, Sadece bir kaç tık ile sayfanız anında oluşturulmuş oluyor. 

WebZap'la yeni bir ​​dosyanın boyutlarından ( en,boy) tutun, sayfa içerisinde kullanılacak materyallerin (resim logosu, metin'ait, v.s) varsayılan olarak koordinatları ve  yine aynı şekilde boyutları belli bır sekilde karşımıza çıkıyor. Bu ufacık ama gerçekten çok işe yarar eklenti sayfamızda ki tüm renkleri Tam bir uyum içinde bize sunuyor.

WebZap ile şablonumuzu oluşturduktan sonra yazılar, resimler, butonlar veya sayfada bulunan bütün katmanlar üzerinde değişiklikler yapabiliriz. Ayrıca WebZap bize sayfa şablonunu oluştururken kullanacağımız iki çeşit yatay ve dikey menü çeşitleriyle geliyor. Yine şablonumuz da 960 grid sistemini de kullanabiliriz. Konumuz gereği 960 grid sistemine fazla girmiyorum.

WebZap, şuan için Photoshop CS5 ve CS6 sürümlerinde çalışmakla beraber, Macintosh ve Windows işletim sistemlerini desteklemektedir. Kurulumu gayet basit; Adobe Extension Manager ile kısa sürede kuruluyor. Kurulum bittikten sonra şu adımları takip ediyoruz Window>Extensions>WebZap.

Ardından karşımıza şöyle bir WebZap paneli gelecektir. Gayet sade ve kullanımı kolay!

                                                             

Dilerseniz üst kısımdan itibaren başlayalım. Görüldüğü üzere solda iki, sağda ise dört adet menü yer almaktadır. Solda bulunan iki menünün görevi; sayfada yer alacak olan menünün yatay hizalanması, diğeri ise dikey hizalanması içindir. (soldan sağa doğru)

Sağ tarafta yer alan menüler ise sırasıyla şöyledir; yeni sayfa oluştur, 960 grid sistemi kılavuzlarını oluşturur, WebZap ile oluşturacağınız katmanları ayrı sekmede düzenlemek, kesmek için ve son olarak sayfaya yazı eklemek isterseniz bu butonu kullanabilirsiniz. (soldan sağa doğru)

Ana şablonu belirledikten sonra, küçük butonların altında yer alan büyük butonlar üzerinden şablonumuzu şekillendirmeye kaldığımız yerden devam edebiliriz. Özellikle sol üst bölümde yer alan küçük butonlar sayesinde alt sekmede bulunan menülerin ne türden olacaklarını belirlediğimizi unutmayalım. O yüzden bu kısım genel anlamda sayfalarınız nasıl olacağını belirler. Aslına bakılırsa diğer menülere ihtiyaç duymadan tasarımımızı bitirebiliriz. Fakat sıradan ve alışagelmişin dışına çıkmak için iki ve üçüncü menüleri de kullanarak daha fazla eklemeler veya düzenlemeler yapabiliriz. Özellikle form araçları bir iletişim sayfasının olmazsa olmazlarıdır. Bu yüzden iletişim sayfası tasarımı oluştururken en çok kullanacağımız bölüm form sekmesi olacağından hiç şüpheniz olmasın.

Bana göre bir formda olması gereken tüm araçlar WebZap panelinde yer alıyor, eksikleri vardır mutlaka fakat genel olarak bakıldığı zaman çoğunlukla kullanılan materyaller panele eklenmiş. Gayet şık ve düzenliler. Özellikle tüm sayfalara rahatça ekleyebileceğimiz gibi sayfamızın görüntüsünde hiç bir bozulma olmuyor (Katmanlar arası uyum). Renkler diğer katmanlarla uygun halde hazırlanmış.

Üçüncü menüde ise ikondan da belli olacağı üzere, son rötuşları atıyoruz. Birinci bölümde tasarımımıza çerçeve ekleyebilir ve bu çerçeveyi ekledikten sonra keyfinize göre düzenleyebilirsiniz. Tabii bu düzenleme işlemi sadece çerçeve için geçerli değil diğerleri için de aynı olayın mümkün olduğunu unutmayın.

İkinci sekmede Türkçe karşılığı ‘pergel’ olan Dividers ekleyebiliriz. Yalın haliyle çizgiler ekleyebiliriz diyebilirim. Bu çizgiler ile tasarımda belli başlı yerleri bölümlere ayrılabilir. Burası tamamen sizin isteğinizle doğru orantılı, kullanmayabilirsiniz de.

Üçüncü sekmede ise yazı ekleyebilirsiniz. Ekleyeceğiniz yazı üzerinde her türlü düzenlemeyi bu bölümden halledebilirsiniz. Renk, link veya başlık atamalarında renk ayarlamasında hemen buradan yapabilirsiniz.

En son menü de ise aslında pek de ihtiyaç duyulmayacağını düşündüğüm bir vitrin olayı var. Tasarımlarınızı eğer tanıtmak veya satışa sunduğunuz vakit çok işe yarayacaktır. Size tüm yönleriyle hazırlanmış, arka planda gayet uyumlu bir resim ile beraber bir browser görüntüsü yer almaktadır ve bunun içinde de sizin tasarımınız yer alacak şekilde ayarlanmıştır. Tasarımınız bittiğinde isteğinize göre sekme altında yer alan görüntüye tıkladığınızda browser içerisinde sizin tasarımınız yerleşmiş vaziyette PSD dosyası otomatik oluşturuluyor.