Here it is: one of the very first performing arts organizations in the Twin Cities to launch a responsive website, and one of the first Orchestras in the nation. I could not be prouder of my work on this website, which was lengthy and extensive. (View website).
This was my second overhaul of minnesotaorchestra.org since I started in March 2010, and this second launch exceeded even my own lofty goals.
My process started with the inspiration of seeing Capsule‘s new brand identity for the Orchestra. Simply adding the new logo/branding to the former website was not going to do it justice; a new design was needed. Since we also knew that responsive design was going to be necessary sooner than later, this was my opportunity to launch the new brand as well as get ready for our collective tablet/mobile reality.
Next, I spent some quality time looking at Google Analytics on the website, to determine user paths and weed out unused content. On the old site, content was in silos, by department. On the new site, I organized most of it by types of users and grouping like types of information together—eliminating duplicates without mercy.
The next part was naturally the most fun: mockups! I wanted to use a mobile-first philosophy to help me determine page hierarchy, so I mocked up the mobile site first for each iteration of the design. Going mobile-first really helped me ask—and answer—the hard questions about what to leave in and what to leave out in the new design.
Coding a responsive site was something new to me, so I used a great existing Joomla template and was able to modify it for my needs.
Last but definitely not least, I re-wrote the content for nearly every page of the website, making it more easily scannable and less redundant.
Suffice to say, this was a huge project, made even more complex by labor negotiations. We could not launch the new brand or website until a contract was in place, and I was overjoyed when that finally happened in January 2014.
My roles in this project were many, but they included: art direction (I had the assistance of two graphic designers), front-end development, design, writing, photography, information architecture, and user experience.
As always, this is a work in progress and I have already started on Phase II. This is truly my magnum opus as a designer so far, and I am very, very proud of it.
Download some screenshots! Homepage (mobile) | Homepage (tablet) | Homepage (desktop) | Event detail page (mobile) | Event detail page (tablet) | Event detail page (desktop) Or better yet, just go look at the live website in all its glory!