In the discovery stage, I met with the founder and product manager to work out the vision for the product, roadmap the design and development, surface a few personas and much more. We all had ideas for the gameplay of Beat the Brewmaster, and worked together on this screen flow for our minimum viable product.
Distilling and refining led to several flow charts: this high-level version, and several for onboarding, trivia, and gameplay scenarios.
Iterating on wireframes at this fidelity helped visualize the app's architecture and to solve some of the wording. Using shareable cloud-based tools for wireframing allowed for itemized commenting and resolution, speeding up the iterative process for the whole team.
Moving up in fidelity to an interactive wireframe really showed how the app would feel to the user. It also allowed us to minimize the onboarding experience, and to place social-sharing CTAs and permissions modals so they were not intrusive to the gaming experience.
Bold and dark using red, brown and gold, the app has a strong character suited to the craft-beer enthusiasts we designed it for. Bright and obvious CTA and progress buttons ensure the user can challenge any brewmaster even if they're in a dark pub after a craft-beer flight (or two =)