OpenTable is an online restaurant-reservation service company based in San Francisco, California, that covers over 30,000 restaurants in the US as well as several major international cities. When they rebranded in 2015, OpenTable came to John McNeil Studio to create a site to unveil their rebrand and serve as a repository for their brand standards and assets.
The broad goal for this project was to reintroduce OpenTable to its audience through the unveiling of its rebrand, while providing all the elements to accurately translate the brand across multiple platforms. OpenTable’s than newly formed brand book served as a thorough guide to the rebrand but the challenge was translating that extensive brand book into an easy to use online guide. A guide which featured downloadable logos, templates, and color palettes among other assets with varying levels of excess for the public, OpenTable employees and restaurant partners.
Process
Working with the design team at OpenTable, JMS delved into research to develop a site structure that would allow OpenTable to celebrate the arrival of the new brand and allowed users to explore their brand guidelines in depth. The home page had to tell a story, with the brand video serving as the introduction, while the new photography and copy communicated the brand values and fresh new look. This provided a bold entry point to the site from which users could delve into the guidelines.
In order to allow various users to have different levels of access into the guideline section of the website we created two entry points, one for general users and a gated portal with separate password entries for employees and restaurant partners.
Wireframes
The navigation needed to allow users to maneuver to sections, subpages, as well as as subsections within a page due to the depth of the content. Our research and internal testing led us to implement a vertical main nav and a horizontal subnav that anchored to sections within the pages. The navigation and aesthetic hierarchy, drew upon the brand's established guidelines but were also influenced, among other things by Google’s approach to their material design website.
In collaboration with the OpenTable team my responsibilities included creating the information architecture, wire-framing, visual design and prototyping.
HI-FI Mockups
Takeaways
The success of this project hinged on site organization and creating an intuitive and seamless user experience. The core struggles came with providing the massive amount of information in a form that was easy to navigate and scan, our research proved iterating on an already successful format was the best way to address the issue.
