we smash you with the information that will make your life easier. really.
Designers have only a fraction of a second to attract users' eye and win over their loyalty. Clear visual structure, thought-out
typography and moderate use of images are extremely important - as they can drastically improve the scanning process for
the users. Consequently, to achieve a lasting positive impression, it's common to make use of basic rules of usability.
However, classical solutions can be boring; creative solutions can be appealing. Therefore to impress visitors, designers risk
unusual and innovative approaches. After all, between standards and creativity there is a lot of room for design
experiments. We observe these experiments. We explore new approaches. And we collect them, so you don't have to.
And since no page is equally important as the start page, it's interesting to know, which approaches designers come up with,
developing an innovative design for start pages. Let’s take a look. Unusual, remarkable and outstanding start pages - in
a brief overview.
The navigation items on Capitalcomm seem to be bounded to a string. To navigate through the content users have to drag
the menu items. Extremely well designed, extremely nice to explore.
Flash-based navigation at Yammat.com sticks to a rubber or elastic band; once a link is clicked, the whole page gets in
motion. The background images changes with every page reload.
Interactive vertical navigation menu. SectionSeven.com lets you browse through its sections like through the pages of a
book.
Not only users can play with web-sites, web-sites can play with users. The navigation menu on Flaboy.com captures the
mouse cursor and offers specific browsing locations - automatically. Nicely designed, nicely implemented.
Navigation menu can be gorgeous. MHQ.nl proves it. (The site was already featured in one of our previous posts).
Lance Wyman showcases his work in the form of a spiral. The latests works are placed on the outer side. A navigation menu
helps to select some more specific works. Implemented with Flash.
5. Using visual communication.
The start page of the campaign “One Laptop per Child― . The start page isn't a splash-page: the images refer to
different sections of the site. The icons can be found in the navigation menu. An unusual, but interesting concept.
Basism showcases its works in well-structured grids; the description is hidden, but appears once the image is hovered.
Flash-based solution.
7. Using Huge Tag Clouds.
Search the Beat, a music search engine, experiments with huge tag clouds. The start page has over 150 Kb text.
Talking about huge tag clouds: the agency Wieden +Kennedy makes use of them to present its clients - according to their
“weight― and their authority. Apparently, there are many of them. Users can also use a timeline to navigate through all
of them with the mouse. A Flash-based solution, which has some usability shortcomings. What is not necessarily gorgeous,
sounds like an interesting concept.
Similar Textmarker-Effect is also used by Mostardesign. The whole design is based upon a background image and the
highlighted content.
Eoghan Mccabe surprises his visitors with a hover-effect. As long as no text is hovered, the page looks quite boring.
Important aspects are highlighted with a green marker. The font-size is definitely too big.
12. Experiment with your sites.
Shaun Inman experiments using color and saturation to suggest the age (and arguably relative importance) of site content.
Each day of the year is associated with a color. Winter begins with a blue which Spring changes to green. Summer fades
to yellow and turns an orange-red by Autumn. As time passes, these colors begin to fade.
On AListApart.com each issue has its own color scheme. “Imagine: Red and green for Christmas; blue underlined links for
when Jakob Nielsen finally writes for us.”
Catalogtree offers probably one of the weirdest navigation menus ever designed. A small animation on the left side of the
alphabet (type here) offers users to type in the code symbols and numbers; once the input is confirmed with the return-key,
the new page is loaded.
The site is quite strange, and has few problems in modern browsers. Users who don't cope with this kind of navigation can
use the index link, which lists all available pages. Although implemented not perfectly, the idea of letting users type in the
page they'd like to land to, is worth mentioning.
The start page of Post Typography is a Splash-Screen that offers you a foreteaste of what the site is all about - typography.
The inner pages look like a button-collection. Yes, they are links, indeed.
At the first glance KEEN doesn't offer something particular. However, instead of traditional navigation the site uses sliding
data blocks; the whole information is shown on a one single page, no page refresh is needed.
14. Minimalism and attention to small details.
Tiny, but with a keen attention to the smallest details: The Tangerine Tree. It doesn't really have to be that small.
about: http://www.smashingmagazine.com/about/
e-mail: office@smashingmagazine.com
advertise with us: advertising@smashingmagazine.com (Michael Dobler)