Mim: Tasarım Yaparken Kullandığım Programlar
Tasarım yaparken hangi programları kullanıyorsun diye sorular alıyorum bazen. Fazladan bir program veya hizmet kullanmadığımı, klasik tasarım programları kullandığımı söylüyorum. Herkese tek tek bunları anlatmaktansa günce üzerinde yazmayı daha uygun buldum. Hatta iyi bir mim konusu olabileceğini düşünerek yazımın sonunda bazı arkadaşlarıma pasta atacağım. Belki böylesi daha iyi olur. İnşallah pas attığımız arkadaşlar güzel yorumlarıyla geri dönerler.
Şimdi, gelelim listemize. Herşeyden önce tasarımda kullandığım vazgeçilmez program Photoshop. Grafik tasarım işlerimi hatta işlerimin çoğuna başlangıcımı Photoshop ile yapıyorum. Yakın bir zamana kadar Photoshop’un 7.0 versiyonunu kullanıyordum. Şu sıralar Photoshop CS yani 8.0 kullanıyorum.
Tasarım editörü olarak Dreamweaver 8 kullanıyorum. Her ne kadar Dw sadece bazı noktalarda bana yardımcı olsa da hızlı yetiştirmem gereken işlerde hep kazanç sağlıyor. Bununla birlikte basit veritabanı ve Php işlemlerimi de sağolsun Dreamweaver hallediyor. Şayet ileri düzey bir veritabanına ihtiyacım varsa mutlaka veritabanı şemasını çıkarabilmek için EMS Mysql Manager kullanıyorum.
Animasyon ve basit navigasyon işlerimde Flash 8 kullanıyorum. İtiraf edeyim Flash bilgim o kadar iyi değil. Sadece kendime yetecek kadar biliyorum. (En azından bir top çizip havaya atıp yere indirebiliyorum :) Olsun ileride mutlaka kendimi bu alanda biraz daha fazla geliştireceğim.
Metin editör olarakta her zaman söylediğim gibi Notepad++ kullanıyorum. Bu harika editör 3 yıldır hayatımda ve bir daha kopamadım. Her format sonrası mutlaka ilk kurduğum programlardan birisi oluyor. Özellikle Css ve Xhtml kodlama yapan birisi olarak benim için büyük kolaylık sağlıyor. Unutmadan bir de Free Css Toolbox programı var. Css kod yazanlar için bire bir. Ancak ben kopyacılık olmasın hem de hazıra konmayayım diye bu programı pek tercih etmiyorum. Şayet işin acil teslim edilmesi gerekiyorsa belki kullanırım.
Tüm bunlarla birlikte Php/Mysql sunucu olarak Wampserver‘ı, FTP işlemlerim için FileZilla‘yı, Tarayıcı olarak (tabi ki) Firefox‘u kullanıyorum. Firefox’ta tasarımlarıma yardımcı olan en büyük yardımcımsa Aardvark eklentisi.
Tabi kod yazarken veya Photoshop’ta çalışırken mutlaka Winamp açıktır ve bir Trance parça eşliğinde önce tasarıma sonra uçmaya geçilir :) Bu da işin güzel tarafı ne diyeyim.
Evet tasarım yaparken başlıca kullandığım programlar bunlar. Şimdi gel gelelim paslarımıza;
Yakuter, Dmry, SiberKültür ve Oceangray… Hadi bakalım top sizde :)
(SON SÖZ: Kimi zaman gerçek bir tasarım ortaya koyabilmek için bir iki program yeterlidir. Ancak ilhamınız yoksa isterse onlarca yardımcı programınız olsun bunların hiçbiri bir işe yaramaz!
Güzel günlerde görüşmek dileğiyle…)
Photoshop’ta Kalem Aracı (Pen Tool) Kullanımı
Photoshop’u ister web tasarımı amaçlı isterseniz de fotoğraf manipülasyonu için kullanın yine de bir şekilde yolunuz Pen Tool (P) ile kesişmiştir. Pen aracı aslında Photoshop‘un olmazsa olmazlarından olan ve birçok grafik tasarımcının vazgeçemeyeceği bir araçtır.
Pen tool sayesinde belli bir alanı kesip çıkarma, Shape (şekil) elde etme gibi işlemler yapabiliriz. Bunlarla birlikte Pen Tool ile oluşturduğumuz şekillere belli efektler verebiliriz. Biz bu makalemizde Photoshop’un Pen aracını kullanarak eğik şekillere hakim olmayı öğrenecek ve bunu Glow (Ateşlendirme, Kızartma diye Türkçemize çevirebiliriz) şeklinde nasıl detaylandırabileceğimizi öğreneceğiz. Bu sayede Pen Tool’u nasıl kullanabileceğimizi de sizlerle paylaşacağız. Basit bir iki adımdan oluşan bu uygulama için hemen Photoshop’umuzu açalım :)
Gönderinin Devamını Okuyun…
Photoshopla Kendi RSS İkonumuzu Yapalım

