Tüm web sitesi türleri arasında, portföy sitesi en zor engellerden bazılarının üstesinden gelmek zorundadır. Hemen hemen tüm tasarımcılarla konuşun ve onlar da kabul edecekler, kendi portföy sitenizi başlatırken acı verici bir süreç. En sık olarak, bu süreç sayısız versiyonları ve çoğu kez de, tamamen hayal kırıklığı yaratır.

Benim düşünceme göre, portföy sitesi web tasarımının geleceğine bir pencere olabilir. Bunu öneririm çünkü bir birey kendi sitelerini tasarladığında sadece kendilerine empoze edilmiş sınırlamalar altındadır. Şeyleri dikte edecek hiçbir müşteri, tasarımı tahrip edecek hiçbir komite ve işleri sürükleyip momentumu tahrip edecek bir onay süreci yoktur.

Ancak tüm portföy siteleri eşit oluşturulmaz. Mevcut örnek portföy sitelerinin çılgın miktarına rağmen, bu konuda konuşmak için yeterince farklı ve ilginç hissettiren şaşırtıcı derecede az sayıda var. Yine de, bu siteleri, çubuğu yükseltmek ve geleceğin web tasarımı için ne tutabileceğini ortaya koyan bu siteler.

Büyük bir dizi çarpıcı portföyün içine girelim ve onları işe yaratan bazı ortak unsurları arayalım. Bu unsurların bazıları sektördeki eğilimleri ortaya çıkarırken, diğerleri basit ve ortak tasarım geliştiklerini göstermektedir. Hepsinin büyük bir anlamı yok, ama hepsi gerçekten olağanüstü bir portföy sitesi oluşturmanıza meydan okuyacak fantastik tasarımlara katılıyor.

Bir hikaye anlatmak

Modern bir portföy sitesinin en ilginç yönlerinden biri, hikaye anlatma ortamı yaratma çabasıdır. Buradaki fikir, kullanıcıya deneyimini ve mesajını esas olarak kontrol eden bir içerik akışı yaratmaktır. Bu kontrol istenilen bir sırada bir içerik akışı yaratır.

Birçok site, ana navigasyonu istenen bir sıraya yerleştirerek bu tür bir şeyi yapmaya çalışır. Ancak bu siteler yaklaşımı tüm seviyeye getiriyor ve onu deneyimin kaçınılmaz bir parçası haline getiriyor.

Jan Ploch

Tek bir sayfa sitesinin kullanımı yeni bir şey değildir ve tanımı gereği bir kullanıcıyı sayfayı aşağı kaydırmaya zorlar. Bu sayısız kez kullanılan doğal bir içerik akışı oluşturur. Bu sitede olsa da, animasyonlu bir arka plan ile nadiren kullanılan bir yaklaşım buluyoruz. Sayfayı aşağı kaydırdıkça, arka planda bulunan soda samanı emiyormuş gibi.

Bu basit, dekoratif eleman gerçekten güçlü bir şey yapar; sayfanın sonuna kadar ilerlemenizi teşvik eder. Bu, tek sayfa sitesinin temel olarak kritik bir yönüdür: kullanıcıların hikayenin sonuna gelmesini sağlamak. Ve hikayenin sonu genellikle sitenin dönüşüm noktasıdır (bu durumda olduğu gibi).

Tam Cai

Bu bireyin sitesi de tek sayfa, hikaye anlatımı modelini göstermektedir. Bu özel site hakkında ilginç bulduğum şey, hikayenin ortadaki bütün etlerle birlikte iki güçlü görsel tarafından sona ermesi. Sayfanın üst kısmındaki büyük illüstrasyonlar bir ruh hali yaratır, sanatçının kişiliğini gösterir ve sizi genellikle dünyasına dalmaya davet eder. Sayfa daha sonra bir iletişim seçenekleri (dönüştürme noktaları) ile bitiyor ve ne yapacağımızın dramatik bir fotoğrafı yaratıcısı.

Kesinlikle herkes için bir tarz değil, ama tematik bir yaklaşım, bu şekilde cilalanmış şekilde üretildiğinde, sonuçlar harika olabilir. Sitenin tüm ziyaretçilere hitap etmemesine rağmen, doğru kişilere hitap edecek ve içerik oluşturucunun değer vereceği bağlantılar yapmasına yardımcı olacak.

MacMillan Lynch

