Meet Skillt, Your Online Learning Companion — UX Case Study
How I did a design challenge that got me an internship at Mamikos
Hi, I’m Dhimas, third-year undergraduate student at Gadjah Mada University (Indonesia) majoring on Information Engineering. A bit of introduction, this project was a design challenge from Mamikos when I applied for an internship as a Product Designer. I did this project individually for about 2 weeks in December 2020, covering the end-to-end process from conducting initial research until testing. It’s quite challenging though because I was in the early phase of learning about UX. Anyway, please feel free to leave a comment or feedback about this study. And also this is my first story debut on Medium, I’m sorry in advance if my writing is a bit messy haha.
Problem Brief
As we all knew, the Covid-19 pandemic made many businesses unable to keep up with the situation in Indonesia. Some of them even forced to discharge some of their employees for financial reasons. In addition, there are millions of unemployed whose numbers increased as more employees are laid off. Data from The Indonesian Ministry of Labour said that until 31st July 2020, the number of workers who were dismissed (Work From Home) or laid off had reached more than 3.5 million.
On the other hand, from the company’s point of view, they find it difficult to spot qualified candidates who can lift the company’s growth, especially in this difficult time of the pandemic. With that said, it seems that there might be a gap between the company’s expectations and the existing candidate’s competencies. This was the main notion of the challenge, so how can we minimize those gaps?
Design Process & Approach
First I conducted user research to dig and get deeper context regarding the existing problem. Then I began to analyze and synthesize the data to point out some key insights to be focused on. Then the process is followed by building the solution, and lastly, testing the final result.
Here’s the overview process that I did:
Talking to Users
The first thing that came to my mind was I have to talk to the job seekers. I reckon that they were the potential user that might give me more context about the problem and might help me to understand and strengthen the problem statement. Then I also wanted to dig deeper about their mental model: what are their needs? what do they do? and so on. Therefore, I conducted In-Depth Interviews (online) with 8 participants. The criteria for participants that I looked for are those who can still be said to be of productive age (18–30 years) and are currently looking for jobs. The research objectives that I define are:
- Discover participants’ mental models, including their goals/motivation and behavior when improving their skill/competence.
- Identify participants’ pain points when improving their skill/competence.
The interview began with a question about how the participant’s experience in job seeking and their pain points. Here are some quotes from the participant’s answer that I got from the interview:
From the verbatim that I got, I found that 2 problem domains arose. The first was about the unavailability of desired job vacancies. However, I feel that this is outside the scope and initial objectives to be achieved, so there is no need to focus on it. Instead, I can focus more on the second problem, which was lacking skills and its improvement. Now I feel more confident about the problem statement and understand more about the scope of this project.
Then, I began to synthesize and cluster all the findings that I got from the interview into an affinity diagram. This would help me to gain a better look for patterns of my findings that will influence my design decisions. I got 2 main themes, which were Motivation in Self-Development and Process in Self-Development.
Key Insights:
- Motivation
Their motivation was affected by 3 factors, first self-awareness. Such as realizing their lack of skills and previous experience. Then the social pressure, which made them feel pressured and FOMO (Fear of Missing Out) because other people already go further. Lastly, time management. Feeling lazy and lacking free time could lower their motivation to develop their skill. - Process
On the other hand, about the process that they took to develop their skills. They had their own preference when looking for a product that might help them to develop their skills, such as recommendations from others, budget, or legitimacy of the education institution. They also picked self-development topics based on their needs and conditions. The method that they took to develop their skills were varied, mostly from video recording and live (webinar because of this pandemic Covid-19). They also tend to do practice after learning the theory.
User Persona
I made 2 user personas based on the observation patterns that I got from the interview. These personas will help me to take better design decisions. It was also helpful to maintain the design scope because we’ll know who the user is, what problems to address, and what behavior is appropriate.
- Rina — The Future Enthusiast
2. Adi — Learn from The Past
Okay, now we know there are 2 personas that we should focus on, then what? At that time I thought that I need to understand more about those personas, so I did a few mapping such as Empathy Map and User Journey Map. Empathy map describes the user’s point of view as a whole, while Journey Map describes sequential activities or specific sequences to each process that’s taken by the users.
Empathy Mapping
As I said earlier, the empathy map helps me to understand the users better. Here I plotted several factors such as what the users feel/think, what they see, what they hear, and what they do. These can be answered from the earlier interview about participants’ baseline behavior.
User Journey Mapping
Unlike the empathy map, the journey map focuses on what specific steps the user went through in performing a scenario. These results are obtained from the earlier interview about participants’ experience in improving their skills. So that later this journey map will help me in building user flow and information architecture.
As we can see, Rina aimed to improve her skills based on her conditions to reach her target career. So her activities carried out starting from awareness of improving skills, then buying products to improve their skills such as courses and webinars, then completing those until getting certificates and trying hands-on practice.
Unlike Rina, Adi has a different motivation, namely to improve his abilities based on past experiences. The activity starts from the failure he has experienced in applying for a job, which then makes him reflect on his previous experience, then tries to make improvements and tries to apply for a job again.
Finally, the research was done, phew!
Ideating Solution
The next step I took was looking for various alternative solutions that might solve the problem by creating design mandates. These solutions were built based on the insights I got before, both from user needs and behaviors. Then I began to prioritize using the Impact-Effort Matrix framework introduced by Eisenhower. The mapping was done based on the impact on user needs and behavior, as well as the effort on technology implementations. So that later I can narrow down the solution into an impactful and efficient product.
Key Solutions:
- A website platform whose main feature is to provide online classes in the form of video recordings that can be accessed asynchronously. Based on the results of previous research, I found that users are more accustomed to studying or doing productive things at the table, whether using electronic devices or books. So that the website platform in the form of a desktop will be more suitable for use. Then according to the previous journey map, users are also more suitable for learning to use video online because they can be accessed again at any time. In addition, the implementation of this video recordings feature is more possible to do rather than creating courses in a live mode which takes a lot of effort.
- Apart from the video classes, I also decided to add a webinar feature to the platform. From previous research, I found that one of the ways users can improve their skills and abilities is through online webinars. Therefore, this feature is suitable to be added and can be an added value to compete with competitors. However, the implementation may require more effort since webinars are synchronous. Therefore, the system that will be used later is limited to only providing information and purchasing webinar tickets. Meanwhile, the webinar itself will use other video conferencing platforms that are more reliable.
- The topics covered are hard skills and soft skills. From the two personas previously obtained, Rina (Persona 1) was motivated because she wants to explore a certain career topic, so that hard skills will be useful to support her needs. Unlike Rina, Adi (Persona 2) was motivated by improving his previous experience in job recruitment, so the topic of soft skills will be more beneficial for him. Hard skills that I meant are related to a particular area of expertise for a career, while soft skills are related to self-improvement that can support a career or find a job.
- Then it is necessary to add other complementary features so that the previous features can run well, such as the availability of detailed information, reviews, e-certificates, and others. And also a few nice to have features, such as add to the calendar and add notes. Because of the previous research, I also found that the users had difficulty maintaining consistency in their learnings. They are also accustomed to direct practice or note down the material they have just learned.
Experience Mapping
After having a solid grasp of the solution to be developed, I began to create the experience map. It was a combination of information architecture and user flow, which describes the information structures and workflows in the application. This method is quite efficient because I could quickly get a broad overview of the application. So that later it will help me on crafting the Hi-Fi design.
This experience map was built based on the journey map that I made before. The flow and placement of information are adjusted to the sequence of activities that the user passes. It seems it will be too long if I explain it here, I’ll explain it later along with the Hi-Fi design.
Design Guidelines
To develop the branding, I decided to name the platform “Skillt”. It’s a play on the word “skilled” which means expert, so I thought the name “Skillt” would be interesting. The whole visual treatment concept was professional and encouraging looks. That’s why I used more photos, sans serif font, and the fairly solid red color but still comfortable to look at.
Hi-Fi Design
After creating an experience map and design guidelines, I continued by crafting the High-Fidelity Design and a prototype using Figma. I probably will not explain every page that I made in this project because there are too many, maybe just the important ones.
- Home Page
The landing page will be displayed the first time the user opens the Skillt website. Even if the user doesn’t have an account, they can still access and preview the content (courses, webinars, etc) of this platform. And I also add a feature called Career Path, a collection of different classes based on specific topics. Because from the previous research, I found that users tend to learn something to achieve certain career goals. So career paths might be helpful in the user’s learning process.
- Navigation Bar
The navigation bar will connect the user to the various pages contained in this platform. In Browse Course, the course topic provided is divided into 2 broad categories, which are hard skills and soft skills.
- Search Page
This search page is displayed when users use Browse Course or Search, it contains a list of the courses that the user searched for or filtered. I added filter by level because from the previous research I found that users find it difficult to find material that suits their current level of understanding. And also filter by price range because the budget is one of the main factors in user preference when looking for a course. In presenting courses, information is compiled based on the user’s journey from previous research. Which started with a course photo depicting the topic, followed by the title, tutor, rating, price, until CTA for buying the course.
- Course Details
This is a page of detailed information about a course before it is purchased by the user. It contains information such as about the course, topic overview, and reviews. The most visible information is the demo video because this video will give the user an overview of the course. Then they can also see information about prices, benefits, and CTA for buying the course. I also listed additional information such as the number of students, because it might be a convincing factor for potential buyers. It is also a social aspect that can increase user motivation. Then there are few additional features that I included such as Bookmark and Share.
- Course Content
This is the page when the users access the course content that they have purchased. There is a list of learning video content, alongside several features such as materials, notes, and contacts. After the users complete the course content, they can carry out a final exam to get a certificate.
- Webinar
The webinar feature allows users to view webinar information available on the Skillt platform and purchase tickets for the webinar. Thus, the webinar takes place on other video conferencing platforms (such as Google Meet, Zoom, and so on), and the Skillt platform will provide a link to the webinar room to the ticket buyers. This feature itself aims to accommodate user behavior which tends to improve their skills and abilities through webinars. Apart from that, this webinar can also be Skillt’s distinct feature because it doesn’t exist in other competitors yet.
Usability Testing
Now I have an interactive prototype for the solution, the next step I did was try it out with the potential user directly. With usability testing, I wanted to get feedback from users and the pain points they felt when using the prototype. The testing was conducted with 5 participants who had the same criteria as the previous interview, they are on productive aged range 18–30 years and looking for jobs.
Each participant is given 4 tasks and the SUS value will be calculated. Here’s the test scenario:
- Task 1: Look for a course called “UX Design 101”, then buy it or checkout with the Bank Transfer payment method. Do it until the payment is successful.
- Task 2: Open the “UX Design 101” course that was purchased earlier and complete the course until the final exam. Do it until you get the exam results and class certificates.
- Task 3: Put the career path course package with the topic “Getting Started in Web Development” into the buying cart.
- Task 4: Open the previously purchased webinar called “Financial Planning to Achieve Saving Goals”. Do it until you enter the webinar room link.
Here’s the SUS Score result from the test.
As we can see that the average SUS Score exceeds the value of 68, which means that it passed the minimum score to be acceptable (Bangor, Kortum, and Miller, 2008). So we can say that the design of the Skillt platform was well received by users and pretty usable. However, there were some design improvements that can be made after receiving feedback from users.
On the tab in My Learning, several words are quite ambiguous. The first is the word “Purchase”. Some participants said they could not understand what the tab contained. So the suggestion is to replace it with the word Purchase History to confirm that the tab contains the user’s purchase history. Then the word “Bookmark”, some said that it was not suitable for use. The suggestion is to replace it with the word wishlist.
Some users also said that there should be a Notification feature. This feature can be useful, one of which is to alert users when there is a webinar that is taking place soon.
Conclusion
Skillt is an online learning platform that can help users improve their skills either through courses or webinars. The topics provided also vary, from hard skills to soft skills. Hopefully, this platform can minimize the gap that occurs between industry needs and the competence of job seekers in the community. Because this platform can accommodate job seekers to hone their skills thoroughly so that they are ready to compete in the job world.
That’s it, thanks for reading! Feel free to leave a like or comment. I’m also open for further discussion, just ping me out :)
LinkedIn: www.linkedin.com/in/dhimasaji/
