Design, uninterrupted #121

January 4th, 2011

Today’s post highlights the design of Julie-Hemery.fr, an online portfolio for a makeup artist done by Jérôme Ebzant. A prominent stylized illustration strikes a perfect balance with a flamboyant oversized logo and the leading quote. Note a radial highlight centered behind the illustration and a repeating intricate damask pattern set in dark ultramarine. The four-column grid extends into the footer that uses much less contrast (and no drop shadows) for the extra links.

Note how the visual balance is preserved by putting the icons in the two middle columns. Most of the icons play well with the ultramarine / blue / cerulean color scheme, and it might be interesting to see the icons styled with this scheme, revealing the full colors on rollover only.

It is quite a shame that the design is marred by four (!!!) ugly overlays of dubious design “awards” from the CSS aggregator sites (removed in the screenshot above). They add unnecessary noise, extra palette colors and even hide the last navigation menu item on smaller screens. While these may serve to promote the designer, it’s hard to see why the site owner would want these plastered over her professional web presence.

http://farm1.static.flickr.com/61/230872827_7b2a9ba949.jpg

Image by Stuck in Customs.

Every month this series is tracking the latest design trends and collecting the best examples of modern web designs. Here is the list for December 2010 with almost a 1000 links from 30 aggregator posts:

Design, uninterrupted #120

January 2nd, 2011

Today’s post highlights the design of NomadGraphs.com by Mathias Brouilly. Precise geometrical patterns and shapes drive the visuals. Monochrome icons with simple and strong shapes; thick pinstripes and large dots used on the section headers, main logo and the contact form; typography-driven slideshow across the top part of the page – all of these guide the eye through the various content sections on this single-page site. The color palette of brick orange, light brown, pale olive and ivory is repeated in a thin repeating stripe running across the top edge – a recently popular trend that made a few appearances in this series.

On a less positive note, the pale olive is used for links as well as italicized text, adding uncertainty about what is and is not clickable. In addition, each section seems to have its own column layout. Even with strong vertical lines connecting each section content with the matching header and well-maintained visual balance inside each section, the overall impression is a little messy and disorganized.

Design, uninterrupted #119

December 28th, 2010

Today’s post highlights the design of MumMade.co.nz, an online store for home-made baby products (design by PixelFusion). Soft pink-brown color palette joins the attractive selection of fabric-inspired textures and illustrations to create an inviting browsing experience. Individual product pages use a carefully crafted item selector, while category pages employ attractively spaced and nicely framed product thumbnails.

Muted pink is used for the hyperlinks, and the site uses the thin serif Archer Light for headers / navigation links and handwritten Bowfin for the social icons. The “About” page uses a professional photograph to create a deeper personal connection which is further reinforced on the “Thanks” page.

On a less positive side, the auto-advance slideshows on the home page are just too much. There are three slideshows, each one with its own cycle. The top one has a ticker that allows manual navigation, but the bottom two are not very usable – there’s just too many transitions with very little control provided to the end user.