Bu örnek biraz farklı bir yaklaşım gerektiriyor. Bu sitenin hikaye kısmı kısa ve hepsi ana giriş sayfasının içinde yer alıyor. Bu durumda, hikaye anlamak için bir gizem duygusu yaratması dışında, oldukça ilgisizdir. Siteye indikten sonra kendimi bu kişinin neyle ilgilendiğini merak ettim. Bazen ziyaretçilerinizi kaşıkla kaşıklamak istersiniz; Diğer zamanlarda onları ilginç bir hikaye veya gizemle emmek için çok iyi çalışabilir. Bu aynı zamanda oldukça farklı ve ümitle unutulmaz bir site yaratmanın avantajına da sahiptir.

Selam Tasarım

Sallee Design sitesinde, site yapısına daha tipik bir yaklaşım buluyoruz. Üst soldaki logo, üstteki ana gezinme ve standart ana sayfa slayt gösterisi. Birçok yönden bu çok normal bir site (güzel bir tasarım uygulanmış).

İlginç bulduğum şey, ana sayfa slayt gösterisinin sadece otomatik olarak dönen Flash görüntüleri dizisi olmamasıydı. Bunun yerine, slayt gösterisi kullanıcı tarafından başlatılır ve bir tur başlama davetiyle başlar. Bir kez daldığınızda, sitenin çeşitli sayfalarında kazılırken elde edeceğiniz şeyleri özetleyen bir dizi slayttan geçirilir. Ve her şey sitenin geri kalanı için anahtar adımlarla tamamlandı.

Bu yaklaşımın akıllı olduğunu düşünüyorum. Yeni başlayanlar için, ana sayfa kaydırıcısı gibi bir öğeyi ayrıntılı bir şekilde planlanmış bir amaç görmek için ferahlatıcı. Ayrıca, tek bir sayfa satış konuşmasının avantajını ve daha fazla sayıda sayfaya sahip olmanın sağladığı bonus SEO'yu da çok seviyorum.

Duyarlı tasarım

Konusu duyarlı web tasarımı en az söylemek gerekirse, son derece sıcak bir konu. Dolayısıyla, bu yaklaşımın şu anda üretilmekte olan yeni portföylerde bulunabileceğini bulmak hiç şaşırtıcı değil. Engelsiz, bu bireyler yeni tekniği kucakladı. Şaşırtıcı olmayan bir şekilde, buradaki örneklerin üçü, ön uç geliştiricilerin portföy siteleri için, tam olarak böyle bir şey bulmayı beklediğimiz bir yer için.

Ryan Taylor

Ryan'ın sitesi kişisel bir portföy için standart bir sayfa formülünü takip ediyor. Bu yaklaşım, duyarlı teknikleri siteye entegre ederken harika çalışır. Bunu hesaba katmak için sadece bir sayfayla test etmek ve böyle bir site inşa etmek çok daha kolay olabilir. Ama kolay olmadığını düşünün. Bu şekilde dönüşen temiz ve güzel bir site oluşturmak için çok çaba sarfetmek ve planlamak gerekir.

Aaron Shekey

Sıradaki Aaron Shekey'in portföyü. Bu güzel küçük site, bir portföy sitesi için birçok denenmiş ve gerçek teknikleri kucaklar. Yarı minimalist, görüntülerin patlamasına izin veren renkleri bastırdı ve büyük ölçüde tipografiye dayalı bir tasarıma sahip. Bu site gibi güzel çalışıyor ve sanatçının çalışmalarını göstermek için son derece verimli. Ancak, duyarlı bir düzende eklenen bonus sayesinde, sitenin çok çeşitli cihazlarda iyi görünmesi garanti altına alınmıştır. Bu, kullanıcının yakınlaştırma ve tarama sıkıntısı yaşamadan pozitif bir deneyim elde etmesini sağlar.

Andrew Cohen

Son olarak, duyarlı kategoride, ön uç geliştirici Andrew Cohen'in kişisel sitesini buluyoruz. Diğerleri gibi arka plan odaklı bir tasarım olarak adlandırdığım tek bir sayfa yapısı vardır. Bu şekilde arka plan, yapısal değişikliklere büyük ihtiyaç duymadan değişebilir ve değişebilir. Bu, siteyi duyarlı teknikler sunmak için mükemmel bir aday haline getirir.

Yaratıcı düzenler

