Zaahah

Extracurricular Rewards Platform

Role

Lead UI/UX Designer

Duration

October 2021 - March 2022

Platforms

Mobile · Desktop

Impact

3 products launched

Project Goals

Zaahah is a platform designed to get US teenagers off their screens and back into in-person activities. The challenge: design three interconnected products simultaneously — the student app, a SaaS CMS for administrators, and aHa, a virtual rewards wallet.

As Lead UI/UX Designer, the work spanned mobile-first student experiences, desktop-first admin tooling, and a cross-product design system holding all three together.

Problem

US teenagers were increasingly avoiding in-person extracurricular activities. Schools and parents had no tools to monitor, manage, or incentivize participation. Three separate product needs — student engagement, admin oversight, and reward management — had no existing solution.

Process

Discovery

Benchmarking

Discovery

SWOT

End to End processes

Researching

Customer Journey Map

Prototyping

Information Architecture

Wireframing

Design System

User Persona

Usability Testing

Flows / Wireflows

Heuristic Evaluation

User Interviews

Mentoring / Supporting Teams

User interviews

Bench marking

Research

Customer journey map

User persona

Information Architecture

Design system

Prototyping

Wireframing

Wireflows

The solution

Three interconnected products: the Zaahah student app (mobile-first activity discovery and participation), Administrator Mode (a SaaS CMS for parents and teachers with data visualization and approval workflows), and aHa — a virtual wallet students could use to transfer, gift, or save coins earned by showing up in person.

Three products

One designer

01.

Zaahah Student App

Designed the full UX for the student-facing mobile and desktop experience — activity discovery, participation tracking, and rewards redemption.

02.

Administrator Mode

Built a SaaS CMS for parents and teachers to monitor student activity, manage clubs, and approve participation requests with data visualization.

03.

aHa Virtual Wallet

Led a junior designer on aHa — a wallet that rewarded students with coins for attending in-person events, redeemable, transferable, or saveable.

Effective Communication:

Team of over 60 professionals, navigating through challenges associated with diverse geographical locations (Poland, United States, Ireland, London, and Germany).

Agile & Time management:

Overcame time constraints and communication challenges inherent in a project with numerous devices, tasks, and stakeholders following agile methodologies.

QA & Testing:

Conduct thorough UI quality assurance by comparing the design with the production product and recommending enhancements. One by one thru all platforms.

04.

Cross-product Design System

Created a single design system serving all three products — Zaahah, aHa, and the admin panel — ensuring consistency across divergent use cases and audiences.

05.

Stakeholder Presentations

Delivered iterative findings and design rationale to stakeholders throughout the process, maintaining alignment and trust at every stage.

05.

Stakeholder Presentations

Delivered iterative findings and design rationale to stakeholders throughout the process, maintaining alignment and trust at every stage.

Design Highlights

Warmth as a design decision.

Mobile-First for Students

The student app was designed mobile-first — recognizing that teenagers' primary device is their phone, and the entire experience needed to feel native and fast there.

Desktop-First for Admins

The administrator mode flipped the approach — a data-rich desktop-first interface giving parents and teachers full visibility without sacrificing usability.

Effective Communication:

Team of over 60 professionals, navigating through challenges associated with diverse geographical locations (Poland, United States, Ireland, London, and Germany).

Agile & Time management:

Overcame time constraints and communication challenges inherent in a project with numerous devices, tasks, and stakeholders following agile methodologies.

QA & Testing:

Conduct thorough UI quality assurance by comparing the design with the production product and recommending enhancements. One by one thru all platforms.

Three-Panel Layout

The web app used an intentionally unconventional three-panel layout (menu, content feed, wallet/chat) — breaking category conventions to match the multi-tasking reality of student life.

Scaling the DS

One system serving three products with very different audiences required careful tokenization — flexible enough for a student rewards UI and a professional CMS simultaneously.

Challenges &

Constraints

01.

Time Constraints

I was managing three projects simultaneously, additionally, I was tasked with creating the design system, making time the primary challenge.

02.

Limited Wireframing

