Redesigning Vokraf — Online Learning Website (UX Case Study)

Disclaimer: Official Vokraf does not do this. This is just a concept that I created on the basis of my first experience when I saw the Vokraf Website. None of the content, fonts or colors are mine. I use it purely for learning purposes

Role: UX Research and UX Design

Team: Solo

Goals

1. To Build Additional Feature such as Application That Offer Creative-based Online Learning
2. To Make The Appearance of The Website And Service More Efficient and Organized
3. As a Creative Online Learning Website, To Make The Vokraf Website More Ingenious and More User-Centered

My Proposal

There is one thing I want to change/move from the class service view of Vokraf. That is, Adding some pictures of the class/instructor of each online learning to the landing page when the user sees the class selection.

Instead of overhauling the existing Vokraf website, I will add simple and useful features such as

• Adding a Review from users directly on each feature on the Vokraf website
• Added a student project feature from the user, so that Vokraf visitors can be “confident” and see the progress of each old user who has run classes in Vokraf

UX Works Flow

Empathize

Heuristic Evaluation (also, a little bit of background story)

It started at the moment when I was interviewed by one of my friends who applied at Vokraf as a learning experience research. At that time, my friend introduced the Vokraf website as online learning focused on the creative field. Through my experience and first impression of the Vokraf website, it made me interested in redesigning the Vokraf website as creative online learning.

I started doing research with Heuristic Evaluation, where I selected a page element that violated the 10 Usability Heuristics in User Interface Design. In this section, we only focus on evaluating the interface of the Vokraf. website

The analysis of violations of the Vokraf website heuristics can be seen below:

User Interview

At the user interview stage, I determine a very specific target audience. Here’s my research target audience and the reasons behind it:

• Students and Fresh Graduates

Students and fresh graduates are the audience who are in the transition to work. A student and fresh graduate need media (such as vokraf) to support their knowledge and skills in building their career path.

• Creative/art Enthusiast

Someone who has an interest in the creative and artistic fields will really need the media to support his skills.

At this stage, the researcher wants to understand:

• How is the user experience (pain point, wants, and think) when using online learning based on creative industries?
• How about we (how might we) add sneak-peak, review/feedback, and user project features to online learning?

Interview Key Finding

Quotes from user about Vokraf

“Gue baru tau ada Vokraf, itu modelnya online course atau boothcamp?”

“Gue kayaknya pernah denger, itu programnya pemerintah bukan?”

“Kurang tau, baru denger..”

Define

Competitive Analysis

As defined above, we can shortlist of competitors and we found that Skillshare, Domestic, and Udemy were the closest competitors.

Persona Building

Ideate

In the Ideation phase, I’ve made User Flow to make different between Existing Flow and New Proposed Flow

User Flow

Prototype

Like other products or websites, after the user flow, I make a low fidelity prototype for preparation and testing. I “prepared” the basic through the Low Fidelity prototype and i “polished” through the High Fidelity Prototype.

Lo-Fi Prototyping

This Sketch Include

• Landing Page
• Page in One of The classes
• Review Page
• Student Project Page/Participant Assignments

Hi-Fi Prototyping

Evaluate

Guerilla Testing

I did guerilla testing by randomly contacting 4 participants to test the website that I had created

I ask them to finish 3 tasks. And here is the Task Scenario:

1. Users need to register for the Commercial Illustration class and complete payment
2. Users need to review the Commercial Illustration class
3. Users need to upload the work to “Participant’s Task”

and..

4/4 Participants can finish the task!!

Survey

Another thing that can provide insight into the user experience is surveys. There were 5 questionnaires sent to participants to design the latest Vokraf website. Through the scores given starting from strongly agree and disagree. 4 Respondents gave a general 4/5 rating for website design and the latest features of the Vokraf website. For the Interesting user with the new website, 3 participant rate “Good” and 1 user Participant “Excellent”

What I’ve learn

Throughout several User Tests, trial and error, feedback, and peer-to-peer sessions, I’m very happy with the current location of the project.

Here are a few things I learned going forward:

Dare to try.

Through my first UX Design portfolio, I sometimes see doubts about trying different UX Research and UX Design methods. seeing my skills and also my limited understanding. But I dare to try new methods to implement ideas and insights for the participants. This courage will benefit me in the future

Pause and step away for a moment.

I always try to get this done at the appointed time. However, I often get caught up in the process. Doing it at a slower and more ideal pace will definitely benefit me in the future.

Try the Prototype

bit.ly/VokrafNewWebsite