Remote Worker Indonesia — UI/UX Case Study (Part 1)

Overview

Remote Worker Indonesia or usually abbreviated as RWID is an economic movement initiated by Eko Suprapto Wibowo and headquartered in Yogyakarta. The aim of establishing RWID is to create experts in the digital world who can work from anywhere and at any time. So, even though they work from remote villages in Indonesia, as long as they have decent internet, all members can have a relatively high income or even create benefits for the surrounding community.

RWID guides all its members to have digital skills such as UI UX Design, Frontend, Backend, Digital Marketing, up to Digital Creative and Social Media. Apart from that, RWID also provides guidance regarding personal branding to equip members for job hunting at the next stage. At the job hunting stage, RWID also guides their members to compete on job marketplace platforms such as Upwork to get jobs from all over the world. The jobs obtained are jobs that can be done remotely and are adapted to skills that have been previously learned. The income obtained is relatively high, both for work that is paid hourly and for work by projects that are paid at a fixed price.

Apart from that, RWID as a company operating in the field of economic movement also provides other benefits for members and the surrounding community by providing opportunities for its members to initiate the establishment of small bussiness in the digital and non-digital sectors for local communities that have potential, including providing money loans to members who need itu. All of these benefits are the circulation of money resulting from RWID membership registration fees, so that RWID is not just a bootcamp, but an economic movement that benefits all parties, starting from the owner, members, to the community outside RWID.

The Challenge

The challenge of this case study are:

1. Design an interactive web that facilitates non-member users to register and pay membership fees.
2. Increase the satisfaction of all members in the process of achieving their respective ultimate goals with RWID.

Design Thinking

Empathize — Stage 1

a. Observations
Observations were carried out by:

1. User interviews with RWID’s members who met the criteria as correspondents so that more varied observation data was obtained.
2. collecting all comments from RWID’s members which were submitted via RWID Community.
3. Observe the CEO’s direction regarding the product he hopes for.

b. Research Plan
Background
The owner had an idea to create a website that facilitates prospective members to register for membership and also facilitates the learning process of all members to achieve their respective ultimate goals through programs provided by RWID.

Apart from that, there have been many comments regarding RWID’s performance so far, ranging from comments regarding painpoints, goodpoints, to constructive Insights. These comments are not far from unclear information, limited teaching and learning processes, less than optimal mentoring, and even less structured group membership. Because of this, the I wanted to observe more deeply about some of these problems and apply them to a web design that was more satisfying website for all RWID members.

Objective

1. Find out why members joined RWID.
2. Find out members behavior in the process of using RWID facilities.
3. Find out the member’s ultimate goal by joining RWID.
4. Find out painpoints, goodpoints and insights regarding RWID.

Methodology

1. Conduct in-depth interviews with several RWID members who meet various criteria as correspondents, so that UX designers get varied observation data.
2. Collect several reviews from members regarding RWID performance which are submitted through the RWID Community.
3. Conduct research into several competitor products.

Sample Specifications

1. RWID members who have joined RWID for less than 3 months.
2. RWID members who have joined RWID for more than 3 months.
3. RWID members who have joined RWID for more than 1 year (before the SIM program).

Key Information Area

1. Profile of RWID’s member.
2. User behavior of members when using RWID facilities such as video learning.
3. Pain points and contructive insight from the members.

Discussion Guide

Conduct research

User Interview Sessions

Based on the results of in-depth interview analysis of users, who have met the requirements as correspondents, the owner’s explanation of the RWID development plan which was conveyed via the RWID internal YouTube channel and a collection of reviews from several users submitted via the RWID Community, the following data was obtained. :

1. The total data from observations is 154 data. 74% of this data, or 115 of it, are originating data from user observations. Meanwhile, the remainder (26%, 40 data) is the result of observations from the owner.

2. 115 data that obtained from user observations, it was further classified into several types of observation data, namely Good points, Pain Points, and Insight Points. From each type of observation data, the data is categorized into several more detailed categories.

3. The total of good points data from users amounts to 13 data or 11% of the total user observation data. Based on type, I grouped them into 6 categories, namely providing (23%), mentoring (23%), vision (23%), facilities (15%), management (8%), course materials (8 %).

Below are some sample data regarding each category of user’s good points:

Members
“New friends and good relationships from fellow RWID members”

Mentoring
“Social media and digital creative have good mentoring, the steps are clear, systematic.”

Vision
“Good RWID vision and mission, bootcamp as well as CSR”

Facilities
“Pay once for all courses, both courses that are already available to courses that will be available in the future. Limitless course”

