UX, UI, Interaction, Motion
Lifeline fans are among Big Fish Games’ most loyal players. The unique game mechanics and story lines inspire them to play new entries in the franchise as they are released. As a result of its success, the game producers want to show off the entire Lifeline catalog without competing with other games in the App Store.
Create a Lifeline-exclusive app store that is immediately accessible in-game.
My design team met with stakeholders to define the MVP of this experience. We thought about inserting a Lifeline catalog into the Big Fish Game Finder app, or even making it a standalone app. Since both would require the installation of a new app that isn’t part of the Lifeline series, why not feature it as a part of the game itself?
I had a few goals as I entered the design process:
- 1. Keep the experience light-weight
- 2. Allow it to be used with one finger
- 3. Use each game’s artwork and description
Researching Layout and Interaction Trends
Exploring catalog and library layouts and interactions and found the “card catalog” pattern most interesting.
Mapping out each bit of content, from sections to page elements.
Designing the Layout and Interactions
Designing the layout and interactions, utilizing an accordion to hide and show entries in the catalog.
UI Design Round One: Adding Catalog Content
Completing the first round of UI design that featured three Lifeline games’ icons, large artwork, and descriptions.
UI Design Round Two: Clarifying the Design
After a design review, we felt the experience could be improved by reducing the height of each row, and featuring the game artwork more prominently.
Examining the complete end-to-end flow while tweaking the UI design.
Converting my design flow into a motion demo was the final step before sending my work to the stakeholders for further project planning.
Upon completion, the following goals were achieved:
- ▪ Users can easily access the catalog via the in-game menu
- ▪ Users can launch other installed Lifeline games, or hop directly to the game’s App Store page to purchase
- ▪ Users can interact with others using the embedded Lifeline forum
- ▪ Each Lifeline game’s art is prominently featured
- ▪ Everything about each game is immediately accessible and cleanly presented
Harry McCorkle, UX Designer
All content is the property of its respective owners.