uxportfolio
Post on 15-Aug-2015
198 Views
Preview:
TRANSCRIPT
DENNIS LEE | UX PORTFOLIO
Website // uxdennis.com Linkedin // linkedin.com/in/dennisyjleeEmail // djae9098@gmail.com
DiscoveringDefining
DevelopingDelivering
Here are my Specialties:
PERSONA GENERATIONCONTENT STRATEGYFEATURE IDEATION
PROTOTYPINGWIREFRAMINGVISUAL DESIGN
I love simple solutions that solve complex problems.
I practice iterative UX design.
That is heavily process driven.
HiResearch
Ideate
Design
Iterate
I’m an architecture trained UX/UI Designer.
CONTENT
ARCHITECTURE // Healthcare Space
RESPONSIVE WEBSITE // OKMYOUTFIT
NATIVE APPLICATION // Strava
WEBSITE // Kickstarter
RESEARCH IDEATE DESIGN ITERATE
After visiting various healthcare facilities ranging from hospitals, STD clinics, nursery homes, college health clinics and talking to stakeholders, nurses, and paitents, my greatest takeaway was that disease/illness can be a very personal subject that patients might not want to share. From my research, my design process was very user-centric designing for the patient room first and branching out.
PUBLIC SPACE VS. PRIVATE SPACE
Design private receptionand waiting space
RESEARCH IDEATE DESIGN ITERATE
My final design after many iterations is to construct an outpatient facility, where patients can choose their own path between privateand public spaces.
The second floor inpatientfacility fosters semi publicvisual interaction betweenfamily, nurses, and patients.
OUTPATIENT USER JOURNEY
INPATIENT BLOCKS
Objective: Streamline onboarding user experience of signup and style profile forms.
Before:
OVERVIEW:Filling out style profile is a required long process that users skip or don’t accurately fill out. Without an accurate style orofile, stylists are unable provide an optimal experince on first visits when stylists bring clothes for clients to try on.
Client: OKMYOUTFIT offers monthly subscription to hold unlimited stylistappointments each month.
Client: OKMYOUTFIT / 3 week project
67% 67%
After:
Redesign and optimize homepage, user journey, and
style profile forms.
Design navigational bar within form process so users always know
what part of the process they are in.
1. leading research to study competitive flows and create user journeys
2. critical design decision of altering user flow, and changing the questions copy
3. Wireframing and Visual Design
My Role:UX Designer / Consultant / Visual Designer
Main Contributions SOLUTION
My Team:Angelique Belizaire / Chuck Flores / Dennis Lee
Client: OKMYOUTFIT / 3 week project
Lessons: Our team worked suprisinglywell together, as well as setting the project scope well with the clients.
ABOUT YOU STYLE BODY PREFERENCES
Result
90 page deliverable document :1. Research Report2. Planning Documentation3. Design Process
“I don’t know why I have to select a color to avoid”
“Shouldn’t the stylist know what fits me.”
“Jean fit is very important to me.”
START COMPLETEMIDDLE
User thought that a stylist should figure out this information
User was very impressed that they asked about jean fit
User was opened to any color and couldn’t make that selection
“
I have to getstarted again?”
“What?!”This is long…”
“I like this”
COMPLETESTART MIDDLE
User is confused bycharacterizing measurements by words and not number
User likes being ableto select brands she likes/shops at
User is unhappy about the “get started” button at the end
“
“I would wear orangebut not THAT orange”
“Why is there astyling fee?”
“I hate it when they make me do thiskind of stuff”
“See that makes moresense to me”
COMPLETESTART MIDDLE
User is confused by the shades of colors represented
User hates it whenshe has to pick acelebrity style
User likes the looks page and the evening styles
“What?!”
User is confused bycharacterizing measurements by words and not number
Area of OpportunityUser Journey // Existing Forms
Brand Analysis
KPI: Sales Conversions, Increase signups, Improve Stylist Efficiency
Target Audience: mid 20’s to 40’s busy business professional females
who live in Manhattan
Problem it solves: People have the money but don’t have the time to
shop and work on their style.
Challenge: Every single user we tested dislikedthe process. We recorded and conducted 10 user testings to study the data and visual map user’s mood throughout the process.
Moments where users are confused are areas wherethe user experience could be improved.
We conducted heurestic evaluation of the existing brand and process of the creating a style profile to better understand the problem and goals of our stakeholders.
IDEATE DESIGN ITERATERESEARCH
Key TakeawayThe style profile process is basically a report on one’s own body which can be delicate esp. for females.
54 2984Homepage HomepageHomepageQuestion Question Question
Our team started research by looking at the competitors of OKMYOUTFIT that ask users for creation of a style profile. OKMYOUTFIT requires the most amount of steps to complete the profile.
Key Takeaway :Both Stichfix and Trunk Club have an orderand categorization of questions, while OKMYOUTFIT
jumps back and forth on topic of questions.
RESEARCH IDEATE DESIGN ITERATE
Competitive Anaylsis
Needs:Quickly fill out Style ProfileTransparency of business
Needs:Skip Questions/Style ProfileOption to first meet stylist
- Clients want stylists to understand their personality- Stylists need to know how clients what to be percieved by others
Nav Bar
Question #
Skip
RESEARCH IDEATE DESIGN ITERATE
1 2 3Interview / Persona Design Studio Card Sorting / Testing
We asked users to card sort the questions into category names they created. We then tested
the results so the flow made sense.
Conducted design studios w/ team and clientsto get everyone’s ideas on the table.
Challenge: It was tricky to design placementof the new features. We tested early on
paper and agreed to design below.
Key Takeaways
“Flaunting my arms?”
What are these sizes in relation to?
“I don’t think anyoneis just average”
“Being confident doesn’t mean I won’t hide it”
OriginalDesign
1 2 3Copy was confusing and made people feel uneasy.
Questions were too abstract and didn’t allow users to accurately answer.
Question made users feel negative and angry.
Combined two questions so thatboth body type and proportion ratio info can be gained.
We changed the copy, but users found the question irrelevant.
We ask only what users are confident in to focus on positivity.
“This is too abstract”
RESEARCH IDEATE DESIGN ITERATE
Key Takeaway: Sharing info about one’s own body is very personal and shouldn’t be a personal report.
4084steps
“Dennis played an integral role and was instrumental in making the critical design decisions after findings. I highly recommend him for your UX project needs.”
Diana, Co-founderOKMYOUTFIT
Recommendation:
?A B C
?A B C
SignUp
SignUp
Answer Questions
Answer Questions
Create Style Profile
Create Style Profile
Select Closet Audit
Select Closet Audit
Select Personal Shopping
Select Personal Shopping
Select Date
Select Date
Select Date
Select Date
Proposed
Existing
User Journey
Before:
After:
Results:- Created 90 page document for Clientthat consisted of:
a. Research Reportb. Design Changes / User Testingc. Planning Documentation
- Our team acted as consultantsmaking only recommendations
- However, clients decided to use our designfor the homepage and style profile forms,including icons and user journey
Mockups for Mobile
See the Prototype
Objective: How can we motivate users to track/record their fitness activity.
Before:
OVERVIEW: For this project, our team was given the task to come up with our own project proposal / problem to solve. With the increasing prevalence of wearables and my general interest in health / fitness, our group chose Strava as our brand / client. Strava is a running/biking tracking native app and site that is known for its competitive nature. Each trail/street is divided into “segments” where users can compete against each other. The result is an highly competitive fitness MMO-like game.
Strava / 2 week student project
Challenges Record Goals
AnalyzeCompete
Disclaimer : Student Project
Create engaging form ofcompleting challenges / meeting goals, and give more options to create goals
Optimize user flow for betterexperience
SOLUTION
1. I lead research and design outliningproject timeline and scope
2. Designed all Hi-fidelity screens and created prototype
My Role:Lead UX Designer / Project Manager
My Team:Bogey Zebzda / Dennis Lee / Sandeep Sarda
Main Contributions
“Dennis did great job taking this project as our leader and making sure we stay on top of it.”
After:
Main Contributions
Strava / 2 week student project
- Bogey Zebzda
Lessons: The leader cannot do all, and design should be broken up among teamto see fresh ideas thru development.
Yes 58.3%No 41.7%
1
2
Personal GoalsWeight loss
Rewards/Achievements What Motivates you to track/record?
I Don’t Track
CompetitionBragging Rights
Personal GoalsWeight loss
Rewards/Achievements
I Don’t Track
CompetitionBragging Rights
If you don’t track/record, What would motivate you to track/record?
Do you track/record your fitness activity?
No [20]
Yes [28]
Key takeaway: Creating a goal is a paid premium feature in Strava,
while all competitors are free.
CHELLENGE SETUP
SCREEN
USER TAPS ON : SELECTFRIENDS
USER CHOOSES NEW CHALLENGE
NAME
USER TAPS ON CHALLENGES
NIKE + CHALLENGES
SCREEN
USER TAPS ON BUTTON:
START A NEW CHALLENGE
BEGIN TO RUN SCREEN
USER TAPS ON HAMBURGER
MENU
SIDE MENU SCREEN
USER CHOOSES DISTANCE & DURATION
USER TAPS ON : SEND INVITE
CONFIRMATION PAGE
JOIN A RACE SCREEN
USER TAPS ON APPROPRIATE
DATEINPUT DATE
USER TAPS ON RACE DAY
USER TAPS ON SET MY OWN GOAL
SET A NEW GOAL: - LONGEST DISTANCE - LOSE WEIGHT - FINISH RACE - TOTAL DISTANCE
USER TAPS ON FINISH RACE
HOME SCREEN /MAP SCREEN
USER TAPS ONPLAN
MY PLAN SCREEN
WITH OPTIONS TO SET GOALS
USER TAPS ON DONEBUTTON
USER TAPS ON SET GOAL
MY GOALS SCREEN
OPTIONS TO CHOOSE DIFFERENT TYPES
OF A GOAL COME UPNEW GOAL ADDED
USER TAPS ON CONFIRMATION
USER RECIVES CONFIRMATION
OF A CHOICE
USER PICKS A GOAL
USER TAPS ON + SIGN TO ADD
A GOAL
PERSONAL GOALS PAGE
SCREEN
USER TAPS ON ICON:
CHOOSE GOALRECORD SCREEN USER TAPS ONGOALS
GOALS SCREEN
Survey Data
Competitive Analysis Feature Comparison
48 people
58%
56%Key Takeaway: # 1 Motivating Factor is Personal Goals
Challenge: It was hard to pivot from our original problem, which was to how to provide relevant and approriate rewards for tracking
fitness activity. I learned to not assume anything before conducting the user research.
Researched competitor fitness tracking nativeapps and took note of their user flows for creating
a goal feature.
If you do track / record, do you share your data / statistics?
Sometimes [11]
Yes [2]
No [25]
Yes 5.3%No 65.8%Sometimes 28.9%
IDEATE DESIGN ITERATERESEARCH
Sally | The Socialite Fiona | The Enthusiast Ted | The Tracker“I love kicking my
friends’ butts”Feature Needed:
Create Group Goal
“I tend to get crazyif I don’t work out”
Feature Needed: Create Personal Goal
“I want to feel a senseof accomplisment”
Feature Needed: Reward system
Persona / User Scenario
STRAVA GOALS FEATURE :1. CREATE/JOIN GROUPS WITH FRIENDS THAT SHARE SAME GOALS2. CREATE CUSTOMIZABLE PERSONAL GOALS (FREE!)3. REWARD USAGE OF APP/LEVELING SYSTEM
Appmap helped visualize the content of app and allowed us to carefully choose where our designed features would fit.
RESEARCH IDEATE DESIGN ITERATE
Challenge: We had limited time to build out all the flows for each feature, so we conducted an open survey & closed card sort asking people to
vote. I learned an open survey could get bad data since users can be swayed by seeing others’ votes.
Icon Design by me
Feature Ideation
1
2
User Scenario: Sally creates a group goal and adds Fiona to run off 3000 calories by this week. When Fiona beats Sally’s record in their group, Fiona sends notification to Sally. Sally sees the message and is motivated to get off the couch and go run / track activity.
MVP
RESEARCH IDEATE DESIGN ITERATE
DESIGN
TESTING
1 2 3 4
Sketch / Low FidelityExisting App Medium Fidelity High Fidelity
People didn’t know the dials were call-to-actions (buttons)
People were lost whether they were creating a group or personal goal.
People were suprised by the confirm button that pops out after setting goal and its name.
People wanted the appto be transparent inits objective and locationat any given pointthru the user flow.
Iterating early from asketching phase to hifidelity, allowed my group to test early onflow, placement, andicons.
See the Prototype
NEXT STEPS…
Objective: Introduce alternate recurring payment user flows to an existing system.
Disclaimer : Student Project
Before: Kickstarter / 2 week student project
Categories with most launched projects:1. Film & Video2. Music3. Publishing
Categories with most money pledged:1. Tech 2. Design3. Games
37.86% projects are successful (ALL categories)
Tech. has lowest success rate: 21 %
OVERVIEW: Our team was tasked to design a recurring payment system for Kickstarter. The existing model consists of only one-time backing/payment for a period of time up to 2 months. The solution I came to and research above was done on my own after groupwork ended.
$$
$$
$$
DISCOVERY
DISCOVERY
DISCOVERY
MAKE PLEDGE
MAKE MONTHLY PLEDGE
MAKE MONTHLY PLEDGE
PROJECTMONTHLYPAYMENTS
MONTHLY PLEDGE
PAYMENT
ONE TIMEPAYMENT
STAGE 1
MONTHLYPLEDGE
STAGE 2
STAGE 3
EMAIL NOTIFICATION(S)
PAYMENT / EMAIL NOTIFICATION(S)
PAYMENT / EMAIL NOTIFICATION(S)
…UNTILCANCELLATION
RECIEVE REWARD
GUARANTEEDREWARD
REWARDSFROM CREATOR
$ $
$ $
$ $$ $
$ $$ $
$ $$ $
$ $$ $
$ $$ $
PROJECT LAUNCH
K Back Big Project
K Back This Creator
K Back This Project
Categories: Games / Technology / Design
Categoies: Existing Categories Time Frame: up to 2 months
Time Frame: up to 2 years
Time Frame: UnlimitedCategories: Film & Video / Music / Publishing
Design two additional payment typesthat allow creators who want to release“small” content regularly and creators
creating “big” project to not fail.
Redesign project pages for agreater emphasis on creators /
people on kickstarter
SOLUTION
1. conducted research to study eyetrackingand depictions of faces
3. Lead design studio and designedwireframes
My Role:UX Designer / Visual Designer
Main Contributions
My Team:Carly Bruce / Dennis Lee / Evelyn Kim
Lessons: Our group had a lot of greatdesign ideas from research that weren’t necessarily directly tied to the objective.
We could have been more focused on the MVP knowing the time frame of the project.
After: Kickstarter / 2 week student project
User Journey
67%
CROWDFUNDING USAGE
PROJECT DISCOVERY
KickStarter
GoFundMe
Word of mouth
Indiegogo
Actual Site
Crowdfunder
Patreon
87% 87%Have usedthese sites
Have usedthese sites
Discovered projectsthrough friends &
family
65%11%
AGE GROUPSAGES 19-29
43%AGES 29-39
57%
60People
67%47%
44%
25%
33%13%9%
KickstarterKey takeaway: Other sites allow for flexible/more options for creators Patreon21 Faces0 FacesEye tracking study
National Center for Biotechnology Information
SURVEY DATA
Competitive Analysis
DESIGN ITERATERESEARCH IDEATE
Challenge: It was difficult to convince my team of the value of eye tracking research and how I wanted to focus our design on the people
of kickstarter : creators and backers.
Key Takeway: People are discoveringprojects through other people around them.
Most peope use facebook as barrier ofentry into Kickstarter.
People are attracted to look at depictions of faces
1
2
Low Fidelity Medium Fidelity High Fidelity
Design // Creator Screen
Interview / PersonasRESEARCH IDEATE ITERATEDESIGN ITERATE
Key Takeway: -Our interviews further proved backers want tofund creators they know or their friends/familyhave backed. Esp. for recurring payments.- Creators need a platform to put out different sizeof content (small, big)
I conducted design studio after my teamsketched ideas individually. We were able
to easily agree on a low fidelity design. We digitized the version to be tested in
our paper / digital prototypes.
Main Creator Persona
Main Backer Persona
In out final version, we added morecontext on the creator after testing.
RICEPIRATEyoutube
Creator Interview
1
2
See the Prototype
top related