Course Materials
“Personal branding is a differentiating value compared to other bootcamps.”

Management
“RWID economic system backed up by gold, good social movement. Inline with the values in it”

4. The total of pain points data from users amounts to 40 data or 35% of the total user observation data. Of the 40 data, based on type, I grouped them again into 6 categories, namely Information (23%), mentoring (23%), learning media (23%), personal obstacles (15%), course material (8%), group communication (8%).

Below are some sample data regarding each category of user’s pain points:

Information
“At the beginning I was confused because there was too much information given, without any clear direction”

Mentoring
“Mentors who don’t evaluate members enough. Mentors are the first faces to show what RWID really is.”

Learning Media
“Each member has a different pace. Confused about piling up assignments and missing out on material. Tired of working full time.”

Personal Obstacles
“Limited free time so there is not enough time to study”

Course Materials
“The material provided is not in depth, it is still on the surface”

Group Communication
“Too many groups”

5. The total insight points data from users amounts to 62 data or 54% of the total user observation data. Of the 62 data, based on the type of insight, I grouped them into 9 categories, namely Member Evaluation (21%), Facilities (3%), Features (5%), Group Member (20%), Information (16%), Management ( 3%), Course Materials (13%), Learning Media (11%), and Mentoring (8%).

Below are some sample data regarding each category of user’s Insight points:

Member Evaluation
“To focus and back-on-track rwid requires approaches such as Attendance, Assessment, Discussion and Evaluation”
“Evaluate or test every study session”

Facilities
“Competency certification (certificate of authenticity), the system is upgraded and not upgraded.”

Features
“comments column on each material video”

Group Members
“Create sub-classes based on participant abilities”
“Beginners are put into one class, learning can be directed”

Information
“Provides an overview of what you will get if you join RWID. Example of a learning video at the beginning. The resulting portfolio. Branding and job hunting process”
“Onboarding made leaner”

Management
“RWID needs better management, you can get it from RWID members themselves”

Course Materials
“Learning flow, curriculum needs to be improved and is crucial”
“given assignments that hone skills/tools that can later be used as a portfolio.”

Learning Media
“choice of material type delivery. namely Iive zoom, record zoom, video material, ebook”
“Instead it’s just long videos. So that the material can be broken down more and not too long.”

Mentoring
“Members who already have basic, guide members with 0 basic. Apart from helping mentors, it also helps participants (who become mini mentors) further mature the material they have just learned, and hopefully helps RWID get new talents in mentoring.”

6. If the categories for each type of user observation data (good points, pain points, insight points) are combined into one, then the following user observation data will be obtained:

Based on the table and chart data above, it can be seen that from the total of user observation data is 115 data, 11 categories were obtained consisting of Group Communication, Personal Obstacles, Information, Course materials, Media Learning, Mentoring, Member’s Evaluation, Facilities, Features, Management, and features.

Of the 11 categories, the Information issue is the issue that appears the most (20%), followed by Group Communication (16%), Mentoring (16%), Course Materials (11%), Member Evaluation (11%), Media Learning (10 %), and the rest have relatively less data.

An explanation of each main issue will be explained in more detail in the Identifying Problem Chapter.

Stage 2 — Define

User Personas

The first step taken after obtaining data from observation users is to create a user persona. User persona is a fictional character that represents the real condition of a user or in this case is RWID member. The user persona contains several data that are considered important to increase the UX designer’s empathy for designing a product. This data was obtained from the user observation process which was previously carried out by the UX designer. The data in question consists of:

• Status designation (Primary / secondary persona)
• Name persona
• photograph
• Quotations
• Short narrative describing the user
• Pain Points
• Goals
• Short biodata (age, job, status, location)

Based on the data obtained at the user observation stage, 2 user personas were obtained as follows:

Primary Persona

Secondary Persona

Red Routes

Based on the facilities that available at RWID, I created a red route which describes how often a facility is used by members and how often members use a facility.

The level of frequency of a RWID facility is placed on the Y axis. The further away from point 0, the more frequently the member uses the facility. Vice versa, the closer to point 0, the less often members use the facility.

Meanwhile, the level of the number of members using an RWID facility is placed on the X axis. The further away from point 0, the more members use the facility. Vice versa, the closer to point 0, the fewer members use the facility.

Based on the explanation above, the following are the results of the red routes analysis of the facilities available at RWID:

Based on the image above, it can be seen that RWID has 16 facilities available, ranging from Video Learning to NFC cards. After conducting a red route analysis of the 16 facilities, the following conclusions were obtained:

