Bir Tasarımın Anatomisi: Alkışlarla Yaşıyorum

02 Nisan 2009
Bir Tasarımın Anatomisi: Alkışlarla Yaşıyorum

Geçtiğimiz günlerde yeni tasarımı ile yayına giren alkislarlayasiyorum.com’un tasarımının perde arkasını incelemeye ne dersiniz?

Aralık ayının sonlarına doğru bünyesinde bulunduğum MYK Medya bünyesine katılan Alkışlarla Yaşıyorum sitesinin yeni tasarımı için kolları derhal sıvadık.

Öncelikle ihtiyacımız olan sitenin konseptine uygun retro bir logo idi.  Hayal ettiğim logoyu üretmek ve üzerinden bir kaç ufak revizyon ile final hale getirmek çok zor olmadı. Tam da sitenin havasına uygun, eğlenceli ve bir dönemin tasarım öğelerini taşıyan bir logo olmuştu.

aylogo

Logo onaylandıktan sonra, deyim yerinde ise saha çalışması başladı. Aklımda sitenin içerik ve konseptine uygun olarak, belli bir dönemi yansıtacak retro-vintage stilinde bir tasarım yapmak vardı. Zaten genel olarak MYK ve Alkışlarla ekibinin de eğilimi bu yönde olduğu için biraz kaynak araştırması yapmakla başladım işe.

Bu site aradığım sorulardan bir kaçına yanıt oldu, burası da yine ilgi çekici bir kaynak oldu, buraya bayıldım, burası ve bu site de fikirlerimi geliştirmeme yardımcı oldu.

Tamamen retro içeriğe sahip bu blog müthiş bir kaynak, buradan fikir almak amacı ile sayısız retro desene ulaştım, burada ise o döneme ait bir çok reklam içeriğine ulaştım.

Bu adreste rastladığım robot koleksiyonu farklı ilhamlar verdi, flickrdaki bu set ise yine dönem reklamları ile igili çok iyi bir kaynak oldu. Bu araştırmada karşıma çıkan siteler tabii ki bu örneklerle sınırlı değil, size fikir vermesi açısından bir kısmını paylaşmak istedim.

Bu kaynaklar beynimin bir yanını kurcalamaya devam ederken, bir yandan da dünya üzerinde yayında olan isim yapmış ya da ilgi çekici video paylaşım sitelerinin listesini çıkartıp, kağıda dökerek üzerinde analizler yapmaya başladım. Bu çalışmanın sonunda artık bir toplantı vakti gelmiş, analiz ve notlarımı MYK ekibi ile paylaşmak üzere demli çaylarımızla birlikte toplantı masasının başındaki yerimizi almıştık.

aytoplanti

Amacımız sadece tasarım olarak değil fonksiyonel olarak da alkışlarla yaşıyorum’a ne katabiliriz, ne tip yeni fonksiyonlar ekleyebilir, ya da mevcut öğeleri nasıl iyileştirebiliriz sorularına yanıt bulmaktı.

Bu çalışmanın ardından boş bir photoshop belgesi ve hazırlanmış yeni alkışlarla logosu ile tasarıma start verdim.

ayretro

Anlaşılan bu retro havayı en iyi eskimiş kağıt efektlerinin yanı sıra yine özel dönem objeleri ile vermek kullanıcı açısından, hem havaya girme hem de kolay anlaşılır olması açısından iyi bir çözüm olacaktı. Buradaki obje seçeneklerim ise tam 70-80′li yılları anımsatacak Atari 800xl, Atari oyun kolu, bir Mintax kutusu, Volkswagen kaplumbağa, bir teyp kasedi ve biraz daha 60′lara kayarak gökkuşağı oldu. Bunun üzerine bir dönemin unutulmazı Polaroid kartlar içerisinde manşet alanımızı ekleyince, header altı alanımız kendini buldu.

aymanset

Bu arada navigasyon ve site içinde yine amacına uygun olarak SuperDelicious fontunu seçtim, aynı zamanda logoya hayat verende bu font oldu.

Side barda yer alacak kutuların arka planı için o dönemlerde özellikle bir çok evin mutfağının vazgeçilmez perde desenini kullandım. Bu benim içinde nostaljik bir an oldu.

ayperde

Bu konsantrasyon, aslında sizi yarattığınız proje ile yaşatıyor bazen. Bu işleri yaparken itiraf etmeliyim ki bol bol ABBA dinledim. Çok faydalı oldu doğrusu!

Banner alanına gelince şirin retro bir robot tasarımda yerini aldı. Reklamın arkasında hınzırca kullanıcıya bakmasının bu detayı yakalayanlar açısından hoş olduğunu düşünüyorum.

ayreklamban

Ana sayfanın içerik listelemesini yine eskimiş kağıt parçaları ile uygulamayı düşündüm, bu aslında farklı kategorilerdeki içeriklerin gösterimi için zor olsa da onlarıda kendine özgü birer ikon hazırlayarak üstesinden gelmeye çalıştım.

aycontent

Bu gibi durumlarda bir tasarımcının sadece kendi işini değil css kodlama ve yazılım ekibini de düşünmesi gerekiyor. Zira değişken içerikli bir sitede tasarım adına uçmanız hem css kodlamayı zora sokar, hem de canlı yayına geçince birbirinden farklı içeriklerin uzunluk yada kısalıklarına göre tasarımınızın patlama ihtimali artar.

Site içeriklerinde son dönemin moda fontu olan ve bir çok kişi fark etmese de en kolay okunabilen fontlardan biri olan Georgia fontunu tercih ettim.

Sayfalamayı da bu tadda hazırladıktan sonra, sitenin alt kısmı olan footer’ı tamamladım. Burada sosyal medya bağlantılarını yine şirin retro bir robotçuk ile kotardım.

ayfooter

Site içeriği ile eşsiz olduğu için kullanıcının aklına gelebilecek her detaya hızlıca ulaşması açısından hem tepede hem de alt kısımda arama alanları oluşturmayı ihmal etmedim.

aylove

İçerikleri oylama konusunda bir zamanlar çok moda olan I Love rozetleri ile, alkışlar ile yaşayan bir site olarak, alkışlayan el ikonu koymak arasında kararsız kaldık. Yaptığımız ikon çalışmalarının kendini o alanda yeterince ifade edemediğini görünce benimde aslında favorim olan rozetlerde karar kıldık.

ayplay

Alt sayfalara sıra geldiğinde, o sayfalarda yer alacak  elementleride yine aynı konsepte uygun olarak çalıştım tüm tasarımı tamamlayarak css kodlaması için teslim ettim.

ayicerik2

Alkışlarla Yaşıyorum bu yeni tasarımı ile geçen hafta yayına girdi, zaman içerisinde giderilecek bazı eksikleri elbette var. Ancak eski halini hatırlayacak olursak, attığımız adımın ne kadar ciddi olduğuda gerçek.

ayeski

Tüm süreç göz önüne alındığında aslında burada paylaştıklarım çok kısa kalıyor olsa da, yeni tasarımcılar için bir projede yaşanan süreçler açısından fena bir örnek olmadığını düşünüyorum.

Bu süreçte bol bol beyin fırtınası yaşadığımız başta Serdar Kuzuloğlu, tüm MYK Ekibindeki çok değerli iş arkadaşlarıma ve uykusuz gecelerin css üstadı Fatih Hayrioğlu’na, bu işte emeği, fikri geçen herkese gönülden teşekkürler.

İlgili Yazılar

Bu yazı için 31 Yorum yapılmış

oztecnic 02 Nisan 2009

Çok başarılı…

Projenin en azından tasarım aşaması sonlanana kadar nasıl geliştiğini göstermesi bakımından çok önemli faydalı bir paylaşım…

İdeali bu olmasına rağmen her koşulda süreçler bu şekilde gelişmiyor ne yazık ki; bu ise başka bir tartışma konusu…

Değerli paylaşımınız için teşekkür ederim…

Yücel YILMAZ 02 Nisan 2009

Süper…

Tam istediğim yazı olmuş. Benzer yazıların devamının gelmesini dilerim.

Erkan 03 Nisan 2009

Tasarım her yönüyle gerçekten mükemmel olmuş. Bu yazıyı kaleme almanız da ayrıca bir güzellik tabi. İçeriğine ise diyecek laf bulamıyorum!

Sinan Serez 03 Nisan 2009

Bu sitenin tasarım aşamasının bukadar zahmetli olabileceğini hiç düşünmüyordum, alkışlarlayaşıyorum ekibinin kalitesini yansıtan bir tasarım olmuş, sizi tebrik ediyorum Hasan Bey, ayrıca bu sitede emeği geçen herkese de sonsuz şükranlarımı sunuyorum.Lütfen kalitenizden hiçbir zaman ödün vermeden yola devam edin.Saygılar.

Sinan İŞLER 03 Nisan 2009

gerçektende çok yararlı ve eğlenceli bir yazı olmuş elinize sağlık üşenmeyip bizlerle paylaştığınız için…

Şevket 03 Nisan 2009

Sayenizde hepimiz yeni tasarımın nasıl oluşturulduğunu biliyoruz. Sanki hepimiz projede görev almış gibi. Ellerinize sağlık.

serhat celep 03 Nisan 2009

hasan abicim ellerine sağlık. müthiş bir tasarım ve yine müthiş bir yazı olmuş. limonata tadındaki eski sitesi geldi yazıyı okurken bir an gözümün önüne de, -ki zaten yazının sonuna da çakmışsın imajı- katedilen yol inanılmaz. Eğer altın öcümük yarışmasına katılırsanız, ve 1. seçilmezseniz altın öcümüğünde “sezarın hakkı sezara” politikasını savunduğundan ciddi anlamda şüphe duymaya başlıycam. “Ellerine sağlık, hadi durma kutla bu zafer senin” adlı şarkı sözleriyle de yazıma son vericem.

