PhotoShop ile Web Arayüz yapımı

Photoshop PhotoShop ile Web Arayüz yapımı Photoshop & Tasarım hakkında bilgi paylaş; 1- 600 x 335 px yeni bir döküman oluşturuyoruz. Görünüm>cetvel (ctrl+r) ...
Cevapla
 
Seçenekler
  #1  
Arama 26-03-2008, 05:31
SANALman - ait Kullanıcı Resmi (Avatar)

Yaş: 20
Üyelik Tarihi: 23/10/07
Mesajlar: 350
 
     WS-Ticareti: (0)
Blog Yazıları: 5
Teşekkürleri: 12
39 Msg. 78 Tşkr.
Rep Gücü: 46 SANALman çok çok hoş rep gücü varSANALman çok çok hoş rep gücü varSANALman çok çok hoş rep gücü varSANALman çok çok hoş rep gücü varSANALman çok çok hoş rep gücü var

PhotoShop ile Web Arayüz yapımı

1- 600 x 335 px yeni bir döküman oluşturuyoruz. Görünüm>cetvel (ctrl+r) aracını açıyoruz. alttan 285 ve 310 px mesafelerine cetveli sürükle bırak yaparak yeni iki guide oluşturuyoruz.



2- Rectangle aracımız ile (U) üstteki ve alttakialanlar için iki farklı seçim oluşturup içlerini gradident (g) aracımızla şu değerlerde degrade veriyoruz.
üstteki kısımda 1.renk #35393d ve 2. renk #787b7dalttaki kısımda 1.renk #000000 ve 2. renk #0c0c0c



3- ışık olayını vurgulamak için üstten 2px bir alanı seçili hale getirip 1.renk #484b4d 2.renk 9fa2a4 olacak şekilde yeni bir degrade uyguluyoruz.



4-yeni bir layer oluşturup menüler arası ayıraç çizgisi oluşturuyoruz. 2px genişliğinde iki çizgi üstteki ve alttaki alanlar için oluşturuyoruz.
üstteki çizgimizin içini #676a6d alttaki çizgimizin çini #4d6672 ile dolduruyoruz.



5-beyaz renk ile menümüzü yazıyoruz.



6- header olarak kullanacağımız resmi açıyoruz.
bu resmi menü öğelerinin altında kalacak yeni bir layera yerleştiriyoruz.


7- Rounded Rectangle Tool (U) aracımızı seçiyoruz. üst menüden rouded değerini köşelerde ki ovallik isteğimize göre ayarlıyoruz.
resim üzerinde uygun bir alanda aracımız ile path çizgimizi oluşturuyoruz. ctrl + enter ile çizimi seçime dönüştürüyoruz. Header resmimizin olduğu layerda ctrl+j yapıp seçimi yeni bir layer olarak koplayılıyoruz. Yeni layerde Filter>Blur>Gaussian Blur efektini 5px uyguluyoruz. Layer>Layer Style>Drop Shadow efektini resimdeki değerlerde uyguluyoruz.



8- sitemizin ismini yazdıktan sonra yazı olan layera resimdeki değerlerde efekt uyguluyoruz.




9- son olarak menümüzde maus link üserinde geldiğinde veya aktif link için uygulayacağımız görünüm ayarlarını yapıyoruz.
yeni bir layer oluşturup elip (m) aracı ile bir elip çiziyor ve içini #5c94c5 rengi ile dolduruyoruz. seçimimizi ctrl+shift+i ile tersine çeviriyoruz. selection>feather selection (ctrl+alt+d) aracı ile seçimimize 10 değerinde eritme uyguluyoruz. sonrada klavyeden delete tuşuna basarak eritme geçişini sağlıyoruz. fazlalıkları margie tools(m) aracı ile temizliyoruz. ve sonuç
__________________


Alıntı ile Cevapla
SANALman için teşekkür eden üyeler:
  #2  
Arama 26-03-2008, 06:20

Üyelik Tarihi: 11/01/08
Mesajlar: 209
 
     WS-Ticareti: (0)
Teşekkürleri: 15
1 kez tşk. almış
Rep Gücü: 13 aynacim rep gücü epey yüksekaynacim rep gücü epey yüksek
deneyeceğim bunu sağol.....
__________________
..::Aynacim.Com::.. Ayna ve Çerçeve Tasarımı
Alıntı ile Cevapla
  #3  
Arama 27-03-2008, 02:07

Üyelik Tarihi: 16/09/07
Mesajlar: 323
 
     WS-Ticareti: (0)
Teşekkürleri: 17
17 Msg. 35 Tşkr.
Rep Gücü: 23 aKaLes saygıya değer repi varaKaLes saygıya değer repi var
psd dosyalarını buraada paylaşssaan daha güzel olurr...
__________________
Geniş İçerikli,Kategorilere Ayrılmış Yeni Oyun Sitesi!
Alıntı ile Cevapla
  #4  
Arama 28-03-2008, 02:17
SANALman - ait Kullanıcı Resmi (Avatar)

Yaş: 20
Üyelik Tarihi: 23/10/07
Mesajlar: 350
 
     WS-Ticareti: (0)
Blog Yazıları: 5
Teşekkürleri: 12
39 Msg. 78 Tşkr.
Rep Gücü: 46 SANALman çok çok hoş rep gücü varSANALman çok çok hoş rep gücü varSANALman çok çok hoş rep gücü varSANALman çok çok hoş rep gücü varSANALman çok çok hoş rep gücü var
benim amacım sizin öğrenmenizdi ama neyse veriim tekrar yapiim jpg olarak kayıt ettim çünkü

__________________



Konu SANALman tarafından (28-03-2008 Saat 03:24 ) değiştirilmiştir..
Alıntı ile Cevapla
  #5  
Arama 03-04-2008, 01:45
kenger - ait Kullanıcı Resmi (Avatar)

Üyelik Tarihi: 21/02/08
Mesajlar: 274
 
     WS-Ticareti: (0)
Teşekkürleri: 115
19 Msg. 32 Tşkr.
Rep Gücü: 44 kenger çok çok hoş rep gücü varkenger çok çok hoş rep gücü varkenger çok çok hoş rep gücü varkenger çok çok hoş rep gücü varkenger çok çok hoş rep gücü var
güzel bir paylaşım ,, teşekürler
__________________
,,Herkese Hak Ettiği Kadar Değer Vereceksin,,
Alıntı ile Cevapla
Cevapla


Seçenekler


Benzer Konular
Konu Konu Açanlar Forum Cevaplar Güncel Mesajlar
Photoshop ile Arabaya Alev Yapımı arasx Photoshop 6 18-06-2008 11:20
PhotoShop İle Kafet Yapımı SANALman Photoshop 2 18-04-2008 10:32
Photoshop Buton Yapımı slmgl Photoshop 0 17-02-2008 11:29
Photoshop Dersleri : Su Yapımı kadınca Photoshop 3 22-01-2008 11:40
Post-it Yapımı ( İyi Bir Photoshop Dersi ) Professionel Photoshop 0 24-11-2007 04:39

Link vermek için alttaki kodu sitenize ekleyebilirsiniz. Veya Ctrl+C ile Kopyalayınız
Örnek görünüm: Webmaster Sitesi