Rss beslemeler ve Rss beslemelere ait ikonlarımız neredeyse blog sitelerimizin vazgeçilmezlerindendir. İnternette hazır olarak bulunan birçok çeşit ve görünümde Rss ikonu bulunmaktadır. Ama kendi Rss ikonunuzu kendiniz yapmaya ne dersiniz?
Bu makalemizde Photoshop kullanarak çok basit bir iki adımda kendi Rss ikonumuzu yapacağız. Bunun ihtiyacımız olan tek şey Photoshop. Hadi başlayalım!
(NOT: Sitemizde elimizden geldiğince Photoshop makaleleri yayınlıyoruz ama bir Photoshop kategorimiz bile yokmuş, ben de bir tane oluşturuverdim. Photoshop isimli kategorimizin ilk yazısı bu oluyor böylelikle :)
Gönderinin Devamını Okuyun…
Photoshop’ta Dolgulu Yazı Oluşturma

Merhabalar, başlığın oldukça itici olduğunun farkındayım. Ancak yazmak istediğim makale ve uygulamaya başka bir isim bulamadım inanın. (Web’de yaptığım araştırmada bu tarz uygulamalara Glossy Text deniyor ancak tam olarak sizlere Glossy Text’i anlatmayacağım, ismini bilen bir dostumuz yazarsa çok sevinirim :)
Yazımızın giriş kısmında örneğini gördüğünüz üzere bu tür metin efektleri Web 2.0′ın bir tasarım özelliği olan “gradient” kullanımıyla mümkün. Kullanacağımız metinlere Photoshop’ta vereceğiniz “Gradient Overlay” efekti ile bu tarz yazı stillerine sahip olabiliriz. Kaldı ki yeni nesil web sitelerinde bu tarz yazıları sıkça görmekteyiz. O halde sözü fazla uzatmadan uygulamamıza geçelim.
Gönderinin Devamını Okuyun…
Photoshop ile Basit Bir Navigasyon Uygulaması

