Digital Talent

A platform that will teach you using interactive ways along with professional mentors that will bring a great experience in your learning.

UX Research, UX Designer, UI Designer

Freshmart

Project Scope:
4 Weeks

Project Type:
Google UX Design Project

Role:
UX Research, UX Designer, UI Designer

Tools:
Paper, Adobe XD, Zoom

Digital Talent Responsive Website

Digital Talent is a responsive website for digital talents who want to develop themselves professionally, through our boot camp’s program, consulting with our experienced mentor and we provide free courses in forms of webinar and articles per week.

The Problem

Users get confused where to find a best platform to deep dive their interest learning to become professional ones, they also need affordable prices for the courses and sometimes need to consult with experienced mentor when they lost focus in the midst of learning.

The Goal

Create a cross-platform responsive website that allows user to learn with boot camp program, consulting with experienced mentor and provide them with free webinar and some articles so they can deepen their learning process.

Undraw Website

Empathize Phase

User Research

I conducted user interviews with 3 people, then turned the interviews into Affinity Mapping and Empathy Maps to better understand the target user and their needs. A primary user group identified through research where the people were students and entry-level workers who want to deepen their learning.

Affinity Diagram

Problem Statement

Users want to get courses or trainings with complete materials, guided by experienced mentors who are the best in their fields and can be patient while guiding, meanwhile packed at affordable prices.

How might we? We help users to get courses or trainings with complete materials and guided by experienced mentors who are the best in their fields and can be patient while guiding, meanwhile packed at affordable prices.

Persona & User Journey Map

After I conducted interviews with 3 people and did the Affinity Mapping, the next step is I created 2 fictional personas and 1 user journey map. The purposes are to help me watch the steps users take to accomplish their goal, and to help me to see the opportunity that I can do to improve a better and optimized user experience.

User Persona 3
User Persona 4
User Journey Map

Define & Ideate Phase

This is the Solution

After I receive the main problems from the users based on the interview researches, I offer some solutions to answer their pain points;

Solution

Competitor Analysis

I conducted a research and an analysis with 2 direct competitors with similar target audience and USP. One is Build with Angga with guided method, while the other one is in a form of YouTube, which is an indirect competitor with USP, where users can learn any tutorials on YouTube. I studied the flow from these three websites and found a new USP for digital talent, which these three do not yet have, so digital talent can compete for the free courses webinars and articles features.

Competitor Analysis

Crazy Eight Ideation & Sitemap

I performed Crazy Eight in 8 minutes to come up with some ideas while remembering the features of the solution that will be made on this digital talent responsive website to overcome the problems experienced by users. By conducting this method, I am able to focus on things I have to do, and then I identify and organize all of the information in a meaningful way, which defines the information architecture and hierarchy by using sitemap.

Crazy Eight Ideation
Sitemap

Prototype Phase

Digital Wireframe Until Lofi Prototype

Based on the idea of the features in Crazy Eight and the sitemap, I created digital wireframes. I also combined all the wireframes into one system and made them clickable. This approach made it easier to see and understand the whole navigation and structure.

Digital Wireframe Until Lofi Prototype

Usability Testing

Usability Testing

At this point, I conducted Usability Testing with 5 people, who are 3 students and 2 others are people who have worked according to my target audience, aged around 20 - 30 years, for approximately 15-20 minutes via Zoom Meeting. I received feedback on my designs from them and I made sure to listen to their feedbacks. The following are key insights from Usability Testing; there are 2 problems that I have to overcome.

Usability Testing 2

New Iterations After Usability Testing

Through the iteration process from Usability Testing, it allowed me to earn new insights that I had never thought of before and surely made this designed application even better.

Iteration 5

Based on the insights from problem 1, I added down arrow to indicate that the product can be clicked in a form of dropdown menu, so user will know there will be the course after they click the product.

Iteration 6

Based on the insights from problem 2, I added profile on navigation bar to allow user track their current learning and upcoming ones so they will not get confused to look up their learning.

Visual Design

Style Giude and UI Kit

Style Giude and UI Kit 2

HIFI Design

After I had done the wireframe, usability testing and fixed the problems which the user was facing when usability testing, I continued by crafting the High-Fidelity Design, following the same user flow as the lo-fi prototype, and prototype using Figma.

Homepage

This is the first landing page that the user face; therefore, I ensure the user aware of the benefits obtained when the user learns on this website. Besides, I also assure them that our mentors are very experienced, coming from a popular & professional work background, and they are able to introduce the products in this digital talent.

Homepage 3
Homepage 4

Bootcamp

In this boot camp, users can learn based on their interests by choosing a category, and the learning process from this boot camp is video learning based that is taught by mentors. The users will get assignments and projects to practice directly besides the theory itself, and then users can see their learning progress and obtain the value after.

Bootcamp 2
Bootcamp 1

Mentoring

Within this mentoring feature, users can easily book consultations with mentors who are professional in their fields, by scheduling dates, times and consultations via Gmeet or Zoom. Through this feature, experienced mentors can directly answer questions from the user.

Mentoring 1
Mentoring 2

Free Courses

Users can learn for free through free courses on digital talent, webinars and articles that will be updated every week. There will be experienced and professional mentors as well so that users can develop their skills and gain knowledge from great people.

Free Courses
Webinar

Other Screens

Here are other screens, one is ‘About us’ which tells about the meaning of digital talent and their journey, next one is ‘My Profile’ where users can easily see and track the course they are learning. The last is a checkout process, which has easy steps so users can proceed the payment easily without any troubles.

About Us
Profile
Others 3
Others 4
Others 5

Mobile Version

Mobile 1
Mobile 2

Lesson to Learn

By doing this study, I actually forced myself to learn Adobe XD for the first time and learn a proper framework to handle this kind of project.

I discovered the importance of user centered design and ways how to make a better product through understanding our user front and center.

I would like to thank my mentors from Google UX Design Professional Certification to teach me the design thinking process and my peers who gave me a lot of feedback.