Academy

UI/UX Design
Product Design

Tools Used

Confluence · Asana · Figma

Overview

Academy is a personalized learning application centered on providing business-focused educational content on a membership platform. Users are able to engage on free or paid tiers, keep track of their learning, and rate courses and classes.

PRD Development

I wore many hats during this project--working on both the Design and Product teams to outline the product from start to finish. Early in the process, we created a PRD to identify high-level requirements and determine project scope.

User Flow

I created user flows mapping the user journey from different entry points and different relationships with the Academy. For example, i created 'Persona A' who is a new user who landed on the product page after clicking on an ad on LinkedIn. She is interested in consuming educational content to upskill and is interested in lectures from subject matter experts. 'Persona B' is a user who is familiar with the Academy and its mission, and enjoys scrolling through new content to find a topic that interests her.

Wireframing

The PRD and user flows were used as a blueprint to generate low-fidelity wireframes. I used the wireframes to further refine my designs by identifying usability problems before development began.

Design System

I created a simple design system to make the design process more efficient through a shared library. Updated color palettes and typography were implemented and UI states were defined for core components. The design system is a working document, with components added as the need arises!

UI Design

Implementing user feedback, I refined the design while creating a high-fidelity prototype. Users are able to filter classes and courses on the home page, view trending content, and navigate to their personal dashboard to view learning progress and saved content.

Next Steps

The designs have been passed to the development team, where the application is currently being built! Stay tuned for a live version of the site!