Herkese selamlar, Photoshop Uygulamalarına elimizden geldiğince sitemizde yer vermeye çalışıyoruz. Bu makalemizde de bunlardan birine yer vereceğiz. Basit Photoshop uygulamalarıyla sitelerimiz için rahatlıkla birkaç adımda oluşturulabilecek butonlar ve navigasyonlar yapabiliriz. Aslına bakılırsa yukarıdaki navigasyonu 1-2 dakika içinde oluşturmak hiçte zor değil. Şimdi dilerseniz hemen nasıl adımlar izleyeceğimizi ve navigasyonumuzu nasıl şekillendireceğimizi anlatalım.
Gönderinin Devamını Okuyun…
Ücretsiz Photoshop Fırça (Brush) Kaynakları
Photoshop ile uğraşan kişilerin öyle ya da böyle kendi zevklerine göre oluşturdukları bir Fırça (Brush) arşivi vardır. Fırçalar yapmış olduğumuz tasarımlarda çokça kullandığımız ve iyi kullanıldığında büyük oranda tasarımı geliştiren elemanlardır.
Çoğu zaman kendi fırça arşivime güvensem de yine de arada sırada internette görmüş olduğum ücretsiz fırçaları bilgisayarıma indirip deniyorum. Gerçekten çok hoş çalışmalar ve kaliteli fırçalar bulmak mümkün. Bu yazımda beğenilen fırça kaynaklarına kısaca değineceğim ve sizlere ilgili bağlantıları sunacağım. Umarım sizler için faydalı olur.
Gönderinin Devamını Okuyun…
Photoshopla Gerçekçi Yağmur Efekti
Efendim yeniden merhabalar. Aşağıda birazdan okuyacağınız makaleyi ben yazmadım. Perfectgate.net sitesinden C-Nem yazmış. Sitede okuyunca hoşuma gitti. Yayınlamak için izin istedim ve sağolsun iznini aldım.
Bu yazımızda bir resme yağmur efekti uygulayacağız. Kaynak bir resmin üzerinde yapacağımız bir iki basit Photoshop efekti ile yağmur yağıyormuş izlenimi uyandıracağız. Dilerseniz hemen makalenin devamına geçelim.
Gönderinin Devamını Okuyun…
Photoshop’ta Dolgu ve Fırçalar Oluşturmak
Web tasarımı yaparken en büyük yardımcımız olan Photoshop’ta çokça fırça ve dolgu (brush, pattern) kullanırız. Bu dolgu ve fırçalar özellikle yaratıcı web sitelerinde oldukça karşımıza çıkarlar. Kaldı ki artık Web 2.0 tasarım konseptinin iyice yaygınlaştığı günümüz anlayışında birçok sitede bu tarz dolgu ve fırça işlemlerini görebiliriz. Bu yazımızda sizlere kısaca kendi dolgu ve fırçalarınızı nasıl yapacağımızı anlatacağız ve küçük uygulamalar ile örnekler çıkaracağız.
Bahsettiğimiz işlemleri yapmak için Photoshop versiyonunuz çok önemli değil, 6, 7, CS veya CS2 versiyon olabilir. Ben uygulamalarımı 7 ve CS sürümlerinde yapıyorum. Bu kısa ön bilgilendirmeden sonra hemen uygulamalarımıza geçelim.
KENDİ FIRÇALARIMIZI OLUŞTURALIM
Yazımızın giriş bölümünde belirttiğimiz gibi Fırçalar (Brushes) Photoshop uygulamalarında ve özellikte web tasarımında çokça kullandığımız araçlardır. Bizlerde kendi yapmış olduğumuz şekilleri ve simgeleri fırça haline getirerek sonraki uygulamalarımızda kullanabiliriz. Öncelikle kendi istediğiniz boyutta bir Photoshop dokümanı açın ve sevdiğiniz bir şekli yeni bir layer (katman) üzerinde çizin. Ben aşağıda örnek olması bakımından şu şekli çizdim.

