Designing portfolio websites

Great portfolio sites aren’t just thrown together. A lot of thought goes into the design and architecture of anyone’s site that’s proud enough to boast their work. I have chosen a few that caught my eye not because of elaborate effects or just plain wacky eye-catching interface, but because the way that content is displayed remains thematic and all round well put together.

This website looks neat, formal and very minimalistic. It’s modern and trendy because it tends to not clutter the home page, but have a simple sleek background (it’s just two decorated squares really) with models or a single model posing in front. Everything on the home page has a function and links lead you straight to the info you want. The logo makes use of just 3 colors with the company’s name Concentric big and bold and the type ‘studio’ sits snugly beneath it. The logo echoes the name concentric with circles and the colors work nicely with the colors of everything else on the page. I like it because it speaks to its consumer and it does so without all the fluff and glitter.Concentric studio is a company specializing in brand management and they proudly boast their latest client Victoria’s Secret on their home page…smart.

 

 

 

 

 

 

I like the use of color on this site, it all seems to be in harmony with even his portfolio photos. The stocking feet add a retro perspective. Maintaining a formal presence he gives minimal information but encourages further explanation with thumbnails and 3 arrow heads at the bottom leading you to his other content.

Shifting gears momentarily I’ve chosen to analyse a funkier more playful website. This website feels to me like a personal reflection on the web designer who created it, Luc. The background is a simple play with greens and blues dripping onto a white backdrop. The header has creative designs that integrate into the site’s functions. The image is a cartoon manifestation of the author himself and “I design with my noodle” is a cute line which gives us insight into his intelligence. Could that bird to the right of the cartoon be a twitter bird? The opening phrase creates humour simply by design; the scratching line over freelance and replacement of 9-6 and the smaller sized wannabe next to the word blogger. The blurb of the author gives us his info without it invading the content he posted. The Flicker images are functional and everything on his page is relevant without causing cluttered spaces.

 

 

 

 

 

 

This website is simple and easy to navigate with every bit of info is straight to the point which is important for online – people tend to read a lot slower on the web and get tired of long columns and blocks of text. The picture insert of himself I feel is a bit unimpressive for a designer with 11 years experience – it’s a Polaroid looking picture with bee line swirls around him (looks like a Facebook profile picture). However I do enjoy the bee line swirls following onto links as if I’ following a chain of I do like the simplicity yet modern look of his stick figures ad the speech bubble is interactive as it’s a link to his iChat account.

 

I’m not quite sure what the design concept behind this site was but it is very original. Every sentence is a link to other articles of his and the lack of images creates a direction of attention to content more than elaborate design. When you hover your mouse pointer over a sentence all the others fade away, i admire this work on CSS to make the page more interactive.

 

 

 

 

 

 

I love this website’s header, with the superhero dog and the logo emblem on his chest – very creative and bold. The name ‘dawghouse’ already inspires a youthful vibe with a trendy comic feel. The welcoming line, “Oh Hi There,” immediately interacts with the online user and the white text on a peach texture background describes what the site’s busniess is about. Icons for rss feeds, Facebook and twitter and other social media are above the posts and using simply the icon without accompanying text indicates that anyone could click and get in contact with the designer. This site has an open and inviting feel to a cool kids party, “Waddup dawg!”

 

 

This German site has many features to comment on, but one particular feature caught my eye. Once you open the page you see Home, Portfolio, Blog, About and Contact right on top to navigate different pages – when you scroll further down the headings are out of sight BUT not on this site. When you scroll down the bar right on top drops down using the same links to the other pages! This keeps the online user from having to scroll all the way up to get to those links. Very neat, convenient and clever. Or maybe I’m just impressed by small things.

You see the bar displayed above

Scroll down and the links on top are still visible from a drop down bar

Advertisements

About nicobaleng

My paradoxical love for the web is feeling immense freedom while confined to a seated position behind a desk. This is what the world wide web has to offer. Learning about the latest technological toys or playing around with programs sounds like nerds-play, but once you start exploring, the pc monitor in front of you becomes less and less intimidating. Tracked and documented I will share the journey of an average Joe like me, moving up toward achieving a black belt in web design! KAPOW!

Posted on August 26, 2011, in Uncategorized. Bookmark the permalink. Leave a comment.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: