1 Hour Website Redesign

July 12, 2010

This is the first of subsequent posts of a 1 hour website redesign. If you’d like a quick new design for your company or website, please let us know.

The goals of the 1 Hour Website Redesign are:

• Quickly critique the website noting strengths and weaknesses
• Examine and [hopefully] improve the design aesthetic
• Have a clearer end result, of where, what, and why in terms of conversion architecture
• Showcase a short snippet of our process for website development
• Offer clients & potential clients a free design/review

Note: No search engine optimization is included in this review. For another day.

In the first installment we examine the Kansas City Symphony website. (Author’s note: My wife works for the symphony, so I have a solid understanding of their main goals/challenges, and her boss was sporty enough to let me give it a go.)

They are currently in the process of a redevelopment, so it seemed like a perfect time to examine what’s working and what’s not on the site.

In the first five minutes we take a review and examine:

Strengths:

• Clear & prominent logo
• Featured upcoming events on HP
• Decent main visuals (conductor photo / billboard photo)
• Subscriber billboard – fills seats and generates revenue

Weaknesses:

• No clearly defined visual hierarchy / sections behind the main billboard
• Smaller navigation lost – not congruent with an [assumed] older audience
• Buying tickets / action items are hidden
• Events calendar has ‘dated’ look
• Too much intro copy for each section

The Symphony Redesign

Being the first one of these I’ve tried, it was more of a challenge than anticipated. No research, no business understanding, no client meetings, no client preferences, etc. Typically, having this arsenal of information makes the design process go much smoother.

Note: The main photo is not of the Kansas City Symphony, just a stock photo pulled from the Internet.

The Redesign Explained

Basically reversing the weaknesses from above I tried to:

• Clarify the navigation: Reduced the elements and length to provide the most important structural element of the site. More space, and using a white header makes it a no brainer on what this site has to offer. Include some nice oversized drop downs and we’re in business.
• Make Actions Obvious: Used a standard ‘button’ to signify main calls to actions. A couple variations, but the most important and obvious are the ‘buy tickets’. Including in the header as a static item allows someone to move into the booking process from any page on the site.
• Add Headers: The design did turn out slightly ‘boxy’ however it shows clearly defined sections to guide the user, or let them ignore it. Also used larger more contrasting headers for emphasis on the important portions
• Better organized Events: One of the most important sections, the upcoming events needed clarification. Using graphic elements (lines) and differing type styles let’s the user scan the information quicker and easier. Also added ‘search events’ and view all events as opposed to the dated calendar.

About the Darker Design

I’m typically not a fan of darker sites, however with most events happening in the evening, and the symphony usually represents ‘a night out on the town’, the blacks make sense. Combined with the purple of their branding, it enhanced the ‘classiness’ of the site. Note: This design would need some work for the interior pages as we would never revers out any amount of body copy.