Kişisel Portföy Site Çalışması - Photoshop PDF Yazdır e-Posta
Makale Dizini
Kişisel Portföy Site Çalışması - Photoshop
Kişisel Portföy Site Çalışması - Sayfa 2
Kişisel Portföy Site Çalışması - Sayfa 3
Tüm Sayfalar

 Kişisel Portföy Site Çalışması - Personal Portfolio Layout - Photoshop: Site tasarımı konusunda tasarım derslerinin az olduğu konusunda şikâyetler alıyorum. Bu dersimizde güzel bir portföy sitesi için bir tasarım uygulaması yapacağız. Belki birilerinin işine yarar ve hayır dua alırız. Hazırlayacak olduğumuz bu tasarımı sitede ister resim olarak isterse flash içerisinde çeşitli uygulamalarla kullanabilirsiniz. Tabiki flashta bunu kullanmak çeşitli hareketler vermek çok daha güzel olur.

 Kişisel Portföy Site Çalışması - Personal Portfolio Layout - Photoshop

 Ders sonunda aşağıdaki gibi bir sonuç elde edeceğiz.
Kişisel Portföy Site Çalışması - Ders Photoshop

Dersimize başlayalım:
760x770 piksel boyutunda bir sayfa açalım. Fon rengini #333333 yapalım.

Dikdörtgen aracını (Rounded Rectangle Tool) aracını alalım ve Feather değerini 10 pixel yapalım. Bir dikdörtgen çizelim.

Kişisel Portföy Site Çalışması - Ders Photoshop

Daha sonra aşağıdaki resimlerde görünen özellikleri tek tek uygulayalım.

Kişisel Portföy Site Çalışması - Ders Photoshop

Kişisel Portföy Site Çalışması - Ders Photoshop

Kişisel Portföy Site Çalışması - Ders Photoshop

Kişisel Portföy Site Çalışması - Ders Photoshop

Kişisel Portföy Site Çalışması - Ders Photoshop

Kişisel Portföy Site Çalışması - Ders Photoshop

Kişisel Portföy Site Çalışması - Ders Photoshop

Kişisel Portföy Site Çalışması - Ders Photoshop

Aşağıdakine benzer bir görüntü elde etmiş olmalısınız.

Kişisel Portföy Site Çalışması - Ders Photoshop

 


Şimdi elde ettiğimiz bu şeklimizin (dikdörtgen) bir kopyasını oluşturalım. Bu işlemi dikdörtgen layerinin üzerinde sağ tıklayarak Dublicate Layer diyerek yapabiliriz. Bu yeni kopyayı hafif sağa doğru kaydıralım ve bu yeni layerin stil özelliklerinde bazı değişiklikler yapalım. Bu değişiklikleri aşağıdaki resimlerden görebilirsiniz.

Kişisel Portföy Site Çalışması - Ders Photoshop

Bu ayarlar Mavi renkli dikdörtgen için:

Kişisel Portföy Site Çalışması - Ders Photoshop

Kişisel Portföy Site Çalışması - Ders Photoshop

Kişisel Portföy Site Çalışması - Ders Photoshop

Kişisel Portföy Site Çalışması - Ders Photoshop

Kişisel Portföy Site Çalışması - Ders Photoshop

Kişisel Portföy Site Çalışması - Ders Photoshop
 
Kişisel Portföy Site Çalışması - Ders Photoshop

Kişisel Portföy Site Çalışması - Ders Photoshop

Şimdi de bu mavi renkli dikdörtgenin bir kopyasını oluşturalım ve hafif sağa kaydıralım ve bu yeni katmanın stil özelliklerini aşağıdaki gibi uygulayalım.

Kişisel Portföy Site Çalışması - Ders Photoshop

Kişisel Portföy Site Çalışması - Ders Photoshop

Kişisel Portföy Site Çalışması - Ders Photoshop

Kişisel Portföy Site Çalışması - Ders Photoshop

Kişisel Portföy Site Çalışması - Ders Photoshop

Kişisel Portföy Site Çalışması - Ders Photoshop

Kişisel Portföy Site Çalışması - Ders Photoshop

Kişisel Portföy Site Çalışması - Ders Photoshop

Kişisel Portföy Site Çalışması - Ders Photoshop

Şu anki sonuç bu şekilde olmalı 

Kişisel Portföy Site Çalışması - Ders Photoshop


En son ortaya çıkan layerimizin (kırmızı dikdörtgen) bir kopyasını daha oluşturalım ve onun da özelliklerini aşağıda resimlerde göründüğü gibi yapalım. 

