← All Work 04 / 06
Mobile Design MVP Peer Learning

Peer Skill Sharing Mobile App

Designing the UI for a minimum viable product that lets students archive hours spent learning skills and find peers for knowledge exchange — turning informal learning into a structured, social experience.

Role
UI Designer · UX Contributor
Team
Mayank Gupta, Hao Ni
Duration
8 weeks
Tools
Adobe XD
Skill Sharing App Mockup
01 — Challenge

Creating an MVP for Peer Learning

Pratt Beta Space needed a platform that would allow students to track hours spent learning skills outside the classroom and enable peer-to-peer knowledge exchange. The goal was to design the UI for an MVP — just enough to begin initial user testing and validate the core concept before development.

The challenge was addressing a diverse student audience while keeping the experience seamless for everyone, from design students to engineers to architects.

Goal 01
Give users the ability to record and archive hours for skills learned outside the formal classroom setting.
Goal 02
Authenticate and validate user progress — building a credible record of informal learning alongside academic credentials.
Goal 03
Provide flexibility to learn anywhere, anytime — enabling asynchronous peer connections that aren't constrained by schedules.
02 — Process

Research + Design + Iterate

My primary contribution was designing the low and high fidelity screens across all flows. I also actively participated in brainstorming and researching features for the MVP alongside a product developer and product manager.

Design Process
The three-phase process: Research → Design → Iterate

Defining the User Flow

The first step was to determine the user flow and identify the unique screens required for the MVP. We began by defining primary user goals, then mapped various flow iterations with a student persona in mind. This helped us establish screen priority before any design work began.

Brainstorming Notes
Notes from brainstorming sessions — mapping user goals to screen requirements
03 — Wireframes

From Sketches to Low Fidelity

Before the design phase could begin, we each sketched basic wireframes independently and then converged to discuss ideas. Individual sketching before group review produced richer divergence and better raw material to synthesize.

To move faster, we divided screens and worked on them individually while following a shared style guide — ensuring consistency without requiring constant synchronization.

Initial Sketches
Primary sketches — individually produced to maximize divergence before synthesis

Trial and Error

We explored three different approaches for handling password requirements on the registration screen — a detail that significantly affects perceived trust and friction at the most critical moment of onboarding.

Trial and Error Screens
Three iterations of the password requirements UI — testing clarity vs. simplicity
Final Wireframes
Final low-fidelity wireframes — establishing layout and flow before visual design
04 — Final Design

High Fidelity Prototype

The final high-fidelity prototypes covered the core MVP flows: login, registration, skill adding, and hours tracking. The designs hit the intended goal — clear, focused, and ready for initial user testing to validate the core concept.

Final Prototype
The Final Avatar — high-fidelity MVP covering all four core flows

The MVP scope was intentionally tight — login, registration, skill adding, and hours tracking. Staying focused on what needed validation first prevented the common trap of designing beyond what could realistically be tested.

— Project reflection
05 — Reflection

Learnings

I transitioned off the project when app development began and the visual design phase was underway — a natural handoff point in the MVP lifecycle. The experience of working closely with a developer and product manager revealed how design decisions ripple into engineering constraints in ways that aren't visible when working within a design team alone.

Learning 01
Defining screen priority through user flow mapping before wireframing significantly reduced rework — the investment pays forward in every subsequent phase.
Learning 02
Working directly with developers sharpened my instinct for design decisions that are deceptively expensive to implement vs. visually equivalent but cheaper alternatives.
Learning 03
Individual sketching before group synthesis produced better divergence. Shared style guides enabled parallel design work without sacrificing cohesion.