Design, uninterrupted #142

February 15th, 2011

Today’s post highlights the design of Subtle usage of lighting, drop shadows and fading translucent lines brings out the full potential of the seemingly limited light gray palette. The vertical navigation menu in the left sidebar does not scroll with the rest of the content; this is further highlighted by the beveled vertical separator and a rather large drop shadow. The light monochrome palette is augmented with the vibrant bright red used on the main logo and on some of the clickable controls.

It’s rather interesting to follow the logo “ribbon” that wraps the sidebar – the diffuse highlight seems to indicate that the light emanates from the main content column, which is consistent with the drop shadow extending into the sidebar. While a drop shadow indicates that the shaded area is “lower” along the depth axis, the overall effect here is that the sidebar is closer to the viewer, with the diffuse light creating a soft shadow and then bouncing back to a slightly darker shade of gray the further it gets to the browser left edge.

On a less positive sire, the design needs some attention in typography and alignment. The “About” page sports a jarring half-line height misalignment between the two columns in the main section, while the “Services” can use smaller icons, more margins and wider text columns. The footer section on all pages requires realignment of the content to make it more balanced across columns as well as rows.