Company: Seattle Opera
Skills: Web Design + Build, Digital Design + Production, Photo Editing, Information Architecture, User Research, Web QA Testing, Collaboration
Software: CSS, EpiServer (CMS), Adobe Photoshop, Card Sorting, BrowserStack
Skills: Web Design + Build, Digital Design + Production, Photo Editing, Information Architecture, User Research, Web QA Testing, Collaboration
Software: CSS, EpiServer (CMS), Adobe Photoshop, Card Sorting, BrowserStack
Project Overview & Process
Seattle Opera wanted to elevate their community events on the website to be more aligned with their mission. The previous site architecture and design had these programs dispersed across different sections of the site and only really findable on the site-wide calendar. It wasn't intuitive to the user where to find these events and they often looked at the previous Performance & Events page (called: On Stage), which only highlighted the main opera productions.
To get a better idea of what the user expected, we conducted a card sorting activity. This lead us to look at restructuring three sections: Performance & Events, Discover & Learn, and About Us. I was tasked with designing the section's secondary landing pages using existing blocks within EpiServer (CMS). We launched the new site architecture in three phases: Performance & Events v1; Discover & Learn/About Us; and Performance & Events v2.
For the designs, I chose a block which wasn't used widely on the site. It worked great for the Discover & Learn/About us pages, but the Performance & Events section needed more attention. First, I created the design on the test site then used CSS to change elements, spacing, and colors to refine the design (this was v1). Then, using a screenshot of the page in Photoshop, I refined the design further to add additional information to the events.
Once Phase 1 launched, our developers started work on a new block. Events happened frequently and the existing blocks were too clunky for site editors to update efficiently. We needed the page to update as automatically as possible. I worked closely with developers by testing the new block until the functionality worked properly. We then launched v2 of the Performance & Events page.