Bazen bir izlenim yaratmanın en iyi yolu, benzersiz ve farklı olarak öne çıkmaktır. Bunu gerçekleştirmenin daha iyi bir yolu, hepimizin sahip olduğu norm ve beklentilere hitap eden alışılmadık bir düzen yapısıyla değil. Bir dereceye kadar bu koleksiyondaki hemen hemen her örnek bu özel niteliği göstermektedir, ancak bunu göstermek için bu küçük alt kümeyi seçtim.

Ve dalıştan önce, bu sitelerin sadece yaratıcılık için yaratıcı düzenlerden yararlanmadığını belirtmek istiyorum. Bunlar, son derece açık ve kullanımı kolay olan işlevsel sitelerdir. Yine de, onların öne çıkmalarına izin veren kendi ayrı kişiliklerine sahipler. Bu, bir portföy sitesinin ne yapması gerektiği ile ilgilidir: Yaratıcısına kalabalığın arasından sıyrılmasında yardımcı olun.

Krichevtsova Alexandra

Bu örnekle ilgili olarak yaratıcı düzenler konusuna gerçekten çok sevdiğim şey, bunun radikal olarak farklı bir düzen olmamasıdır. Evet, site sol üstteki normal logoyu takip etmiyor, en üstteki yaklaşımda gezinme. Düzen, ancak oradan sadece birkaç küçük adımdır. Bunun son derece iyi olduğunu düşünüyorum.

Amaç yaratıcı olma uğruna bir düzen icat etmemek. Ancak, bilgiyi mümkün olan en iyi şekilde iletmek için sayfayı ortaya koyarak yaratıcı olmak. Bu durumda, hafif atipik düzen tarafından oluşturulan akış harika çalışır.

David Desandro

Bu durumda düzen tamamen sıradışı hissediyor. Bazı seviyelerde eksik hissettirir, ama aynı zamanda tamamen organize ve kullanımı kolaydır. Portfolyoya ve diğer sayfalara göz atın ve bu sitenin sunduğu çeşitlilikten kolayca etkileneceksiniz. Bu kesinlikle yaratıcı, ama teknik olarak fikirli bir itiraz var.

Deidre Bain

Bu bir sayfa kaydırma sitesi de düzen yapısının normlarını kırar. Bu örnekte neredeyse tüm tasarım, sayfalara özgü düzen ve resimlere dayanmaktadır. Tipik olarak bu iyi çalışmayan ve bakım sorunlarına yol açan bir yaklaşımdır. Ancak kişisel bir portföy sitesi durumunda, aslında bazı yararlı becerileri göstermek için harika bir yoldur. En özellikle, bu tasarımcıyı bir şeyleri takip eden türden olmak için beklemenizi sağlayan site için bir ayrıntı vardır. Kendi portföy sitenizde iletişim kurmak için son derece güçlü olabilecek bu tür ince mesajlardır.

Siddharth Arun

İlk önce bu siteyi standart protokolü takip eden bir hissi var. Ancak siteyle biraz etkileşime giriyor ve tamamen benzersiz hissediyor. Bazen kendi yaratıcı dokunuşunuzla yaklaşmak, herşeyi yeniden keşfetmeniz gerektiği anlamına gelmez. Sadece sonuçların şaşırtıcı (ve fonksiyonel) olması için yeterince değiştirin.

Kalın yazı

Burada toplanan sitelerin küçük resimlerini gözlemlediğim gibi bir şey gerçekten göze çarpıyordu: Son derece geniş ve cesur bir metnin kullanımı. Aşağıda listelenen örnekler, sitede öne çıkan muazzam metne sahiptir. Bu yaklaşım için ortaya çıkmamın ana nedeni açıklık.

Bu büyük kalın metin, en az bir birincil iletinin iletilmesini sağlar. Bazı durumlarda diğerlerinden daha işlevsel hisseder, ama sonuçta sonuç her zaman aynıdır. Kullanıcının dikkatini bu jumbo boyutlu kopyaya yönlendirmek neredeyse garantilidir. Örnekleri inceleyin ve reklam öğelerinin bu öğeyi işe koyduğu çeşitli şekilleri not edin.

Garth Humphrey

Justin Burns

Amman Ürdün

Ross Angus

Alex Pierce

Üstte kırp

