CASE STUDY      PRODUCT DESIGN

MARATHON MATCH NOTIFICATION

Design a user interface and backend logic for marathon event notifications, promoting in-house content before, during, and after the race.

Marathon_Backdrop_Update

ABOUT IRANSHAO

iRanShao Mobile Application provides marathon services for the most enthusiastic and hardcore runners on the market. iRanShao app is available on IOS and Android.

OBJECTIVE

Design a UI/UX experience for marathon notifications for users before, during, and after a race.

RESPONSIBILITIES

Led the research, product planning, and prototyping efforts to find directions and validate solutions through prototype testing.

METRICS

  • Increase article viewing
  • Increase race photo viewing

TEAMS

Marathon_Teams

EMPATHY

CONTEXT

iRanShao hosts a lot of marathon content for amateur runners like what to prepare, what to eat, or training the night before a marathon race. The app also has a powerful content team to provide race photos, and records after a race. Once a user commits to a race by telling us via the app, the system does not have a robust notification system to push race status to the user.

PROBLEM STATEMENT

Once IRanShao users sign up for a race, they are bombarded with endless match notifications before, during, and after a race.

SOLUTION

iRanShao will provide users with an in-app match status UI to host any match notifications before, during, and after a race.

ANALYSIS

CUSTOMER JOURNEY

Once features were defined, together with product managers and engineers, we used a 2x2 Feature Prioritization Matrix, to define what we could achieve in an MVP given specific production time and resources.

“Most marathon date is typically fixed, but start time varies differently."

Marathon_Journey

ANALYSIS

USER INTERVIEWS

I conducted a workshop to better understand my users. With support from the product manager, we gathered 3 hardcore runners for the workshop. I wanted to understand their expectations and desires using our product on a match day.

DEFINE

NOTIFICATION MODEL

Once the timeline was determined, the next step was to fill in the gap with the right content and notifications push under each slot. This was a collaborative effort with the content manager and product manager.

Marathon_Model

PROTOTYPE

UX DESIGN

Marathon_UX_1
Marathon_UX_2
Marathon_UI

TAKEAWAY

FINAL RESULTS

I was only able to work with existing features. There were so many good ideas and suggestions during the interview stage that I thought were interesting and would like to have seen how we could incorporate them.

After release, we saw a sharp 8% INCREASE across article view count, photo viewing, and race subscription.

This feature drew up traffic across the platform. We also received positive feedback throughout the platform. Users thought the notification and feedback timing was very intuitive, reactive, and anticipating.