Fun People
UX/ UI Design - Mobile Application - Student Project
An engaging online experience for students that can’t attend in-person workshops.
Project Overview
This project is about creating an online learning platform that will transform the in-person learning experience into a 100% digital experience, so people with less time and money can join.
My Role
UX/ UI Designer —
Research, User Interviews, Wireframing, Interaction + Visual Design, User-Testing, Prototyping
Client
“Fun People Inc. is an educational company born in 2014. They currently offer in-person course for outdoor activities, technology, humor, games, and other cool stuff to their mission of teaching people additional skills.”
Team
Myself (Robert Zamora) Andrea Marquez
Duration
August 2020 - 5 Weeks
Tools
Adobe XD, Sketch, Invision, Maze
The Problem
Fun People Inc. needs a way to provide an engaging online experience for students that cannot attend the workshop camp.
The Solution
A product that enables users to learn a new skill via online lectures, practical assignments, and professional feedback: while easily managing their time and tracking their progress
Research
Understanding the problem and finding my user
SWOT & Competitor Analysis
Fun People wants to expand their market reach, by breaking in to an online medium. In order to do this, we needed to asses their current position in the market and breakdown, Fun People as a business.
For competitors we looked at names we know as strong contenders in the online workshop space, and found them to be:
SkillShare
Domestika
CreateLive
We then used that data from our SWOT and Feature comparison, to craft the Market position map you see here. With it we pinpointed where in the market Fun People currently resides and where it will be heading by incorporating our solutions.
User Research
Now that we understood Fun People from a business perspective, our next step was to send out surveys and conduct interviews to find our target user.
We created our survey using a lean survey canvas. We collected quantitative data from 100 individuals:
We found 78% of participants had taken workshops in IT & Web skills
A large percentage of participants shared common pain points of time restrictions and cost
And majority felt personal engagement, and hands on practices were beneficial to their learning experience
We then went in deeper during the interview phase, so we could find the reasoning behind the users pain points and possible opportunities that could be found using online workshops.
“Thinks it’s important to have feedback from both your peers and instructor” - Stephanie A.
User Personas
With the data collected and organized, we identified that our user is in the workforce, and is looking for advancement in their career or even just for themselves. Since Fun People offers a wide variety of workshops, we decided to focus on individuals who want to advance their creative and tech skills.
Primary Persona
Our primary user persona, is Rework Rebecca; she’s a passionate and committed community manager, that wants to expand her creative skill sets. Rebecca is a social butterfly, and often relies on the interaction, and communication of others to keep her interested and engaged on projects.
Secondary Persona
Aside from our Primary, Rebecca, we had insights from our research that felt it would be important to identify another persona. With that we crafted Distant Dennis. Denis prefers to work independently and rely on his own skill to get the job done. He has recently lost his job moved back with his family, so his free time his, to use to the fullest.
User Journey Map
Since we know that designing for Rebecca, will still help Dennis, we focused on her needs and developed a scenario to tell her story. Rebecca is committed to her job, but she’s having frustrations with colleagues not seeing her creative vision on projects. Rebecca wants to develop her creative skills so that way she can better showcase her ideas and find new opportunities in her field.
Design
Developing the solution
Ideations
How Might We
When started ideating, we constructed a Lean UX canvas to organize and map the direction of our ideations. This lead us to constructing 3 How Might We’s the encapsulated our problems that we needed to solve for Rebecca and other users like her.
MOSCOW Method
Since we organized the ideations by their problems; we separated them in to levels of priority by using the MOSCOW method. We knew that there were a lot of things we could add and address in the app, but with this chart we sorted the level of need that our users were facing. This would then carry in to our prototypes.
From the MOSCOW method we come up with the MVP seen below.
Concept Sketches & Mid- Fi Wireframes
From our ideation sketches and brainstorming, we built a quick lo- fi prototype to test the user flow. We tested on 4 users, and gained good insight in terms of flow time, and possible UI inputs/ modifications to take in to account.
Usability Testing
From our ideation sketches and brainstorming, we built a quick prototype to test the user flow. We implemented a maze test and interviewed 5 users; where we gained good insight in terms of flow time, and possible UI inputs/ modifications to take in to account.
Maze Test
Participants had varying levels of success, but all participants where able to complete the assigned tasks. We noted some indirect successes paths and divergent paths from the planned flow, so we knew that we would want to elaborate this during the interviews
Test Interviews
In the interviews we found that users were able to conduct the flow with relative ease, but we did find pain points in the type of icons we used, as well as locations of certain features. For example, though all the users were able to locate the community feature, the did not recognize the icon, only assumed that was the screen because the other ones were more obvious.
Iteration
Based of the insights from the usability tests we made the follow changes:
We added descriptions to the bottom of each icon, so that they are more identifiable
Instead of moving to the next lesson in the lecture screen, we changed it to move to the assignment page.
Visual Design
For the UI, my partner and thought it best to make the interface simple and clean. Making sure to emphasis the course literature and information; we didn’t want to cause any visual distractions with multiple design elements.
Success Metrics & Next Steps
Success metrics will be based on an increase student sign ups, user satisfactory surveys, and user reviews
For next steps we’ll tackle solutions to problems that we ranked lower on our MOSCOW METHOD. Such as:
Interactive Calendar & Alerts
Multiple language options
Class exhibitions
Downloadable class content
Company organized meetups
