Project: End-to-End App Design
Role: UX Designer | UX Researcher
Time: 160 hours
Dream Colors is a learn-to-paint, mobile-first website that uses social interaction, real people in both live and pre-recorded lessons, and a smidgeon of gamification to help novice and intermediate painters learn to better their craft.
How do you learn to paint if you are stuck at home during the Pandemic, live in rural America, or just want to learn in the comfort of your own home?
People want to learn basic painting skills without having to take an expensive course at the local art school or doom scroll through “watch me paint” videos on YouTube. The market for online art classes is growing, especially post-pandemic, but many of the current offerings online are a part of a larger art school or a skills course hub like Udemy, which can feel less specialized or intimidating.
I wanted to explore ways to help people who want to become better painters, from beginners to more seasoned artists, to have easy and quick access to online painting mentors because geography and lack of brick and mortar availability can prevent people from getting any personalized feedback on their work and therefore stunt their artistic growth. In addition, I wanted to explore ways to enable budding artists to take a live online painting class and socially connect with other students and instructors because learning to paint on your own can be lonely, and social connections and feedback build confidence and loyalty to the brand.
Armed with this idea, I rolled up my sleeves and put on my researcher hat.
Research Goal: Discover which aspects of learning a painting skill people value so that I understand the artistic needs and desires of the customer base.
Objectives:
Determine which aspects of painting users are interested in learning.
Determine the length of instruction that is preferable to the user
Understand why learning painting as a new skill is important to users.
Determine if the mobile first website would be used individually or with a group.
User Interviews
User interviews were very revealing. Initially, I thought about having a Paint & Sip component to the website, thinking of the popularity of our local paint & sip venues, but research later revealed that was less of a desire for my participants, and instead they wanted gamification (like Duolingo) and social networking.
Affinity mapping trends
Setting - Combination of learning alone and with a group
Social Aspects - Prefer there be an option to connect with other users
Device Preference - Ipad and then laptop for versatility in location and size of screen
Accessible Content - Content provided in different methods and easy to digest (not intimidating)
Personas
Key Findings
Value: Across the board the interviewees noted that if they felt they were learning and getting “value” from the site, they would keep coming back.
Varied Options: All interviewees noted that they would like both live and recorded components.
Loyalty: Having snippets as well as longer pre-recorded videos and additional live classes and/or events as value-added, would keep them coming back to the site and even pay a small membership fee for additional access.
After concluding the interviews, I created two composite personas that exemplified my users.
Project Goals
Research Questions:
What role does learning to paint play in people’s lives?
What role does paint and sip play in people’s lives?
When and how would people use the service?
Why would people use our service and not another?
Competitive Analysis revealed that existing websites offered:
A variety of courses
Individual lessons
Single personality (only one instructor for the entire site)
Selling art supplies/kits
Armed with these new insights and user personas to design for, I developed project goals, keeping in mind that the website was to be a profitable business.
Information Architecture
In the beginning stages of the design process, I revisited my users and had them perform a card sort to help me design the sitemap. As a visual person with a web design background, designing the physical sitemap in Figma was essential.
How would users move through this sitemap?
I created three user flows that focused on the business goals for the website:
Login/Sign-Up (create loyalty)
Purchase a membership (revenue)
Purchase a course (revenue)
Low Fidelity Wireframes
From the user flows, I mapped out three task flows that would be the backbone of the wireframing:
Account Creation
Membership Purchase
Course Purchase
With the low-fidelity wireframes created, I turned my attention to the branding of the site before moving into mid and high-fidelity wireframing.
Focus
Minimalistic and simple design
Clean and light with pops of color
Colors derived from user input with purple and pink conveying brand values
The colors evoke a sense of dreaminess and esoteric creativity with a blank canvas background
The visual concept and logo for the website is derived from a Van Gogh quote: “I dream my painting and I paint my dream.” The colors and designs evoke dreams with shades of purple, pink, and gray. The logo itself is a cloud, and the icons are all designed to inspire the user’s inner artist.
Core Values
Connection
Dreaming
Inspiring
Learning
Nurturing
These visual design choices create a sense of welcoming for the budding or intermediate artist looking to find community and empowered learning in a supportive environment of like-minded artists. My ideal persona would feel comfortable moving about the visual design.
Usability Research
Testing the usability of the prototype, I went back to my initial pool of users and added some new ones to the pool as well. Overall, the design flowed well. A simplified UI helped users navigate easily and confidently, completing tasks quickly. There were only a couple of issues I needed to address.
Dropdowns: Users asked that there be dropdown options added to the weeks in course view
Misplaced Link: Purchase membership link on the sign-up screen caused confusion
Prioritizations
Remove the membership link on the sign-up page
Add dropdown carrots for each week listed in the course view page.
The full concept of this prototype is not conveyed in this prototype. Further work on this project would explore user and task flows around scheduling mentor sessions, connecting with friends, and the gamification of earning points through watching videos and taking courses that could be used toward the virtual art shop to buy gifts for friends and build up a badge case.