SkillShare Mobile App Redesign
Project Overview
During the Pandemic there has been an increase in people's need to learn new skills Remotely. People are now Aiming toward using online learning platforms more than before, therefore, Skillshare sees an opportunity on improving the quality of users experience while learning through the App, creating 'Personal paths' for people at any level of knowledge & experience who want to dig more into a particular subject but don’t know where to start . These Paths should be clear & to provide enough Information for users in order to help them level up their skills From Novice to Intermediate & Advanced. Moreover, there is a strong need to gamification to motivate users through their learning path & keep them engaged
My Role
As a team, We Followed the design thinking “double diamond” method to structure and complete the project. I was Particularly involved in the research process & synthesising the Data And to use it to create Lo/Hi-Fi Wireframes. I also took part in implementing Gamification aspect to the App
Tools
Figma /Pen & paper /Slack /Zoom / Excel
Duration
2 weeks
Discover
For The first phase of this project we decided to conduct an extensive user interview process to be familiar with user needs. After we went through identifying Skillshare's established competitors, to discover what made them unique, and how they were tackling the same problems as Skillshare.
Affinity Map
Indicating the focal themes extrapolated from the interviews.
Quotes From our user interviews & the Most important research Trends
Competitive Analysis
For our competitive Analysis we conducted a feature inventory to compare Skillshare with it's competitors and to see where it's current App stands in the market in comparison to other learning platfroms
these findings helped us to understand the problems to be solved better to help the business to stay on top of competitors and to help users have the best experience learning through skillshare. from the results, It was obvious that the current app lacked gamification, progress tracking feature and reminders hence, we decided to concentrate more on those to meet the clients' brief and users needs
Define
After gathering all that information from our interviews and our competitive analysis, we moved to our define phase. we were now able to create a set of Jobs to be done in order to help ourselves to see how we can best address our users problems in our design
Primary
Secondary
Based on our Insights from our User interviews we managed to come up with A Primary and a Secondary Job to be done ,which helped us a lot to be focused on our users main needs and expectations. Having our JTBDs In hand, it was time to finally find a solution
Relevant Path
Structure
Engagement
After Iterating on the sets of HMW statements that we came up with within our group, we decided to focus more on these Three HMWs. Why? these three clearly Covered our Main challenges to be able to help the users gain there main needs & goals
Develop
Initial Sketches
Now that we had our HMW statements Framing our Users Needs .it was time for us to start Ideating, we decided to use crazy eight method for our design studio within the group, during this session each of us came up with 8 different sketches of ways to resolve the HMW statements themes. As such, a deliberation of the sketches allowed us to bring forward the ideas that most solved the issues facing users
Improving users engagement through gamification of studies.
Creating a relevant path for Users through a clear homepage & the introduction of levels.
Building a more digestible structure through implementing motivation & content breakdown
Lo-Fi Wireframes
As our next step we went through developing a series of digital wireframes to address our main themes. these were created to be tested and critiqued & to be improved by a second round of wireframes that would becomes the basis of the hi-fi prototype further on in the process.
Round 1
Lo-Fi Wireframes R1 Findings
The results from our usability tests showed that there was a strong need of change in some of our design decisions, More specially our reminder Page, Therefore we continued our design journey with the second round of wireframes
Round 2
In order to solve specific Issues from our First round of wireframes, We iterated only on Particular screens selected based on our Findings from usability tests.
Hi-Fi Wireframes
To be able to move to our Hi-Fi wireframes ,we first needed to decide on our Color palette and typography, The team decided to maintain Skillshare's color palette and typography to keep the culture of the brand. It also represented a good balance between fun and bright accent colors, along side a more academic primary color combination of navy blue and white. also for our typography we sticked into GT Walsheim as it was professional as well as engaging and bold.
After deciding on our color palette and typography it was finally time to design our Hi-Fi wireframes and prototype it
Final Hi-Fi Prototype
Final Prototype testing results
We then tested our final prototype with 5 users by giving them these 3 tasks:(1) finding a desired course, (2) setting a reminder for motivation, and (3) finding a game to join for engagement, the results showed that we were successful to solve some of our users problems aligning with Skillshare's desires, we were also able to pinpoint the weak areas to be worked on as our next steps
Recommendations & next steps
Review layout of reminder page & home screen
Develop profile page to include in a new usability task
Develop profile page to include in a new usability task
Add 1-2-1 with mentor