OC Rewards App
Giving the user a simple interface, without sacrificing features.
PRODUCT STRATEGY • USER EXPERIENCE DESIGN • USER INTERFACE DESIGN
With a newly redesigned website, the Old Chicago team wanted a redesigned rewards app to complement. Old Chicago features an extremely robust customer rewards program, and having something at a customer's fingertips to simplify the experience was important. Not only focusing on rewards, the OC app also gives users access to Old Chicago's immense beer database, with capabilities to save beer to try later, rate it, and complete interactive games to suggest new beers.
The Rewards dashboard serves as the main point of communication to the rewards customer, showing them at a glance their rewards status—points until OC bucks, OC bucks left to use, and their status on the World Beer Tour. Three different types of graphs show this information clearly to the user. To dive deeper, a user can tap on any segment in the top "card" and be taken to a more detailed view of their rewards progress.
The Beer landing screen is the user's place to go when they are asking "what do I want?" There are multiple "beer recommendation engines" that serve to suggest a beer to a user. If the user still hasn't been recommended something they wish to drink, they can always browse "Beer at My OC" to find beers available at their "home store.”
A big challenge to the design of the OC Rewards app was how to present a list of beer while including several pieces of information to describe the beer. Given the limited horizontal space, columns were immediately ruled out in favor of displaying the descriptive information for a beer with multiple rows. Zebra striping help the user maintain their orientation as they scan the list of beers. In the "rated" page, the ABV of the beer is replaced with the star rating.
One of the several "beer recommendation engines" is an interactive quiz to determine "What's My Beer Mood?" A brief series of questions are answered by users before being presented with their answer and the option to recommend beers that match their mood or retake the quiz. I worked closely with the Old Chicago team to develop entertaining questions for users.
When a user selects to view more detail about a beer, they are presented with a clean visual interface showing all of the information about the beer. Given the amount of numbered information about a beer, I was inspired by baseball cards and looked to how they present the stats about a player. The details about the beer are pulled from both the Old Chicago master beer database and a rating pulled from Untappd. Once enough users rate beers within the OC Rewards app, the Untappd rating will be replaced with an average rating from the OC Rewards members.
Process
Working together with the product strategy team, the design team assisted in coming up with user flows for a few personas. After features were defined, we began designing lo-fi wireframes and presented them like a map flow, to easily communicate to developers and client the many features of the app.