2. The product:
ARTutor is a responsive website designed on Adobe XD
which helps creatives find and view art tutorials.
Project overview
Project duration:
July 2021 – July 2021
3. The problem:
Lead UX Designer and UX Researcher
throughout the duration of the project.
Project overview
The goal:
• UX Researcher : develop qualitative and
quantitative research models; analysizing
data; emphathizing with users; defining
problems
• UX Designer : Understanding user needs;
ideation to solve user problems; design
prototyping; Testing.
4. My role:
Identify your role in the project - e.g., lead UX
designer, UX researcher, etc.
Project overview
Responsibilities:
List the responsibilities you had throughout
the project - e.g., user research, wireframing,
prototyping, etc.
6. User research: summary
In order design for the needs of the end user, I conducted interviews and generate empathy maps
in order to better understand the users. Through the research I identified a primary user group of
art creatives who have limited time to upskill themselves.
This user group was a close match to my assumptions of what ARTutor clients would be. The
research showed that, apart from time, prospective clients were limited by
________________________________________________ .
7. User research: pain points
Financial
Content appears to be
free but if actually
behind a paywall.
Many users have mobile
phone as their only
computer
Product
Great content is hard to
find without first having
to browse through it.
Novices struggle to
determine whether a
tutor is an expert
Process
Sorting through the
search results and
multiple blogs and
websites is time
consuming
Hard to organize
multiple learning
activities
Support
Questions on content on
many websites are not
asked or answered
1 2 3 4
8. Persona: Vago
Problem statement:
Vago is a novice in art
who needs mobile
friendly free tutorials
because he can only
find time to learn
during his commute
to work.
Vago
Age:
Education:
Hometown:
Family:
Occupation:
25
College Degree
Eldorado Park
Single
Botanist
“Life is a journey. We learn and
reinvent ourselves daily.”
Goals
● Explore new
interests
● Maximise every
dollar spent
● Stay on-the-go
Frustrations
● ”Free resources are
lifesavers but they
usually suck..”
● “This isn’t mobile
friendly…”
Vago is trying to switch careers after spending 4 years
studying botany and 2 years an intern, he now realizes that
his passion is art. He’s trying his best to make due with
free information on his phone during his one hour
commute to work but the quality is bad and can’t get help.
9. Persona: Vago
Goal: Seeks to learn about art on their smartphone
ACTION
Decide on learning
objective
Search for suitable
content online
Determine if content
meets expectations
Watch or read
tutorial
Bookmark, if not
completed
TASK LIST
Tasks
A. Explore styles or
techniques
B. Consider multimedia
format
Tasks
A. Try various search
keywords
B. Explore different
sites for content
C. Check if content is
behind paywall
Tasks
A. Scan content to
determine quality
B. Estimate length of
content
C.
Tasks
A. Play video or start
reading
B. Get headphones for
videos
C. Take notes
Tasks
A. Commit page
number, position or
record time
B. Save on digital or
paper notebook
FEELING ADJECTIVE
• Confused on what to
learn
• Curious on certain
subjects
• Frustrated by search
results
• Overwhelmed by
search results
• Anxious about
content
• Annoyed by poor
quality
• Relieved to find
suitable content
• Confused about
subject matter
• Worried about
marking position
• Concerned about
not missing exit
IMPROVEMENT
OPPORTUNITIES
Ø Centralized easy to
navigate index of
topics
Ø Create website to
find and viewart
tutorials
Ø Use filters to
remove unwanted
content
Ø Indicate free and
premium videos
Ø Add rating on
course
Ø Show estimated
length of content
Ø Ensure transcripts
and subtitles
available for videos
Ø Add note taking
option
Ø Automatically save
position
Ø Display in progress
courses
“As a busy professional, I want to be able to find and view
tutorials on my smartphone so that I can learn on my commute.”
10. User journey map
Image of user
journey map
With Vago’s user journey
map, I wanted to capture
the primary challenges of
busy mobile-first users
from the interviews
There’s lots of information
online, the challenge is now
finding and sorting through
the information
11. ● Paper wireframes
● Digital wireframes
● Low-fidelity prototype
● Usability studies
Starting
the design
12. Paper wireframes
Goal here was to quickly
ideate how browsing and
discovery can be made easy
for the user.
Components all ready for
adjusting to mobile and
tablet layouts.
Variation – A & B
Responsive Layouts
Variation – C & D
Variation – E & F