Berk Gün 03 Nisan 2009

Eline sağlık yazı ve tasarım için. listeleme seçeneklerinin olduğu tırtıklı bölüm dışında çok hoşuma gitti

@li 03 Nisan 2009

Çok güzel olmuş, tebrikler.

Kadir GÜNAY 03 Nisan 2009

Sonuna kadar zevkle okudum. Tasarım anlamında nelere dikkat edilmesi gerektiği konusunda faydalı bilgiler öğrendim.

Teşekkürler Hasan abi. Ve tebrikler.

Serdar Demireren 03 Nisan 2009

alkislarlayasiyorum.com u nasıl olduysa benim de keşfetmem 1 hafta öncesine dayanıyor MYK ekibi olarak gerçekten güzel bir tasarım ve güzel bir içerik hazırlamışsınız (:

ayrıca site içindeki içerikler kesinlikle çok sağlam, oyunlar, yazılar, videolar… hepsi birbirinden eglenceli zamanında görüp şimdi unuttuğumuz, yada mumla aradığımız belgeler…

son olarak MYK bünyesinde barınan her sitenin birbirini bu kadar iyi desteklemesi gerçekten güzel. Bu siteleri gezerken sanki tek bir sitenin alt sayfalarında geziyormuş gibi bir bütünlük var..

Kesinlikle başarılı bir tasarım elinize sağlık (:

yakuter 04 Nisan 2009

Tasarımcının El Çantası için daha faydalı bir makale olamazdı. Ellerine sağlık Hasan usta. Ne kadar teşekkür etsek azdır.

eddie 04 Nisan 2009

abi tebrik ederim bende kendi blogumu geliştirmeye başladım.
burada paylaştığın işlem aşamaları bana tasarımımda yardımcı olacak gibi. çok teşekkürler.
son olarak ilk halinden çok farklı bir yapıyya sahip olmuş.
gerçektan güzel bir dizayn.

Burak Özdemir 04 Nisan 2009

Çok güzel iş çıkarmışsınız sahiden. Tebrikler.

Emre EĞRİ 05 Nisan 2009

Güzel bir tasarım anlayışı içerisinde yol katedilmiş. Siteyi incelemem sonucunda Görsellik yanında kullanışlığıda dikkatimi çekti. Böyle güzel tasarımlarınız ile nice ödüllere. Tebrik ederim.

Emre Savaş 05 Nisan 2009

Yeni tasarımı görünce kısa süreli şok geçirdim. Yapılan retro tarzı tasarım türkiyede parmakla gösterilecek türden bir iş. Tek kelime ile muhteşem.

ahmet alp balkan 11 Nisan 2009

Gerçekten ellere sağlık, mükemmel :)

Can Ürek 13 Nisan 2009

Hem anlatım hem de site harika olmuş. Elinize sağlık.

Özkan Evin 18 Nisan 2009

Güzel tasarım ama dosya indir butonunun olmaması büyük eksiklik :/

Barış Özcan 24 Nisan 2009

Sitenin tasarımını zaten beğeniyordum. Perde arkasını görmek ve yapım aşamalarını okumak çok faydalı oldu. Teşekkürler.

murathan 04 Mayıs 2009

eline sağlık gayet güzel bir tasarım olmuş merak ettiğim konu tasarımın genel olarak bitmesi ne kadar zaman aldı.

Cihan Aksu 09 Mayıs 2009

Yazı o kadar güzel ki, gerçek olmasına şaşırdım.Umarım devamı gelir, ve bize en azından fikir bazlı bir katkı sağlar.Yeni tasarım şahane olmuş acaba kim yapmış diyordum ve ben bi şekilde bu yazıyla karşılaştım.

Ömer 23 Mayıs 2009

Tek kelimeyle müthiş, üç kelimeyle; tek kelimeyje müthiş.

Geri izlemeler

Siz de Yorum Yapın!

İsim (Gerekli)
Eposta (Gerekli, yayınlanmayacaktır)
Web sitesi

Additional comments powered by BackType


USERSPOTS
Pcnet
Portföy Galeri Portföy Galeri

Promosyon Şensoy evden eve nakliyat 0212 211 23 24-0216 575 60 89

Takip

E-posta adresiniz yazınız:


Ayrıca RSS beslemesini kullanabilirsiniz.


En Son Yorumlar

Hasan Yalçın Hasan Yalçın visitor stats

Tema Tasarım Hasan Yalçın

Kodlama Fatih Hayrioğlu

Wordpress Entegrasyon Yakuter

İletişim için tıklayın!