top of page

MIKAELA Z BLOCH

IOS NAVIGATION

KIDPASS | 2023

Sole product designer in charge of the visual & UX design and competitive research.

MY ROLE

The design process took around 1 week.

TIMELINE

REDESIGN THE NAVIGATION TO IMPROVE APP USABILITY

  • With the existing tab bar design, it was unclear which tab was selected, making users confused as to which tab correlated to which screens.

  • The existing tab bar design did not follow the iOS tab bar standards, which made it less intuitive for users, causing them to have to learn a new system, which led to decreased app usage.

  • While the app had many screens to be able to navigate to, the tab bar only displayed two, which made it harder for users to figure out how to get to the rest of the screens, leading to decreased app usage.

The existing navigation or tab bar in the app made it difficult to navigate due to:

THE TASK

THE UNINTUITIVE NAVIGATION DECREASED APP USABILITY, WHICH LED TO LOW TIME SPENT IN THE APP

Research

1

Internal feedback

2

Design ideation & iterations

3

Redesigning the iOS tab bar required 3 phases:

PROCESS

FOLLOW STANDARD PRACTICE & HIGHLIGHT ESSENTIAL SCREENS

  • To allow for a more intuitive experience for users, I followed iOS tab bar best practices, which included:

    • Displaying only essential screens

    • Clearly indicating when a tab is selects vs not selected

    • Using succinct terms for each tab

    • Using the appropriate number of tabs and target dimensions

  • In determining which tabs should be surfaced to the user, I had to consider which screens were essential to the user experience, which included screens that would allow them to easily view classes to book, book classes, and manage their bookings.

  • In addition to essential screens, we wanted to surface tabs to the user that would improve the app’s growth and retention. Adding a favorites tab made booking users’ favorite classes easier, which improves retention. Adding an invites tab easily surfaced the referral flow for users, which promotes app growth.

  • I explored other e-commerce marketplace apps to better understand what users are accustomed to seeing in tab bars in similar apps.

In redesigning the iOS tab bar, I had to consider the following:

RESEARCH

INCREASED APP USAGE & BOOKINGS

After launching redesigned tab bar, we noticed an increase in app usage (including higher app open rate and lower app abandonment rate) and bookings made via the app.

OUTCOME

IMPROVING THE USABILITY OF THE APP NAVIGATION INCREASED APP USAGE , THUS INCREASING BOOKINGS

REVIEW LO-FI DESIGNS WITH INTERNAL STAKEHOLDERS

After designing lo-fidelity mockups of the updated tab bar, I tested the usability with product managers and the customer experience team (as that team fields any user concerns). I also reviewed the designs with developers to ensure all design requirements were feasible. Using their feedback, I moved on to designing hi-fidelity mockups.

STAKEHOLDER FEEDBACK

LAUNCH OF A USER-FRIENDLY NAVIGATION

I worked cross-functionally to launch the updated tab bar. I worked with engineering to review the new functionality and QA designs and with product management to plan the launch process.

The redesigned tab bar includes the following:

  • Essential screens:

    • Explore tab: the home tab for users, where they can easily discover the classes to book

    • Favorites tab: users can see their favorites providers to easily make repeat bookings

    • Bookings tab: users can quickly manage their past and future bookings

    • Invites tab: users can refer friends to join KidPass

    • Settings tab: user can easily manage their account & subscription

  • Improved usability: following standard layouts & best practices, the tabs are now easy for users to navigate as selected tabs are clearly indicated and users no longer have to search through many screens to perform desired actions

FINAL DESIGNS

bottom of page