A sketchy illustration style and a soft color choice make this website’s background memorable.
A nice example of minimalist cascading menu from Kemado Records, an indipendent American record label based in New York City.
A nice callout box that made me click, though it perfectly melts into the overall graphic context (no blinking, no huge types, no graphic contrast).
3 good qualities converge in it:
- nice, not overbearing illustration;
- good typography (big but not loose lineheight; use of different font weight to stress out the most important words)
- a good copy: alluding to my competitors, makes me immediately envious and curious about it.
I really can’t remember why (serendipity, I’d suppose) but recently I’ve stumbled into the Gates’ notes, the website that spreads probably worldwide most famous mogul’s thoughts about the matters such as philanthropy, climats, development…
Apart from the fact that the whole thing is written in the third person, which really gives me the creeps, I’ve found interesting the curved and tortuous menu that reflects the complex and multilayered site’s structure.
Despite a slight dislike due to the visual treatment (one for of all, typography is really too small), I’ve found myself clicking on it several time, wondering how come an interface could work notwithstanding its lack of appeal: so I’ve realized that what I was really appreciating, was the metaphor it embodies; the nested graphics that appear/disappear when you click, make the menu exapanding and unravelling in parallel with your travel through Bill’s thoughts progresses, drawing kind of a map of your steps.
So what I really wanted to say is that if you find a good metaphor you can somehow visually express, it could turn out to be a really powerful trick to keep your audience hooked no matter if they like your style or not.
Here you are a nice design snip I’ve found on Guinness website: a sleek black tab menu with many filter options clearly organized into two rows.
Using different colours may lead to clashing, disorienting graphic outcomes. But I think this is not the case and we quite appreciated A S Hospitality expanding menu.
Atomic Cartoons is a content developer and full service producer located in Vancouver, Canada.
Each section of their one-page portfolio displays a matching cartoon illustration, emerging from the dark background with a dramatic, movie-like effect.
I loved this huge, multi-layered, partially glossy, partially transparent, play button for video players, the second I saw it.
Evanto‘s guys are super cool designer with a taste for clean and well-organized pages, with tight leading and big body texts.
When I first saw these extra sleek folded tabs hanging on the left, I instantly loved them: they’re not only a pleasant graphic element but they also really help you scanning through the page.
In fact, the layout is cut into horizontal stripes, each one containing the description of one of many Evanto’s websites. For each stripe you see a tab, bent to 90° that carries the icon logo of the corresponding website: so the vertical and steady sequence of tabs, balancing the basically horizontal layout setting, draws users attention pushing us into following the path and scrolling the entire page.
I’ve found this beautiful example of iconic breadcrumbs on Web Designer Depot, reading an interview with Web Usability Guru Jacob Nielsen.
Nielsen, asked about breadcrumbs effectiveness in easing users navigation, says:
“So breadcrumbs are definitely useful. Just as important, they don’t harm those users who don’t use them. Some studies have found that many users don’t use breadcrumbs.
But that’s OK, because the breadcrumbs don’t cause any trouble for these users, and since they’re a very lightweight design element, breadcrumbs are worth including for the substantial good they offer to those users who do use them.”
The full interview is available here.
It looks like a web site of MTV network, but in fact it’s the web site of a Pentecostal church: I really like the page background style that I would call sparkling carpet.
Sweet & Saucy is a small company specializing in the production of spectacular wedding cakes: the footer, designed in a old-fashioned style, has funny mixer-button-icon that carries back to the home page.
It’s nice (and sadly quite rare) featuring in Web & Patterns an Italian web sites: in this case we want to introduce you SNAV, a shipping company.
The entire site is set in a clear and generally well done visual treatment and I especially like the booking form that allows you to select your route by either input texts or a flash interactive map.
Well contextualized and nice, the icons of the splash page of Adexcel serve to indicate different types of products depending on the kind of customer.
Unusual and very nice effect on the screenshots in the dynamic portfolio of Nclud.com: the images zoom and rotate on mouse over; when you select a project, others projects images get off and go back to the bottom.
The logo of design studio Ancient Wisdom Productions is clear and simple
The typography used is also interesting.
The dropdown menus in Sourcebits are drawn as metal tabs, Apple style, which contain tiny icons.
The icons on Eintelli.com web site.
A beautiful bouncing on Idea Foundry web site, a company that deals with training in information technology.
Thinkingjuice, advertising English, takes up the idea of using sliding panels vertical for its sidebar (already seen on Apple web site).
Compared to Apple’simplementation, I like that the triggering event is the click on the arrow (and not the mouse over): on the other hand I appreciate Apple’s transition speed which is a little bit faster.
I have a passion for non-conventional listings and grids based on squared (or nearly) patterns: Method web site grid, a communication agency specialized in creating unique brand experience, is one of my favorites.
An original black background for the search and the booking forms on Design Hotels website.
Floral menu and layout for a company that deals with eco-sustainable projects.
Sometimes (but not always) an illustration allows us to express an idea with more clarity and intuitiveness of a written text: as in this case the fish orange represents the customer profile, in perfect consistency with the global marine environment.
Saturized works are all prestigious and of high quality.
They find a worthy exhibition space in this showcase that has a dual navigation: one to move through the individual project (number on the top) and the other one to skip to another project (the arrows).
Although their use has been dramatically (and thankfully) reduced in recent years, tables are the most suitable tool for expressing numerical values.
As in this case, using a bit of fantasy, you can make even a price plan table attractive, nice and clear reading.
You broke something? Nextwave error page brings out the hidden geek in us.
These panels that slide side to keep out the three fundamental pages of the site are quite of interest.
One could apply this system to present search engine results, listing, for example, in the main page lists the textual elements, and putting video, maps, images in other pages.
I really like Razorbraille web site: for now I wanted to show you the frogs jumping on the main menu, look at you and fall down when you move the mouse over a tab.