Skillify

An Interactive Microlearning Streaming Platform

Platform: Mobile

Skillify is an interactive microlearning streaming platform focused on educational accessibility. The platform targets high school and early college BIPOC and minority communities who lack access to certain types of education, helping bridge educational gaps. Skillify offers extensive free and diverse learning content, with teachers distributed equally across various subjects to ensure comprehensive coverage.

Skillify includes:

  • Bite-sized learning: 3-10 minute lessons.

  • Content variety: Expert-led workshops and recorded live lessons.

  • Interactive features: Live quizzes, polls during video lessons.

  • AI integration: to assist and enhance the effectiveness of microlearning through personalized learning paths, adaptive assessments, and smart content reommendations.

  • Collaboration tools: Message threads and virtual whiteboards for sketching.

  • Gamification elements: Play features to help make learning fun and reinforce lessons.

User Persona: Maya Rodriguez

Define Phase Part 1

Age: 17

Occupation: High School Student

Income: Under $3,000

Location: Union City, NJ

Status: Single

“I love to draw and help people. What types of careers should I be consider as a designer? Where should I start?” - Maya Rodriguez

About

Maya Rodriguez is a Hispanic, first-generation high school student aspiring to study design in college. With limited access to specialized resources and mentors, she struggles to find direction for her goals. While working a part-time job at a local grocery store to support her family, Maya has little spare time and feels stressed about finding a well-paying career aligning with her passions. She seeks an app able to allow her to learn on the go during her commutes between home, school, and work. However, when searching for learning apps, Maya becomes discouraged upon discovering most quality content requires paid subscriptions.

Needs

  • Quick Lessons: Short free/affordable lessons to consume during her commutes and breaktimes.

  • Interactive Q&A: Option to attend live sessions so she can ask questions.

  • Community Support: Forums or mentor interactions.

  • Interactive Challenges: Small hands on projects, quizzes, and games.

Frustrations

  • Limited Access: No design-focused courses at school.

  • Lack of Mentorship: Has to look for role models outside her personal life.

  • Tech Proficiency: Uses shared family computer and smart phone for learning.

  • Supporting Family: Finds herself working part-time to help family financially.

Personality

Passionate

Determined

Caring

Artistic

Creative

Current Feelings

Lost

Stressed

Concerned

Busy

Competitive Research

Define Phase Part 2

To help make informed decisions about designing an interactive microlearning streaming platform, competitor products were gathered and analyzed in a competitive research process. After reviewing popular learning platforms including LinkedIn Learning, Kahoot!, and Duolingo, I selected MasterClass and Skillshare for further in-depth analysis below.

MasterClass

Dislikes

Need to pay for access.

High priced

Lack of diverse instructors.

Celebrity focused.

Limited content and navigation.

Likes

Minimal Aesthetic.

Less is more.

Easy to navigate.

Feels premium.

SkillShare

Dislikes

You need to pay for full access.

Lack of quality consistency between classes/videos.

Celebrity focused / influencers.

Scrolling category experience.

Likes

Balanced skill learnings.

More affordable.

Some free courses.

Student projects + discussion.

A friendlier UI aesthetic.

Sketch Crazy 8s

Ideation Phase Part 1

The ideation phase began with a Crazy 8's exercise—a rapid brainstorming method where I sketched 8 distinct ideas in 8 minutes. My first sketch featured a simple home screen with two large image posts. In drawings 1–3 and 6–7, I explored various ways to arrange posts with text along their sides. The 4th and 8th sketches focused on the play screen layout, while the 5th sketch developed a category screen concept that emphasized large, readable imagery with straightforward downward scrolling.

Low-Fidelity to Wireframes

Ideation Phase Part 2

As I began creating low-fidelity prototypes, I focused on designing Skillify's home, category, and "playing now" screens. Drawing inspiration from my competitive research and Crazy 8's sketches, I developed three initial designs. Sketch 1 expanded a basic two-post layout into 6-9 easily readable posts. Sketch 2 featured a streamlined design with a prominent play screen, video description, and teacher profile link. Sketch 3, influenced by MasterClass, consolidated all categories into a single left panel. After sketching these first 3 iterations, I moved them into Figma to develop as wireframes. Drawings 4-6 were eventually distributed with friends and Springboard’s Intro to UX/UI Design cohort for feedback.

Before moving into high-fidelity prototyping, I decided to re-sketch the three screens. For the home screen, I enlarged the video posts to resemble playing cards with additional text information. The "play now" screen remained similar, with minor text repositioning for better usability. Finally, I redesigned the category screen to align with my previous Crazy 8 sketch, featuring larger category buttons and a vertical scrolling layout.

Hi-Fidelity to Animation

Prototype Phase

For high-fidelity prototyping, I selected teal and white as primary colors, complemented by sky blue, light green, and pink accents. These colors evoke nature and calmness—essential qualities for a learning environment. The pink accent introduces a playful element while creating contrast with the calming tones. Skillify's logo combines a double learning gear with a central core, while the exterior features a split gear and rushing wind to symbolize on-the-go learning. The screens build upon the final low-fidelity sketches (images 1-3), incorporating colors, symbols, imagery, and effects. With the use of components, groups, and frames, a mini animation is created at the end to demonstrate navigation flows between the home, "playing now,” and category/discover screen.

AI-SkillBuddy Assistance and Gamification

Lo-Fidelity to Hi-Fidelity Progress

AI-SkillBuddy and gamification features make Skillify more accessible and engaging for BIPOC and minority students. The AI-SkillBuddy feature helps provide personalized, judgment-free support and would be able to adapt to individual learning styles and schedules, helping to overcome traditional barriers to academic assistance. The platform's gamification elements, including vocabulary games and achievement systems, transform challenging subjects into engaging experiences. The combination of the two help create an inclusive experience making educational content more approachable and enjoyable for all students.

Springboard

Course: Introduction to UX/UI Design

Mentor: Hope Kay

Individual Project: Christian Cueva

Fall 2024