We've all seen some incredible movies that were released years ago and wished we could watch them again on the big screen. This is exactly what Central Cinema is all about.
Located in Seattle's Central District, Central Cinema is a neighborhood beer-theatre. As you enter Central Cinema, you are hit with a sense of nostalgia - from the decor and the posters of classic movies on the walls, to the movies that are showing on the big screen.
The whole team agreed that the idea was incredible, and we loved the experience of being there. However, their website failed to reflect that amazing experience. The website was confusing and visually oppressive with no clear organization and far too much content on the screen. Our team of 5 set out to redesign their website. My main responsibilities were interaction and visual design, and I was working along side another designer, two researchers, and a content strategist.
Academic, Working with a Client
User Experience Designer
Interaction Design, Visual Design, Prototyping, Information Architecture, User Research, Usability Testing, Card Sorting
We delivered a new Central Cinema web experience using data gathered from customers and business stakeholders to streamline the information architecture and design a better ticket checkout experience. We produced a high fidelity prototype along with a design spec document to aid in building the website.
To kick off the project, we met with the client to understand his business goals that would guide our design. We scoped the project to a few key objectives
We relied on various methods to understand the challenge, the users and give our design effort a little direction.
We performed a heuristic evaluation on the current website to quantify its usability. Overall, the website received a moderate rating - indicating that users were able to complete core tasks, but there was much room for improvement.
We ran surveys and interviewed customers to understand how they felt about the current web experience, what the top tasks on the website are, and to understand their motivations to buy tickets online.
We looked at other businesses and websites that successfully solved the same problems - specifically around the ticket booking experience. This gave us a collection of ideas to inspire us.
Some things were immediately clear. The website definitely needed better navigation and content organization. Customers found the ticket booking experience clunky and confusing, and many of them had given up after trying to book tickets online. We created Personas and a Task Matrix to keep our design focused on the users and their primary tasks.
We conducted a card sort with 20 users to understand their mental model and how they grouped information on the website. This helped us streamline the sitemap and navigation structure to create an intuitive experience.
We started the process by collaboratively brainstorming feature ideas and low fidelity UI designs - Sketches. Ideating together was really great to bounce ideas off each other and come up with the best designs. After we had ideas on paper, I created a low fidelity prototype with Atomic.io, so we can test our design with real users and validate our design choices.
Our usability testing revealed a mixed bag of results, and gave us a lot of great points to iterate on. Armed with the test results, I bumped up the fidelity and designed the website's final visual design. The final prototype was built with Framer Studio. Check out the live prototype below.
The 10 weeks spent working on this were personally incredibly insightful. This project truly highlighted the power of effective collaboration for me - Each of us had a domain of expertise which we took charge of, and recognizing that helped us establish a smooth workflow by relying on, and learning from each other's strengths.
The usability studies on the final prototype showed a higher success rate on core tasks, and an overall more pleasing experience. Personally I feel that the visual design could have been explored and polished a little more. I also feel we would have benefited from having an engineer on the team. The technical expertise would have helped us think more deeply about what technologies we can use to build the site.
As the next step, a second round of iterative testing and design would really iron out the kinks and produced a more polished website. I would recreate the next prototype with code that can be pushed to production, or get an engineer on-board to help us with building the site, and inform us about the technical constraints.
This was one of my favorite projects at the University. I hope you enjoyed reading about it!