• The Video Learning facility is the facility most frequently and most widely used by RWID members, followed by 2 other facilities, namely Element or communication media between members, mentors, management, up to the RWID CEO, and the RWID hunting night facility.
• The NFC Card facility is the most rare and least used facility by RWID members, followed by the RWID waqf fund facility and RWID Initiate small bussiness

Identifying The Problem

Referring again to the user observation data, the following is a brief explanation of each issue that dominates the user observation results:

1. Information

Problems:
Regarding the type of user pain points data, several users complained because the information provided during onboarding was unclear and incomplete. RWID Management does not explain the technical steps for using each feature provided. For example, like the collection of zoom videos in Notion, according to users, the video sequence is confusing and there is no clear explanation regarding this. In fact, there are users who don’t know what steps they should take when first joining RWID.

Apart from that, a lot of WhatsApp groups and several links given to members personally by the RWID admin, increase the level of member confusion because they are not accompanied by clear directions.

Solution:
Providing information is carried out more effectively and efficiently both to non-member users and to users who have just joined as members.

Providing complete information to non-momber users to reduce disappointment due to the facilities provided not meeting their expectations. Here are several points that can be used as content for non-member users:

• Explains what steps the user must take to achieve their goals (fundamentals, personal branding, job hunting).
• Estimated time needed by the user to achieve his goals.
• Detailed curriculum for each course that available on RWID.
• Portfolio members from each course
• Short profile of mentors who fill each course that available at RWID.
• Brief explanation of the RWID Extravaganza (Waqf, affiliate, Initiate small bussiness)

Meanwhile, information for users who are already members is provided to increase their ease in accessing every facility that available at RWID. Here are several points that can be used as solutions:

• Providing brief onboarding regarding what facilities are available at RWID, starting from courses, elements (media for communication between members and management), English classes, to RWID Extravaganza (Waqf, Affiliate, and Initiate Small Bussiness)
• Providing short onboarding in each course provided by RWID which explains about fundamental learning up to job hunting session,
• Providing brief onboarding regarding group division in elements.
• Displays the announcement banner feature on each existing page.
• Notification feature on the web page that is integrated with email.

2. Group Communication

Problems:
a lot of WhatsApp Groups is also a pain point because new members feel confused when they are included in many of these groups without clear information.

Apart from that, one of the members also gave his opinion that RWID is not suitable for beginners because those who dominate the voices in the group are members who already have a lot of experiences and skills.

Solutions:
Providing effective and efficient communication media, one of which is not categorizing too many groups. For this reason, here are several solutions that can be applied to create better communication between members:

• Grouping groups based on course
• Each course is further grouped into several levels, namely fundamentals, personal branding, and job hunting.
• Special announcement group that can only be accessed by management or admin.

3. Mentoring

Problems:
In the pain points data type, several members complained because they felt abandoned after joining as members. So some members feel that the existing mentors are unable to guide them. One member thought that this could happen because of the lack of available mentors.

Solutions:
One of RWID’s member believes that a mentor is a reflection of the company that houses him. Because mentors are company representatives who most often come into contact with RWID users. The following are some insights regarding mentoring that can be applied by RWID:

• Hold zoom 1–2 times every week for sharing session.
• Zoom is held by every course available at RWID.
• Zoom is carried out to ask each member’s progress in studying the material provided in the video learning facility.
• Zoom can be held to do coding together (frontend backend course) or designing products together (UI UX design).

4. Member Evaluation

Problems:
Member evaluation issues are found in the user insight points data type. Several members proposed facilities or features that could be implemented in RWID to evaluate each member’s learning process. This is to facilitate mentors in the process of guiding members to achieve their goals. One of the facilities or features in question is attendance, assessment of assignments given and evaluation sessions between mentors and several members using zoom.

Solutions:
Based on the problems presented previously, here are several solutions that can be applied:

• Provide a tasks for each course session.
• On the profile page, there is a graph that shows how long it takes users to open or watch learning videos every single day.
• Pie chart that depicts the percentage of material course that has been studied by the user.
• Any existing data can be used by mentors to monitor RWID members.

5. Course Materials

Problems:
Based on user observation data, especially on the type of user pain points data, the material course provided by RWID was felt to be less in-depth and the curriculum taught was less coherent, so one member was of the opinion that the material provided did not match his initial expectations.

Several users also provided insight into the RWID learning flow that must be improved because this is the most crucial thing to help members achieve their respective goals.

Solutions:
Course’s material is one of the most crucial things. so here are several insight about it:

• Assume that every existing member is a beginner who does not have any experience regarding the course being taken
• Provides more in-depth fundamental material.
• The existing material is equipped with study cases and tasks that members can do independently.

