Dennis Lee UX Portfolio

Download Dennis Lee UX Portfolio

Post on 08-Aug-2015

459 views

Category:

Design

1 download

TRANSCRIPT

  1. 1. DENNIS LEE | UX PORTFOLIO Website // uxdennis.com Linkedin // linkedin.com/in/dennisyjleeEmail // djae9098@gmail.com
  2. 2. Discovering Dening Developing Delivering Here are my Specialties: PERSONA GENERATION CONTENT STRATEGY FEATURE IDEATION PROTOTYPING WIREFRAMING VISUAL DESIGN I love simple solutions that solve complex problems. I practice iterative UX design. That is heavily process driven. Hi Research Ideate Design Iterate Im an architecture trained UX/UI Designer.
  3. 3. CONTENT ARCHITECTURE // Healthcare Space RESPONSIVE WEBSITE // OKMYOUTFIT NATIVE APPLICATION // Strava WEBSITE // Kickstarter
  4. 4. 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 rst and branching out. PUBLIC SPACE VS. PRIVATE SPACE Design private reception and waiting space
  5. 5. RESEARCH IDEATE DESIGN ITERATE My nal design after many iterations is to construct an outpatient facility, where patients can choose their own path between private and public spaces. The second oor inpatient facility fosters semi public visual interaction between family, nurses, and patients. OUTPATIENT USER JOURNEY INPATIENT BLOCKS
  6. 6. Objective: Streamline onboarding user experience of signup and style prole forms. Before: OVERVIEW: Filling out style prole is a required long process that users skip or dont accurately ll out. Without an accurate style orole, stylists are unable provide an optimal experince on rst visits when stylists bring clothes for clients to try on. Client: OKMYOUTFIT offers monthly subscription to hold unlimited stylist appointments each month. Client: OKMYOUTFIT / 3 week project
  7. 7. 67% After: Redesign and optimize homepage, user journey, and style prole 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 ows and create user journeys 2. critical design decision of altering user ow, 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 suprisingly well together, as well as setting the project scope well with the clients. ABOUT YOU STYLE BODY PREFERENCES Result 90 page deliverable document : 1. Research Report 2. Planning Documentation 3. Design Process
  8. 8. I dont know why I have to select a color to avoid Shouldnt the stylist know what ts me. Jean t is very important to me. START COMPLETEMIDDLE User thought that a stylist should gure out this information User was very impressed that they asked about jean t User was opened to any color and couldnt make that selection I have to get started again? What?! This is long I like this COMPLETESTART MIDDLE User is confused by characterizing measurements by words and not number User likes being able to select brands she likes/shops at User is unhappy about the get started button at the end I would wear orange but not THAT orange Why is there a styling fee? I hate it when they make me do this kind of stuff See that makes more sense to me COMPLETESTART MIDDLE User is confused by the shades of colors represented User hates it when she has to pick a celebrity style User likes the looks page and the evening styles What?! User is confused by characterizing 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 20s to 40s busy business professional females who live in Manhattan Problem it solves: People have the money but dont have the time to shop and work on their style. Challenge: Every single user we tested disliked the process. We recorded and conducted 10 user testings to study the data and visual map users mood throughout the process. Moments where users are confused are areas where the user experience could be improved. We conducted heurestic evaluation of the existing brand and process of the creating a style prole to better understand the problem and goals of our stakeholders. IDEATE DESIGN ITERATERESEARCH Key Takeaway The style prole process is basically a report on ones own body which can be delicate esp. for females.
  9. 9. 54 2984Homepage HomepageHomepageQuestion Question Question Our team started research by looking at the competitors of OKMYOUTFIT that ask users for creation of a style prole. OKMYOUTFIT requires the most amount of steps to complete the prole. Key Takeaway :Both Stichx and Trunk Club have an order and categorization of questions, while OKMYOUTFIT jumps back and forth on topic of questions. RESEARCH IDEATE DESIGN ITERATE Competitive Anaylsis
  10. 10. Needs: Quickly fill out Style Profile Transparency of business Needs: Skip Questions/Style Profile Option 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 3 Interview / 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 ow made sense. Conducted design studios w/ team and clients to get everyones ideas on the table. Challenge: It was tricky to design placement of the new features. We tested early on paper and agreed to design below. Key Takeaways
  11. 11. Flaunting my arms? What are these sizes in relation to? I dont think anyone is just average Being condent doesnt mean I wont hide it Original Design 1 2 3 Copy was confusing and made people feel uneasy. Questions were too abstract and didnt allow users to accurately answer. Question made users feel negative and angry. Combined two questions so that both 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 condent in to focus on positivity. This is too abstract RESEARCH IDEATE DESIGN ITERATE Key Takeaway: Sharing info about ones own body is very personal and shouldnt be a personal report.
  12. 12. 40 84steps Dennis played an integral role and was instrumental in making the critical design decisions after ndings. I highly recommend him for your UX project needs. Diana, Co-founder OKMYOUTFIT Recommendation: ? A B C ? A B C SignUp SignUp Answer Questions Answer Questions Create Style Prole Create Style Prole 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 Client that consisted of: a. Research Report b. Design Changes / User Testing c. Planning Documentation - Our team acted as consultants making only recommendations - However, clients decided to use our design for the homepage and style prole forms, including icons and user journey Mockups for Mobile See the Prototype
  13. 13. Objective: How can we motivate users to track/record their tness 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 / tness, 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 tness MMO-like game. Strava / 2 week student project Challenges Record Goals AnalyzeCompete
  14. 14. Disclaimer : Student Project Create engaging form of completing challenges / meeting goals, and give more options to create goals Optimize user ow for better experience SOLUTION 1. I lead research and design outlining project timeline and scope 2. Designed all Hi-delity 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 team to see fresh ideas thru development.
  15. 15. Yes 58.3% No 41.7% 1 2 Personal Goals Weight loss Rewards/Achievements What Motivates you to track/record? I Dont Track Competition Bragging Rights Personal Goals Weight loss Rewards/Achievements I Dont Track Competition Bragging Rights If you dont track/record, What would motivate you to track/record? Do you track/record your tness 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 : SELECT FRIENDS 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 DATE INPUT 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 ON PLAN MY PLAN SCREEN WITH OPTIONS TO SET GOALS USER TAPS ON DONE BUTTON USER TAPS ON SET GOAL MY GOALS SCREEN OPTIONS TO CHOOSE DIFFERENT TYPES OF A GOAL COME UP NEW 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 GOAL RECORD SCREEN USER TAPS ON GOALS 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 tness activity. I learned to not assume anything before conducting the user research. Researched competitor tness tracking native apps and took note of their user ows 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
  16. 16. Sally | The Socialite Fiona | The Enthusiast Ted | The Tracker I love kicking my friends butts Feature Needed: Create Group Goal I tend to get crazy if I dont work out Feature Needed: Create Personal Goal I want to feel a sense of accomplisment Feature Needed: Reward system Persona / User Scenario STRAVA GOALS FEATURE : 1. CREATE/JOIN GROUPS WITH FRIENDS THAT SHARE SAME GOALS 2. 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 t. RESEARCH IDEATE DESIGN ITERATE Challenge: We had limited time to build out all the ows 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 Sallys record in their group, Fiona sends notication to Sally. Sally sees the message and is motivated to get off the couch and go run / track activity. MVP
  17. 17. RESEARCH IDEATE DESIGN ITERATE DESIGN TESTING 1 2 3 4 Sketch / Low FidelityExisting App Medium Fidelity High Fidelity People didnt 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 conrm button that pops out after setting goal and its name. People wanted the app to be transparent in its objective and location at any given point thru the user ow. Iterating early from a sketching phase to hi delity, allowed my group to test early on ow, placement, and icons. See the Prototype NEXT STEPS
  18. 18. Objective: Introduce alternate recurring payment user ows to an existing system. Disclaimer : Student Project Before: Kickstarter / 2 week student project Categories with most launched projects: 1. Film & Video 2. Music 3. Publishing Categories with most money pledged: 1. Tech 2. Design 3. 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.
  19. 19. $$ $$ $$ DISCOVERY DISCOVERY DISCOVERY MAKE PLEDGE MAKE MONTHLY PLEDGE MAKE MONTHLY PLEDGE PROJECT MONTHLY PAYMENTS MONTHLY PLEDGE PAYMENT ONE TIME PAYMENT STAGE 1 MONTHLY PLEDGE STAGE 2 STAGE 3 EMAIL NOTIFICATION(S) PAYMENT / EMAIL NOTIFICATION(S) PAYMENT / EMAIL NOTIFICATION(S) UNTIL CANCELLATION RECIEVE REWARD GUARANTEED REWARD REWARDS FROM 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 types that allow creators who want to release small content regularly and creators creating big project to not fail. Redesign project pages for a greater emphasis on creators / people on kickstarter SOLUTION 1. conducted research to study eyetracking and depictions of faces 3. Lead design studio and designed wireframes My Role: UX Designer / Visual Designer Main Contributions My Team: Carly Bruce / Dennis Lee / Evelyn Kim Lessons: Our group had a lot of great design ideas from research that werent 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
  20. 20. 67% Facebook CROWDFUNDING USAGE PROJECT DISCOVERY KickStarter GoFundMe Word of mouth Indiegogo Actual Site Twitter Crowdfunder Patreon 7% 87%Have used these sites Have used these sites Discovered projects through friends & family 65% 11% AGE GROUPS AGES 19-29 43% AGES 29-39 57% 60People 67% 47% 44% 25% 33% 13% 9% KickstarterKey takeaway: Other sites allow for exible/more options for creators Patreon 21 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 discovering projects through other people around them. Most peope use facebook as barrier of entry into Kickstarter. People are attracted to look at depictions of faces 1 2
  21. 21. Low Fidelity Medium Fidelity High Fidelity Design// Creator Screen Interview / Personas RESEARCH IDEATE ITERATEDESIGN ITERATE Key Takeway: -Our interviews further proved backers want to fund creators they know or their friends/family have backed. Esp. for recurring payments. - Creators need a platform to put out different size of content (small, big) I conducted design studio after my team sketched ideas individually. We were able to easily agree on a low delity design. We digitized the version to be tested in our paper / digital prototypes. Main Creator Persona Main Backer Persona In out nal version, we added more context on the creator after testing. RICEPIRATE youtube Creator Interview 1 2 See the Prototype
  22. 22. Thanks! Website // uxdennis.com Linkedin // linkedin.com/in/dennisyjleeEmail // djae9098@gmail.com