Open Me

YouthRules! Home Page

Department of Labor: YouthRules!



This fun design was aimed at capturing the attention of the youth market. Its purpose is to inform young workers about their rights and responsibilities.

To make an otherwise banal subject attractive to the easily distracted youth of today, we used bright colors, asymmetrical shapes and splattered textures to make it visually arresting.



We found ways to visually "break the HTML grid" by relying heavily on pngs with transparent empty space. This allowed us to create the appearance of asymmetry without having to build any complicated HTML hacks.

The foursquare on the homepage illustrates our technique perfectly. The underlying structure is a perfect square, but the use of overlaying images creates the effect of an asymmetrical shape.

The foursquare design also allows for enhanced usability, as the client can depict a lot of information in a compact and graphical space. On roll over, more information is scrolled in over the image, giving the user a clear understanding of the subject before they have to click through to it.

Project Overview:

Resource database website.
Hard-coded in HTML.
Visual Design, Branding and User Experience
OmniStudioDesigned in collaboration with OmniStudio, Washington DC DOL Wages and Hours Department logo Department of Labor Logo
  • YouthRules Homepage Design
  • YouthRules Interior Design
  • YouthRules Compliance Quiz Design
  • youthRules Interior Page Design