Kişisel Portföy Site Çalışması - Ders Photoshop

Kişisel Portföy Site Çalışması - Ders Photoshop

Kişisel Portföy Site Çalışması - Ders Photoshop

Kişisel Portföy Site Çalışması - Ders Photoshop

Kişisel Portföy Site Çalışması - Ders Photoshop

Kişisel Portföy Site Çalışması - Ders Photoshop

Kişisel Portföy Site Çalışması - Ders Photoshop

Şimdi sarı, mavi, kırmızı ve yeşil renklerden oluşan 4 katman oluşturduk.

Şu anki sonuç bu şekilde olmalı 

Kişisel Portföy Site Çalışması - Ders Photoshop

Şimdi yeni bir katman oluşturalım ve elimize “Rounded rectangle tool” aracını alarak daha önce kullandığımız fon renginde (#333333) bir dikdörtgen çizelim. 

Kişisel Portföy Site Çalışması - Ders Photoshop


Bu katmanın özelliklerini ise aşağıdaki gibi yapalım.

Kişisel Portföy Site Çalışması - Ders Photoshop

Kişisel Portföy Site Çalışması - Ders Photoshop

Kişisel Portföy Site Çalışması - Ders Photoshop

Sonuç şu şekilde olmalı 

Kişisel Portföy Site Çalışması - Ders Photoshop

Gerekli yerlere gerekli yazıları (Menü isimlerini) yazalım.

Kişisel Portföy Site Çalışması - Ders Photoshop

Sağ tarafa ise gerekli resimleri gerekli boyutlarda ayarlayarak yerleştirelim.

Kişisel Portföy Site Çalışması - Ders Photoshop

Elimize “ellipse tool” aracını alalım ve aşağıdaki gibi gerekli yerlere daireler çizelim.

Kişisel Portföy Site Çalışması - Ders Photoshop

Şimdi de “Rectangle tool” aracını alıp dikdörtgen çizelim.

Kişisel Portföy Site Çalışması - Ders Photoshop

Sonra üst menüden Filter > Distort > Polar Coordinates girelim ve açıln pencerede aşağıdaki ayarları yapıp Tamam diyelim.

Kişisel Portföy Site Çalışması - Ders Photoshop

Ben bu layeri kaydırıp yönünü değiştirip aşağıdaki şekilde uyguladım. 
Kişisel Portföy Site Çalışması - Ders Photoshop

Bu layerin 3 kopyasını daha oluşturup gerekli yerlere aşağıdaki gibi yerleştirelim.

Kişisel Portföy Site Çalışması - Ders Photoshop

“Rounded Rectangle Tool” aracını tekrar elimize alalım ve bir dikdörtgen daha çizelim. Aşağıdaki resimde olduğu gibi yerleştirelim ve üzerine yazmak istediğimiz yazıyı yazalım
Daha sonra daha önce çizmiş olduğumuz dairelerin kopyalarını oluşturarak yukarıda en son çizdiğimiz dikdörtgenin gerekli yerlerine aşağıdaki resimde olduğu gibi yerleştirelim.. 

Kişisel Portföy Site Çalışması - Ders Photoshop

İşte elde ettiğimiz sonuç bu:
Çalışma dosyasının PSD formatını istiyorsanız bu bağlantıdan indirebilirsiniz…
http://www.talk-mania.com/attachments/web-layouts/140d1169589687-personal-portfolio-layout-layout75.zip
 
Kaynak: Talk-Mania.com
Dersin İngilizcesine ulaşmak için
Tercüme: Kerim Sarıgül

 



***Bu yazı 3001 defa okunmustur.***
 

Yorumlar  

 
+2 #1 Biray 2009-10-05 19:56 Ellerine sağlık abicim, güzel çeviri olmuş. Alıntı
 

Yorum ekle


Güvenlik kodu
Yenile

KIRGIZCA - RUSÇA - TÜRKÇE SÖZLÜKLER

TÜRKÇE ÖĞRETİMİ

ÜYE GİRİŞ FORMU



İSTATİSTİKLER

mod_vvisit_countermod_vvisit_countermod_vvisit_countermod_vvisit_countermod_vvisit_countermod_vvisit_countermod_vvisit_counter
mod_vvisit_counterBugün245
mod_vvisit_counterDün244
mod_vvisit_counterToplam452582

Online : 14
IP Numaranız: 38.107.179.227
Tüm Hakları Saklıdır. Sitedeki ders ve makaleler kaynak göstermek şartı ile kullanılabilir. www.kerimsarigul.com 2005 - 2012