6. Media Learning

Problems:
Based on user observation data which is included in the types of user pain points, several members think that the learning media used by RWID is considered less effective and efficient.

Members complain because the content produced is too long, especially when members take part in live zoom which is held every 2 weeks, each session is 1.5–2 hours. one of the members thought that this was not enough and that he could not achieve his learning targets. Because according to him, everyone has their own pace and learning targets.

Solutions:
Everyone has different learning styles and learning abilities. Here are several solutions that can facilitate all learning styles of each member:

• Using video learning media.
• Video learning is divided into several sessions that represent chapters in a course
• From each session, the existing learning videos are divided into several sub sessions, resulting in learning videos that have a duration of no more than 10 minutes.
• On the same page, a feature is also provided to download material displayed using article media.
• Also equipped with a Q&A feature for each sub session video.

Actionable Insights in Web Design

Information

for prospective members:
Create an all program page that specifically explains all the facilities and courses that available at RWID. The explanation is divided into the following components:

1. Component containing what benefits you get after becoming an RWID member.
2. All program component which contains cards from each available course. If the user clicks on one of these cards, the user will be directed to a special course page that explains the course they are interested in.

• In the course page, create a component that contains an explanation of the curriculum that prospective members will study, accompanied by a learning timeline.
• Nearest batch opening schedule component
• Component to view examples of learning videos from courses that are interested in.
• The card component contains the member’s portfolio.
• Card component that contains the mentor profile.

3. Last, create a component that explains RWID English Class and RWID Extravaganza.

For members:
Create a special page “For Members”. This page contains the following components:

1. Notification banner that displays important information such as the nearest zoom meeting schedule, zoom meet English class, latest portfolios from other members, competitions, etc.
2. Onboarding component for newly joined members. Contains video content and articles explaining the facilities available at RWID and tutorials on how to access them.
3. The all course component contains cards from each of the available course. The card contains an illustration, title, brief explanation of the course and a CTA button that directs members to the page of the course they are interested in.
4. Community component which will direct members to the Medium page (communication media between fellow members and RWID management)
5. English class component.
6. Extravaganza RWID component which contains content which explaining how members can access it.

Member Evaluation

Create a profile page that contains the following components:

1. Create a graph that shows the length of time a user opens a learning video each day. So that users can know their own behavior.
2. Create a pie chart that shows the percentage of learning videos that have been studied by the user.

Video Learning

Create video learning pages for each course that available on RWID. The following are the contents of the components on the video learning page:

1. The onboarding component of videos and articles containing a thorough explanation of what you will learn and do to become a remote worker.
2. The main components are divided into 4 tabs consisting of fundamentals, case study, personal branding, and job hunting.
3. Each tab contains the following components:

• Main learning videos
• Articles contain material which taught in video content.
• The right side bar contains a list of materials that make up each session
• At the bottom of the learning video there are several tabs containing Q&A, reviews from members, and announcement tabs from mentors or management.

Stage 3 — Ideate
At this ideation stage I created UI flow, Information Architecture, wireframe from RWID’s website.

UI Flow
UI Flow is the flow of a user’s journey from entering the RWID Web landing page to getting to the facility they want to go to.
The UI Flow on the RWID Web that I designed is divided into 2:

• First, UI flow for prospective members which explains how a prospective member flows from the landing page to the user registering and paying.
• Second, UI Flow for RWID members which explains how a member flows to access the learning videos provided by RWID and several other features.

The following is the UI Flow from Web RWID:

Information Architecture
Information Architecture shows the grouping of each facility available at RWID. These facilities are grouped into several pages which will make it easier for users to access certain facilities. The following is the Information Architecture of RWID’s web:

Wireframes

RWID wireframes are grouped into 2 based on their flow.

Wireframe 1
The first wireframe is designed for prospective RWID members who want to find out information about RWID as a whole. In this group, there are 7 pages starting from the landing page to the payment page. So that users can do research on RWID products until make payments in one website.

Wireframe 2
Based on research regarding RWID red routes, it can be seen that RWID has more than 10 facilities or features. Based on the red route analysis, it was concluded that video learning is the facility most frequently used by RWID members. So, this second group of wireframes is designed for RWID members who want to use the video learning facilities or features. In this group, there are 5 pages starting from the landing page to the course learning page, and also profile page which is intended for members to monitor their learning progress at RWID.

In the next part, I will write about the prototype and test phases of the RWID web design process. And at the end, I will show you a high fidelity prototype from Remote Worker Indonesia’s website.

Thank you for your time and attention to read. see ya!