2022. DEC.1-2 (24hrs)


Web App




Emily Wong (Web Developer)
Nanaya Miki (Web Developer)
Su Shruthi (Web Developer)

Alex Smyth (UX Designer)
Helen Kang (UX Designer)
Vince Bacarac (UX Designer)

Project overview

This 24 hours hackathon is an industry project in partnership with Electronic Arts (EA) during the UX design bootcamp at BrainStation. By collaborating with web development students, we implemented personalized game recommendations and a Wishlist for Gen Z gamers to achieve higher user retention on the EA App.

Project goal

  • Adopt current Origin users into a new platform EA app.
  • Implement personalized options and community oriented features.

My Role

As a UX UI designer, I participated in the whole design process. And specifically I led the following process:

  1. Redesigning the game detail page that focused on improve the user retention.
  2. Building the UI guideline followed by EA’s brand guideline.
  3. Making the UI component to keep design consistency and work efficiency.
  4. Creating the interactive prototype to showcase the flawless experience.
  5. Designing the presentation slide deck to enhance the engagement with the audience.


Given Problem space

Gaming is one of the largest industries in the world and has a major influence on the future of tech and entertainment. As consumer preferences change, games and platforms shift to align with what customers want.

EA recently replaced its legacy gaming platform, Origin, with a new platform: The EA App. The EA App promises to be faster, more automated and a better overall experience for gamers. It also connects with other services to provide a seamless experience across multiple popular platforms.

How might we ensure that the EA App is adopted by their current users?

our Problem space

Like many shifts from one product to another, it can be hard to get users who are already familiar with a product to feel inclined to make a shift as well as face uncertainly about how a new product might work differently.

What’s the gamer community concern?

To discover more about what is the ‘Basic Functions’ is, we conducted the competitive audit with two famous online game communities.

We noticed fewer community-oriented features than products like Steam. Current EA  App users note that the application is missing basic functions related to e-commerce.

Proto Persona

Main User Flow

Browsing games recommended in your community, and adding a game to your Wishlist.


We believe that implementing personalized game recommendations and a wishlist for Gen Z gamers will achieve higher gamer retention on the EA App.

We will know that this is true when we observe at least a 50% increase in Origin users transfer to the EA app and increased engagement.


Digital Solution

For the home page and game info screens, I wanted to retain the current design of the EA app but add community-oriented section headings and options to add a game to a wish list as well as the view that wishlist. 

UX design team divided pages that individually worked, and I selected the Game Detail page. Unfortunately, we couldn't access the EA app design guide because the app has yet to be fully launched. So before I started to build a wireframe of my chosen page, I made the text style, colour guidelines, and different UI components to increase the design consistency. Also, we could reduce the development time.

Home Screen

Game Detail Page

Wishlist Page

UI Component

Final solution

full page

Key Learnings

Last time added interaction

Next step