2019
Android Launcher, Android Apps, Website, Digital Marketing, Brand Management
Personas, User Stories, Application Maps, Wireframes, Visual Design, Prototypes, Styleguides, Production Graphics
Head of UX/UI, Strategy, Creative Direction
The first Android-based platform built for all-in-one game play combining the best of mobile, console, retro, and cloud gaming into one unified experience. Worked with executive and engineering teams to help define product strategy. Managed a design team to deliver UX/UI, user testing, and marketing.
Uncharted Territory - The gaming industry continues its rapid growth in consoles and PCs, but how do we bring that consolidated experience to a single mobile device?
Demanding Demographic - Even with the explosion of mobile gaming, PC and console gamers have been hesitant to jump on board. Our research revealed that they don't think Pokemon Go is quite the same as League of Legends.
Fractured Experience - With the various streaming services, cloud gaming services, consoles, and PC platforms, we saw an opportunity to combine those experiences and create a community where users can share common interests and geek out.
We started with surveys and interviews to form personas and gather pain points. PC and console gamers can be a demanding bunch and current mobile solutions have trouble meeting their requirements. We took this knowledge, executive wants, and branding goals to build up a strong set of user stories.
With the groundwork complete we collaborated on user flows and overall architecture for the various experiences like the out-of-the-box experience, community interactions, cloud setup, controller setup, game discovery, and game-enhancing experiences.
We followed the flows up with wireframes and detailed documentation showing all variables and options. Invision prototypes were built for testing and Principle motion prototypes to help visualize the transitions.
Before getting too deep into agile sprints and testing we had to remember that we are also building a brand. And since this brand was aimed at gamers, we had infuse the element of play. We did a deep dive and explored several directions that emphasized fun and games while keeping in mind that was also a daily use device.
Redesigning all of Android and 1000s of apps seemed a bit out of scope so Wonder's design language had to flow naturally with Material Guidelines. We used playful angles to imply depth and movement in the UI. These simple characteristics help enhance and differentiate while still living in harmony with the native Android experience.
We really wanted to play with dimensionality but didn't want to rely on 3d or shadows. The depth created by the angle along with motion accomplished this, but still kept things flat. In the end we had to pull back a bit as the extreme angles and slanted text were effecting usability.
With all the custom OS elements and apps being designed in tandem, we needed a cohesive design system that could be used and updated by multiple teams. We distilled the explorations down to a component design system utilizing the Atomic Design Philosophy. We used sketch master symbols and built our own web based asset management system. This gave designers a quick overview and allowed engineers to view specs and download assets directly from any browser. Assets are synced to Dropbox repositories to avoid outdated versions and more importantly to avoid a ton of maintenance updates.
Giving the Wonder OS its own identity was important, but we also didn't want users to relearn common behaviors so keeping the utility of Android was key. As a result we designed a unique, yet familiar UX that was purposeful, tasteful, and helped build the Wonder Brand. Elements like the notification widget below are intuitive and stylish.
A separate games section in the app drawer gives you instant access when you're itching to play.
Quick access to videos, live streaming, and tips, all contextual to the game you are playing. Wondermode optimizes your phone for gameplay and limits those not-so-perfectly timed notifications.
The Game Browser gives you a console style experience through your phone. We designed a unique interface optimized for gamepad that automatically triggered when turned on or when the phone was docked. The interface allowed you to browse through classic emulated games, cloud streaming, and rediscover existing content from a new perspective.
Custom curated content based on your interests. Flip though a feed built just for you.
Check out other users and their interests. Compare your profile to theirs to see where your interests line up.
Stuck on a level? Ask the community where you can discuss game strategies, share pwnage videos, and catch up on the latest news.
A store built to take advantage of Wonder's unique experience. The curated feed features the best controller compatible games, classics, cloud, and Wonder exclusives.
Looking for something specific? Wonder's filtering will help narrow down your choices.
To help communicate Wonder's vision to investors and the public we created short videos that highlighted core benefits and features. We used the design language from the Wonder OS to inform the overall vibe of the video. Interface clips were taken from working prototypes and more complex effects were handled by After Effects.
