Web Design Critique: School of Visual Arts

Description
At first the School’s splash page assaulted my eyes with color and movement, but my eyes quickly adjusted their focus to the center grid layout. The implied purpose of this site became immediately clear from the top nav bar headings: Undergraduate, Graduate, Continuing Education, Admissions, and Student Art. The primary purpose of the page is to be informative, but in a visually entertaining way.

There’s very little open space on this page. The clever use of yellow-gold and red vertical blocks visually frame the geometric grid of informational sections. The yellow-gold seems to be the primary color since it’s the leading/left hand edge of the center grid and dominates the index links in the right hand nav bar.

The contrasting whites, blacks and blues of the center section that’s divided into three horizontal blocks initially make this area recede from the powerful verticals on either side of it. But then the fun begins! The center triad is constantly changing… moving in various ways. The top third employs various film transitions from fast and slow horizontal transitions to vertical transitions to fading in/out. The second section uses a slow right-to-left horizontal slideshow. The third section has the constant blue field with movement coming from the white spotlight and animated “pink walking hand”. This entire page appears to be “above the fold”.

Analysis
The vibrant yellow and red vertical blocks appear to pop off the cacophony of the muted forms in the background graphic—constantly re-focusing the viewer’s eyes on the center grid. This effect can only be appreciated if you enlarge your browser window so the muted background is visible on all sides of the center grid. Notice how the center grid floats to the center of your browser window as you make it larger/smaller!

As you scan the page, focusing on the center grid by virtue of the bright engaging colors, the initial yellow-gold vertical grabs your attention and moves you eye downward… almost as though the designer decided that the most important element of the entire page was the block highlighting the link to the Admissions Guidelines. Your eye then moves to the right and up the red vertical block that indexes the other site links. It’s then that your circular eye movement is complete when you come to rest on the top nav bar categories. This muted section almost blends into the background where your eye rests only a fraction of a second before being pulled back into the center grid of dominating non-muted colors and movement.

Interpretation
My first thoughts about this site was that I had the same visual “feeling” as though I was looking down at a colorful rug that was placed over a mosaic tile floor.

There’s some serious color play happening on this page. From secondary and tertiary color families in the muted/tinted background to stronger hues of primary colors on the center grid. It seems very balanced after you stare at it for a few seconds, and then you’re brought back in by the moving segments in the very center of the page.

This is a very sophisticated use of layers. It seems very simple at first glance—a floating center grid over a static muted background. Once you dig into the layering scheme, however, you start to notice color repeats… tints and hues that play nicely between the background and the floating grid. Effective use of white space in the tiled background is also expertly paired with the white frame on the floating grid.

This page was definitely designed to appeal to prospective students that are visually stimulated and interested in the nuances of extraordinary visual design.