Bir Site Yapalım - 2

Flash alt yapısını hazırlayacak olan web sitemizin çalışmasına devam ediyoruz.

Kaldığımız yerden devam ediyoruz. Önceki ders için tıklayın.

Adım 05:
Site yazıları bölümü için de 620x269 ebadında bir dikdörtgen daha çizip öncekilerin en alt kısmına yerleştirin. Rectangle Roundness kısmını 11 yapın. Dolgusunu #F9F9F9, kenar çizgi kalınlığını 1, rengini ise #cccccc yapın. Sonra sağ tıklayıp Arrange > Bring to Back deyin. Böylece şeklimizi en arkaya attık.



Adım 06: Şimdi de menü kısmının yerini hazırlayalım. 3. adımdaki şeklin üzerine 615x25 ebadında bir dikdörtgen çizin. Rengini #CCCCCC yapın, kenar çizgisi olmasın. Alt kısma, site mesajını iletecek grafik alanının üstüne yerleştirin. Bunun üzerine menüleri yazacağız.



Adım 07:
Hoş geldiniz bölümü için ayrı bir şekil yapmanız lazım. Bunun için 5. adımda çizdiğiniz dörtgeni seçtikten sonra ALT tuşuna basıp taşıyarak şeklin yeni bir kopyasını oluşturun. İstediğimiz bu şeklin sadece üst kısmını almak. Bunun için Rectangle aracı ile bir kare çizin ve kopyaladığınız şekilde almak istemediğiniz kısımları bu kare ile kapatın. Sonra iki şekli seçin. Seçmek için SHIFT'e basılı tutarak her iki resme de ayrı ayrı tıklamak yeterlidir. Modify >Combine Paths > Punch menüsüne gidin. Böylece istemediğimiz kısımlar gitti. Şeklin doldusunu #0099FF, kenar çizgi kalınlığı 1, rengini de #CCCCCC yapın. Bu şekli 5. adımdaki şeklimizin üst kısmına birebir şekilde yerleştirin. Hizalamak için Windows > Align panelini kullanabilirsiniz.



Adım 08:
Şimdi orta kısma resmimizi yerleştirmeye sıra geldi. Daha önce Photoshop'ta uygun renklerde bir arka plan hazırlayarak birleştirdiğim lisanslı bir resmi kullandım ben. Siz de benzer bir resim kullanabilirsiniz. Resmi uygun boyutlarda ayarlayıp Fireworks'e import edin. 4. adımdaki şekli kapatacak şekilde üzerine yerleştirin. Sonra CTRL+X ile kesin ve o şekli seçerek Edit > Paste Inside (CTRL+SHIFT+V) yapın. Resmin tam orta yerindeki tutamaç vasıtası ile resmi istediğiniz şekilde dikdörtgenin içinde hareket ettirerek ayarlayın.



Adım 09:
Fireworks kısmını fazla uzatmamıza gerek yok. Bundan sonraya yazılarınızı yerleştirmeniz kalıyor. Şimdi artık son halini aldı diyebiliriz. Yapmamız gereken buna hareket vermek olacaktır. Artık Flash'ta devam edeceğiz. Bunun için sayfayı kaydedin.



Bu çalışmanın PNG dosyasını (Fireworks çalışma dosyasıdır, Photoshop'ta tek bir layer olarak görürsünüz) aşağıdaki linkten indirebilirsiniz.

Bu tasarımı Flash siteye çevirmeyi anlattığımız ders için tıklayın.


  • Etiketler;
Siraceddin El
1999 yılından bu yana web tasarımcı olarak yurt içinde ve yurt dışında sayısız projede yer aldı. 2002 yılında Sanalkurs.net'i kuran ekiptendir. Etkinlik.com.tr'nin de kurucularındandır. Girişimci, tasarımcı ve eğitmen olarak çalışmalarını sürdürmektedir.
Yorum Yaz

Yorum yazabilmek için üye girişi yapmanız gerekiyor!

çok güzel bi çalışma bunları biliyodum.Hatta forum ada koymayı düşünüyodum ama burada gördüm vazgeçtim.:kirp:bide tasarım çok güzel onu beğendim bana bi fikir verdi
:dusun: slm arkadaşım çok ii bir anlatım ama bana ulaşırsan bikaç sorunum var
Gerçekten güzel bir ders, teşekkürler...
Elinize sağlık istifade ettik. Zekat sadece malla yapılan bir ibadet değildir. Allah hepimizi ilminin zekatını en iyi şekilde verenlerden eylesin. AMİN
süperrrrrrrrr
SÜPERRRRRR:kirp:
SÜPER BİŞEY BENDE YPTIM
Gerçekten inanılmaz derecede yararlı teşekkürler..
emeğinize teşşekkür ederim çok faydalı bi ders
Gerçekten harika bir ders. üstelik png dosyasının da indirilebilmesi çok büyük bi jest bence. teşekkürler..
Fikir Dogdu : ) Ama Basit Biraz
Fikir Dogdu : ) Ama Basit Biraz sana gore basit ama başkalarina gore dayildir belkide
arkadaşlar benimde ödevim fıreworksde site hazırlama acaba yardımcı olabilirmisiniz daha geniş kapsamlı olarak :uzul:
Süper Bir Çalış :kirp:

Yukarı Git