Pixelbaecker.de is awesome in quite a few ways. First and foremost, its a great illustrative experience. The art is crisp, cute and consistent throughout and the use of mascots for the content pages is interesting. Its a convention that allows Mr. Horn to arrange the navigation arbitrarily. Each character’s location in each illustration determines the location of nav items. Normally this would be anathema because of the usability concerns but here it works. The content isn’t deep and the page visitor’s interaction with the art is the primary function of the site. The fact that site navigation moves and scatters from page to page is, in this case, a strong component of that experience.

Second, pixelbaecker.de is a great example of unstructured design (good unstructured design, that is). Generally speaking, grid-based design is key to well structured web pages. Grids and modules work well with text and images and can help to establish an information hierarchy that is easy for users to navigate when trying to parse through large amounts of content. However, a screen is not a page and can also be thought of as a large interactive canvas. Illustration and animation can take precedence on that canvas as well, especially when the illustration is the content. Its nice to see organic shapes and arrangements. Sometimes this kind of asymmetrical balance can work really well, where elements are irregular and the center of the page feels like a fulcrum upon which they are all balanced. In designs like this, the structure becomes less about alignment and structured proportions and more about the visual weight of each element. Big elements feel heavy, low contrast feels light, dark colors are heavy, white space feels like it has gravity… you get the idea. pixelbaecker.de does a great job of creating this sense of balance. I’d like to see more designers creating experiences like this.