Daha önce de belirttiğim gibi, bazı modeller diğerlerinden çok daha az işlevsel ve anlamlı. Bu durumda, aşağıdaki örnekleri anlamsız bir kümeye yerleştirirken neredeyse kendimi kötü hissediyorum. Aşağıda yer alan siteler kesinlikle muhteşem; lütfen bu sınıflandırmayı hiçbir şekilde hakaret olarak kabul etmeyin. Aslında bu makaleden en sevdiğim sitelerden ikisi burada bulunur.

Temel olarak, desen, bir çeşit dekoratif şerit, bir katı çizgi veya zigzag deseni üstte görünür. Bu seti üç siteyle sınırlandırdım, ancak diğer örneklerin bazılarını tararsanız, aynı öğeyi işte bulacaksınız.

Neden bu kadar küçük bir detay bu kadar yaygın? Belki de tek sayfa yaklaşımı ile sayfanın üstünü göstermek güzeldir. Bu sayede kullanıcılar sayfanın başladığı yere göre küçük bir görsel işaret elde ederler.

Mathieu White

İnekler'e dokunun

Danilo Giagnoli

Doku doku

Portföy sitelerinde oldukça yaygın olan bir başka görsel detay dokudır. Bu arka plan öğeleri söz konusu olduğunda özellikle doğrudur. Mevcut görsel stilin bir kısmı arka plana ince dokular içerir.

Bu öğenin, teknik alt yapısından kaldırılmasına yardımcı olan bir sayfaya organik bir eleman ekleyerek harika bir iş çıkardığını gördüm. Bu basit eleman, bir ton yaşamı bir şekilde bir tasarım içine çeken sıcak bir dokunuş ekleyebilir. Yine, daha önce kapsanan örneklerin çoğunu kazın ve işte bu elementin çok sayıda örneğini bulacaksınız. İşte bunu son derece iyi yapan birkaç örnek.

Bjarke Clauson-Kaas

Aaron Lumsden

DS Higdon

Andrew Ckor

Dikkat çeken diğer portföy siteleri

Bu tür koleksiyon için sayısız aday var. Bu durumda neredeyse çok fazla örnek içermesi cazip. Bunun yerine, oldukça geniş bir stil, yapı ve genel yaklaşım yelpazesi sunan ek bir site koleksiyonuna odaklandım.

Dikkat çekeceğiniz bir şey, bu sitelerin bir kaçının tasarımcılar için olmaması. Diğer endüstrilerin bir şirketi satmak için interneti nasıl kullandığını görmek çok ilginç buldum. Sonuçta, bir portföy sitesi tam olarak bunu yapmak için tasarlanmıştır. Dolayısıyla, ilham ve yeni fikirler uğruna, web tasarım topluluğunun dışında birkaç tane yer aldım.

Collin Henderson

Josh Miller

Nate Croft

Torsten Meb

Joey Rabbitt

Eric Salvail

Bekka Reese

Felix Menard

Marija Zaric

Tobias Persson

Jake Dahn

Sonuç

Sizi çevrimiçi temsil edecek bir site oluşturmak küçük bir girişim değildir. Umarım burada toplanan siteler size ilham verir ve size meydan okuyacaktır.

Burada sunulan unsurlardan bazıları, kullanıcı deneyimini kontrol etmek ve bireyi satmak için çok kasıtlı mekanizmaları temsil etmektedir. Diğerleri daha fazla veya daha az görsel tasarım eğilimi göstermektedir. Sanırım hiçbir şey göz ardı edilmemeli ve ne de tek başına bir şeyleri kontrol etmemeli. Normları zorlayarak, işlevsel kalıpları benimseyerek ve görüntünüzü çevrimiçi olarak, göze çarpmanıza yardımcı olacak devrimci fikirlere yol açabilecek yeni bir ışıkla değerlendirmek.

Ve ayakta durma konusuna gelince, insanlara buradaki amacın en orijinal arayüzü icat etmediğini hatırlatmak zorunda hissediyorum. Bunun yerine, amacımız sahip olduğumuz sınırlamaların içinde yaratıcı düşünmektir.

Bunun dışında her zaman inanılmaz fonksiyonel sonuçlarla öne çıkmamıza yardımcı olacak yaratıcı çözümleri bulacağımızı umuyoruz. Burada toplanan örneklere bakarsanız, sadece güzel değil, aynı zamanda inanılmaz derecede iyi çalışırlar.

Gördüğünüz en iyi portföy sitelerinden bazıları nelerdir? Son zamanlarda tasarımcı portföylerinde fark ettiğiniz diğer trendler nelerdir? Yorumlarda bize bildirin!