Due to the tight deadline, we had no room for creating wireframes. We had to move straight to building the final product.

03.

No Time for Testing

The client explicitly requested to skip the testing phase, planning to test the product in a live production environment instead.

Effective Communication:

Team of over 60 professionals, navigating through challenges associated with diverse geographical locations (Poland, United States, Ireland, London, and Germany).

Agile & Time management:

Overcame time constraints and communication challenges inherent in a project with numerous devices, tasks, and stakeholders following agile methodologies.

QA & Testing:

Conduct thorough UI quality assurance by comparing the design with the production product and recommending enhancements. One by one thru all platforms.

User

Persona

The administrator mode was designed for professors and parents who wanted to supervise and ensure the safety of Zaahah. The target users were between 30 and 45 years old, primarily located in the United States, with a focus on Chicago.

Matrix &

MoSCoW

Planning and organization were crucial for this project. After understanding the business goals and discussing them with the client, I decided to create a MoSCoW Prioritization Matrix. This approach helped identify what we should focus on, must achieve, could include, and won’t pursue.

Information

Architecture

We had to organize a large amount of sections and information, including graphics, forms, inputs, dates, and a complex dashboard. Thankfully, much of this information was already structured in the "Student/Public" view, so our main task was to assign and redesign these sections into an administrator panel that would be easy for our target users to understand.

Designing for

Desktop

This project was designed with a desktop-first approach, as the parents and administrators would be using their personal computers.

Designing for

Mobile

However, we also explored a mobile native version to provide flexibility for admins who might need to manage tasks on the go, ensuring it would be simple and user-friendly.

Creating the

Design System

Additionally, I created the design system, which needed to be versatile and work across three different platforms: Zaahah, aHa, and the administrator mode. This design system helped a lot! and generated consistency across all products.

Zaahah for

Students

For this project, we decided to create only low-fidelity wireframes for mobile since we adopted a mobile-first approach. This allowed us to explore numerous ideas and conduct testing.

Problem

School students in the United States have been avoiding in-person activities, primarily due to a lack of motivation as many need to work to cover their own expenses.

Solution

Developing a platform with a native mobile app that rewards students with virtual currency for participating in in-person activities, which they can redeem for real-life benefits.

Effective Communication:

Team of over 60 professionals, navigating through challenges associated with diverse geographical locations (Poland, United States, Ireland, London, and Germany).

Agile & Time management:

Overcame time constraints and communication challenges inherent in a project with numerous devices, tasks, and stakeholders following agile methodologies.

QA & Testing:

Conduct thorough UI quality assurance by comparing the design with the production product and recommending enhancements. One by one thru all platforms.

Prototyping for

Mobile

Starting with the mobile-first approach was intriguing because we aimed for a product that stood out from what was already in the market. This approach enabled us to experiment with iconography, various types of cards, and delve into gradients or colors that would capture the attention of teenagers

Prototyping for

Web

The website presented an even greater challenge as we experimented with various types of navigation. We divided it into three panels: the right panel contained the menu and some options, the middle panel displayed the content and feeds, and the left panel housed the virtual wallet and chat. This approach was highly creative and explorative, breaking away from the common conventions.

Leading

aHa

aHa was a virtual wallet integrated with Zaahah, where users could deposit virtual coins earned from participating in in-person activities. It also offered the opportunity to buy and sell NFTs. I led this project, as I was already designing two other projects for the company. In this role, I mentored and guided our junior designer through the process.

Problem

We needed a virtual tool to deposit and manage coins that students could use.

Solution

We created a virtual wallet integrated with the main app, allowing students to manage their coins by transferring, gifting, or saving them.

Effective Communication:

Team of over 60 professionals, navigating through challenges associated with diverse geographical locations (Poland, United States, Ireland, London, and Germany).

Agile & Time management:

Overcame time constraints and communication challenges inherent in a project with numerous devices, tasks, and stakeholders following agile methodologies.

QA & Testing:

Conduct thorough UI quality assurance by comparing the design with the production product and recommending enhancements. One by one thru all platforms.