Şimdi çizmiş olduğumuz bu şekli en küçük boyuta getirin. Çiziminizi bir kareye sığabilecek şekilde kesin. Bu iş için Crop aracını kullanabilirsiniz. Çiziminizi kestikten sonra yukarı menüden Edit >> Define Brush bölümünü seçiyoruz. Burada karşımıza gelen küçük pencerede fırça numaramız yazıyor ve bu alanda fırçamıza kendi ismini verebiliyoruz. Bu şekilde kayıt yaptıktan sonra boş bir doküman üzerinde yeni katman oluşturup B tuşuna basarak fırçalara girip kendi oluşturduğumuz fırçayı seçebiliriz. Gördüğünüz üzere kendi fırçalarımızı yapmak gayet kolay. Tek yapmamız gereken şey kendimize özgü ve nerede kullanılacağını bileceğimiz fırçalar yaparak işlerimizi daha da kolaylaştırmak.
ŞİMDİ DE KENDİ DOLGUMUZU OLUŞTURALIM
Photoshop’ta sıkça dolgu aracını kullanıyoruz. Kullandığımız dolguların karakterleri Web 2.0 ile büyük bir değişiklik geçirdi. Eskiden dolgulara verilen önem daha azken şimdi kullanılan değişik dolgu birimleriyle bu konuda da büyük bir adım atıldığını görüyoruz. Web 2.0 konseptli tasarımlara bakarsanız farklı dolgu modellerinin farklı alanlarda kullanıldığını görebilirsiniz. Yazımızın bu bölümünde ise kısaca kendi dolgularımızı nasıl yapacağımızı göreceğiz. Bu iş için bir dolgu modeli belirleyelim ve onu uygulamaya geçelim.
Photoshop’ta birçok dolgu yöntemi vardır. Aslına bakılırsa böyle bir ayrıma gitmek tasarım ufku açısından yanlıştır ancak konuyu daha iyi anlatabilmek ve daha iyi kavrayabilmek için böyle bir ayrıma gitmede bir sakınca görmüyorum.
Dolgu yaparken ilk örneğimizde küçük bir doküman açarak “renk bazlı” bir dolgu yöntemi uygulayacağız. Photoshop’ta 12*12px boyutlarında beyaz arkaplana sahip bir doküman açın. Bu dokümanı en yüksek oranda büyütün. (%1600) Şimdi bu alanda Shift+B tuşuna basarak Pencil Brush aracını seçin. Bu araca 2px değer verin ve renk alanında A8A8A8 rengini ayarlayın. 12 piksellik dokümanımızın ilk 2 pixelini bu dolgu ile doldurun. Daha sonra renk alanında C0C0C0 renk dolgusunu seçin ve kaldığınız noktadan başlayarak yeniden alanı doldurun. Bu şekilde sıralı bir biçimde doküman sonuna kadar ilerleyin. İşleminiz bittikten sonra yine fırçalarda olduğu gibi Edit menüsünden Edit >> Define Pattern alanına gelin. Burada dolgunuza isim vererek dolguyu kullanabilirsiniz. İsterseniz dolgunuzun vermiş olduğu efekti vermek için 400*400px bir boş doküman açın ister yeni bir katman oluşturarak ister oluşturmadan G tuşuna basın. Dolgu aracından Pattern dolguları seçerek kendi yapmış olduğunuz dolguyla çalışmanızı doldurun. Dolgunuzun nasıl göründüğü ortada. Bu işlem gayet kolay ve yapması da fazla çaba gerektirmeyen bir uygulamadır.

Şimdi bir başka dolgu modeline geçelim. Bu dolgu modelinde daha çok resimlerle uğraşacağız. Resim kullanırak yapılan dolgularda dikkat edilmesi gereken nokta ise; dolgunun uygulandığı yüzeyde sürekli tekrarlayacağı için kullanılan ögelerin doğru yerleşimine özen göstermemiz gerektiği. Ancak bu durum her zaman geçerli değil, çünkü sadece tekrarlı çalışmalar yapmayacağız. Dilerseniz kısaca bu yöntemden de bahsedelim.
Şimdi Photoshop’ta 100*100px ve beyaz arkaplana sahip bir doküman açalım. Bu doküman üzerinde bir dolgu oluşturmak için ben Shape alanından bir şekli tercih ettim. Siz de kendi belirlediğiniz küçük bir şekil veya resmi doküman üzerinde kullanabilirsiniz. Resim ögemizi seçtikten sonra bu ögeyi sayfa üzerine belli aralıklarla diziyoruz. Burada sizi yönlendirmek istemiyorum çünkü bu sizin dolgunuz olacak. Ben aşağıda gördüğünüz şekilde dolgumu yaptım ve bunu Edit >> Define Pattern alanından MyPattern adını vererek kaydettim. Dolgumu yaparken dolgunun kendini tekrarlayacağını düşünerek yerleşimi dokümanın ortasına göre yaptım ve daha sonra bunu dolgu olarak başka bir alanda deneyerek sonucu gördüm.

Sadece bu yöntemle sizlerde kendinize farklı dolgu örnekleri hazırlayabilirsiniz. Yukarıda az çok belirtmeye çalıştığım gibi resim bazlı ve farklı dolgu modelleri sayfamızın görünümüne daha fazla renk katacaktır. Özellikle kararlı ve tasarımın gidişini olumlu yönde etkileyecek dolgular Web 2.0 konseptine çok uygun tasarım klişeleri arasında sayılmaktadır.
Umarım bu kısa makale sizlere kendi dolgu ve fırçalarızı hazırlamak için yararlı olur.


