Simplifying After-School Activity Booking and Payments
for Parents of School-Age Children

Activibee App, UX Design Case Study

The product

ACTIVIBEE as an mobile app caters specifically to parents seeking efficient after-school activity management for their children.
 
Following project is a first Case study within the Google UX Professional Certificate program. The theme was provided by Google as a part of the course.

Project Duration: Q1-Q2 2024

Project overview

  • Booking activities in Slovakia is done by email or in person, often lacking any form or management

    The Problem

  • Find a solution that allows for simple onboarding and booking

    The goal

  • As a beginner UX designer at a time, my role was to follow course instructions and adobt best practices for the field

    My role

  • Solving UX for project prompt "Design an app and responsive website that parents use to enroll their kids in after-school care and pay for the service"

    Responsibilities

The solution

Onboarding

  • Focused on adding a child to the app

  • Hobby selection determines suggested activities on Homepage

Activity Booking

  • Booking process starts from Activity card or button “+Book New activity“

  • The user decide how to book based on time available at hand

User research

  • For this project, I was provided with a data sheet that includes bio of potential users. By analyzing the data I've spotted common themes and derived user pain points.

Target users

  • Age 20-40

  • Families with busy schedule

  • Single parents

Pain points

  • Less time for tasks

    Planning should not take long time, because usual schedule of the users gets overwhelming easily.

  • Budgeting

    Affodrability of the service plays a key part in decision process.

  • Unstable schedule

    With a lot of tasks to tackle + work settings and possibility of single parenting can schedule become unpredictable.

  • Disorganization

    Connected to pain point nr. 3. there is a possibility of a snowball effect that leads to disorganization.

Design criteria

  • The user experience should accomodate for the fact, that most users will be parents wih lots of responsibilities.

    Ease of use - Apps interface need to be simple clear and calming.

Information Hierarchy & User Flow

Meet the users

Mapping the possible journey

How it begins:

From paper to digital

Paper wireframes

Transfering to digital

Early prototype

You can interact with the prototype by below or open in new tab.

Room for improvement

  • The first usability study was conducted as a moderated type with 5 participants aged between 35-45 years old. A few significant flaws were uncovered, listed from priority 0 to priority 2.

    Note: Before the study, prototype was updated and translated into Slovak language.

Study findings

  • Homepage

    Row “Booked activities” was mistaken for a booking flow. 4 of 5 participants begun booking from this part, wich rendered the prototype unusable.

  • Adding a child

    This option should be included into booking flow as well in case of skipping the onboarding process.

  • Time picker

    Multiple participants asked additional questions about the function.

    Exploring the functionality was planned in later versions.

2 Addressed areas

Before the study
After the study

Homepage

Updated with a simple calendar view, row for suggested activities moved down.

Before the study
After the study

Activity Booking

Updated with a functionality to add a new child and augumented time picker.

How it works:

Onboarding & Booking an activity

Onboarding

App Base

Booking Flow

Making it easier:

Prototyping with variables

Activity card

All cards include a set of interactions linked to Activity detail page wich is empty as default.

List of interaction variables

By tapping on card the user triggers 16 interaction details in total. This robust build enabled to dramatically reduce the number of necessary screens.

Empty spaces

Showcase of empty Activity detail screen before trigerred interaction.

High-Fidelity prototype

You can interact with the prototype by below or open in new tab.

2nd Usability study

  • The second usability study was as well conducted as a moderated type with 5 participants aged between 35-45 years old. Overall, the design was well received, however few issues needed to be addressed.

    Listed below based on priority.

Study findings

  • Activity cards

    Activity cards lack important details. Participants asked for details about proximity and rating system.

  • Booking flow

    Create bookings based on simple time filter and recomendations based on proximity should be more apropriate for time saving.

  • Location

    Instead of picking school for a child, use location services. Shools rarely provide activities after school in Slovakia.

    Most of the activities are provided by third party Non-profit organizations.

  • Title renaming

    Title “Activity for” in booking flow needs to be simplified. Participants also suggested to add hint below the title.

3 Final improvements

Before the study
After the study

Homepage

Updated with a button under the calendar view, enabling the simplified booking suggestions.

Activity Cards have new update visual with functionality such as proximity and provider

Before the study
After the study

2nd Booking Flow

Based on simple time filter and small activity cards
in next screen.

Before the study
After the study

Onboarding with child detail overlay.

Updated with location toggle
instead of “Choose a school” input.

Final prototype

Finalized version with implemented feedback from the second usability study.

Minor bugs may occur.

Key takeaways

  • Impact

    In the real world, implementing the app should need a deeper dive into mechanics of providing the activities and processes that will trigger user notifications regarding the ongoing activities, status updates etc.

  • Lessons from the project

    This project thought me core principles of UX design process and best practices for the field.

    On my own time I did my best to reinforce my learnings by going deeper into industry standards, including advanced Figma functions.

What I’ll do differently next time

  • 1.

    I would like to make the ideation phase more streamlined. Since I use freeform on iOS, I need to improve on structuring the ideation and make the artboard more organized.

  • 2.

    To improve my wireframing process, I've already adopted a few practices. However, the real improvement might be to start with a warm-up before putting pen to paper. This could shorten the time needed to get the wireframes ready.

  • 3.

    It is necessary to point, that the case study was written after the work was done. However for the future I see benefit in documenting my work better along the way.

What’s next

  • Diving deeper

    Possible exploration for this theme could lead to creating an interface for providers.

This could be achieved both as an app or web based on CMS interface.

  • Second part of the prompt

    This Case study is a first part of the prompt chosen during the Google UX Certificate course.

    Click the navigation buttons below to view the second case study for this prompt.

One (or) more thing(s)

  • Study Slide deck

    There is a Slide deck version as well you can visit here.

  • Original Figma file

    Have a look at my design process, view the file here.

  • Let’s connect

    If you’d like to reach out and say Hi or grab a coffee, you can do so by writing an email:

    say@helloluke.tech

Thank you

  • I truly value the time you spent to learn about the project.

Previous
Previous

Changing the way archers gather their scores in competitions

Next
Next

Overhauling Activity Management for School-Age kids with New Web Interface