7 steps to becoming a User Experience focused graphic designer

  • 3,289 views
Uploaded on

7 steps to becoming a User Experience focused graphic designer

7 steps to becoming a User Experience focused graphic designer

More in: Technology , Business
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
  • Great presentation... I've done a AIGA 101 talk to students and this has really great content.
    Are you sure you want to
    Your message goes here
No Downloads

Views

Total Views
3,289
On Slideshare
0
From Embeds
0
Number of Embeds
0

Actions

Shares
Downloads
226
Comments
1
Likes
9

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. HOW Interactive Conference7 steps to becoming a User Experience focused graphic designer11/02/11Prepared by Jose Caballer
  • 2. Jo se
  • 3. I am aweb designer
  • 4. Born Digital
  • 5. Razorfish 1996-2001 The Groop 2001 - Today
  • 6. Question:How many of you domainly print design?
  • 7. Question:How many of youdo only web?
  • 8. Question:How many of you doa little bit of both?
  • 9. How many of you have had achallenging web project, or achallenging experience doingcode, or interacting with aprogrammer, or settingexpectations with a client?
  • 10. 7 stepsto becoming aUser Experience focusedgraphic designer
  • 11. Step 1
  • 12. Step 1 Stop: Saying it’s about tech!
  • 13. I have been designing websites foralmost 15 years and I have yet to code a website for a client...
  • 14. But José,I am only one person in my studio?
  • 15. Step 2 Collaborate: It’s about groups
  • 16. 1. Inception 2. Execution 3. Launch 1. Database Layer 1. User Stories 2. Application Layer 2. Use Cases & Flows 3. Presentation Layer 1. Bug Fixes 3. Sitemap 4. Elements (CSS, 2. Analytics 4. Wireframes Javascript, Flash etc.) 3. Site Administration 5. Development Spec. 5. Hosting Setup 4. Multivariate Testing 6. Content Spec. 6. Q/A & Load Testing 5. Marketing 6. Partners Information Development Architecture (Front & Back) 7. Celebration User Product Definition Experience Launch & Iterate Identity & Visual Content Design 1. Template Design Creation1. Brand Definition 2. User Interface2. User Profiling 1. Copywriting 3. Front End Spec.3. Business Priorities 1. Stylescape 2. Imagery 1. Analysis 4. Design Application4. Competitive Audit 2. Identity System 3. Videography 2. Usage Patterns 5. User Testing5. Story 3. Typography 4. Animation 3. Demographic Detail 6. Product Revisions6. Messaging 4. Iconography 5. Editing 4. Feature Revision 7. Marketing Strategy7. Groop Brief 5. Color Palette 6. Rights Clearances 5. User Focus Groups 6. Style Guide 7. Content Loading 6. Release Planning 7. Performance
  • 17. “This whole ‘collaboration, we’llwork together as a team’... I findit f***ing difficult...”Advertising Creative, Dec 2010 Fast Company Article
  • 18. This is because “InteractiveDesign” requires Business,Creative, Tech and Marketingpeople to work together. Each withdifferent interests in a project.
  • 19. ROI
  • 20. RGB
  • 21. SQL
  • 22. USP
  • 23. Business Creative Tech Marketing ROI RGB USP SQL
  • 24. Step 3 Listen: It’s not about you
  • 25. Step 4 Don’t do “it”: Design “why”
  • 26. She clicks on the 2 “Campaigns” pulldown and finds Winnie The Pooh Sarah Talbott Legal Delay with Winnie the Pooh 1 Sarah, wanted to let you know that we are running into issues getting final legal approval on the Winnie the Pooh poster. We are going to be delayed by about two weeks.Sarah Talbott Best, ChrisManager33 year-oldFemale 1 Sarah arrived onNewly married Monday morning to Once on the CampaignResponsible for the day-to-day execution of find an email from legal detail page, she clicks oncampaign elements for her department. letting her know that “Edit Milestone” the Winnie the Pooh 3She needs help directing her work to highestpriority tasks and milestones, reducing trivialworkload, seeing where progress is being poster approval ismade in related activities and enablingvisibility to her peers and manager. getting delayed by 2Will adopt the IMM tool if it is easy and weeks. Nooooo! Online Ideation Online Creative Tier 1visually intuitive, will reject if it is complicated, OL Start Date: 00/00/12 Status: Approved Approvals: Asset Link: <internal link to DDS or AS>dense and overly data heavy. Due Date: 00/00/12 Priority: High 1 Filmmaker Verbal app’l in meeting. Notes: Duration: 6 months Studio Awaiting reply. Lorem ipsum dolor sit amet, consectetur adipisicing elit, Talent Email approval sed do eiusmod tempor incididunt ut labore et dolore Online Debut: 00/00/12 magna aliqua. Legal -- Create Checklist Edit Milestone Clone Milestone
  • 27. Your BrandYour Users’Goals Needs
  • 28. Who You Are
  • 29. User Needs
  • 30. Business Goals
  • 31. User Need Features & FunctionalityBusiness Goal 43
  • 32. She clicks on the 2 “Campaigns” pulldown and finds Winnie The Pooh Sarah Talbott Legal Delay with Winnie the Pooh 1 Sarah, wanted to let you know that we are running into issues getting final legal approval on the Winnie the Pooh poster. We are going to be delayed by about two weeks.Sarah Talbott Best, ChrisManager33 year-oldFemale 1 Sarah arrived onNewly married Monday morning to Once on the CampaignResponsible for the day-to-day execution of find an email from legal detail page, she clicks oncampaign elements for her department. letting her know that “Edit Milestone” the Winnie the Pooh 3She needs help directing her work to highestpriority tasks and milestones, reducing trivialworkload, seeing where progress is being poster approval ismade in related activities and enablingvisibility to her peers and manager. getting delayed by 2Will adopt the IMM tool if it is easy and weeks. Nooooo! Online Ideation Online Creative Tier 1visually intuitive, will reject if it is complicated, OL Start Date: 00/00/12 Status: Approved Approvals: Asset Link: <internal link to DDS or AS>dense and overly data heavy. Due Date: 00/00/12 Priority: High 1 Filmmaker Verbal app’l in meeting. Notes: Duration: 6 months Studio Awaiting reply. Lorem ipsum dolor sit amet, consectetur adipisicing elit, Talent Email approval sed do eiusmod tempor incididunt ut labore et dolore Online Debut: 00/00/12 magna aliqua. Legal -- Create Checklist Edit Milestone Clone Milestone
  • 33. 1. Inception 2. Execution 3. Launch 1. Database Layer 1. User Stories 2. Application Layer 2. Use Cases & Flows 3. Presentation Layer 1. Bug Fixes 3. Sitemap 4. Elements (CSS, 2. Analytics 4. Wireframes Javascript, Flash etc.) 3. Site Administration 5. Development Spec. 5. Hosting Setup 4. Multivariate Testing 6. Content Spec. 6. Q/A & Load Testing 5. Marketing 6. Partners Information Development Architecture (Front & Back) 7. Celebration User Product Definition Experience Launch & Iterate Identity & Visual Content Design 1. Template Design Creation1. Brand Definition 2. User Interface2. User Profiling 1. Copywriting 3. Front End Spec.3. Business Priorities 1. Stylescape 2. Imagery 1. Analysis 4. Design Application4. Competitive Audit 2. Identity System 3. Videography 2. Usage Patterns 5. User Testing5. Story 3. Typography 4. Animation 3. Demographic Detail 6. Product Revisions6. Messaging 4. Iconography 5. Editing 4. Feature Revision 7. Marketing Strategy7. Groop Brief 5. Color Palette 6. Rights Clearances 5. User Focus Groups 6. Style Guide 7. Content Loading 6. Release Planning 7. Performance
  • 34. Step 5 Be George Lucas: Tell Stories
  • 35. You are not are not a “GraphicDesigner” you are a moviedirector - you tell stories!
  • 36. Step 6 Face your fear: “Luke I am your father”
  • 37. YOU
  • 38. What type of designer are you? Evil evil Flakey flakey obnoxious Obnoxious Dorky dorky product control big ideas promoting ideas technical& consistency & openness & social & deep knowledge
  • 39. thegroop.net/blog
  • 40. Teamtreehouse.comLynda.compsd2html.comElance.comHOW Interactive Conf. 2012
  • 41. Step 7 Be(at) the 1%: Don’t work for change. Be change.
  • 42. “The last few decades have belonged to the computerprogrammers who could crank code, lawyers whocould craft contracts, MBAs who could crunchnumbers. But the keys to the kingdom are changinghands. The future belongs to creators, designers,storytellers, caregivers, big picture thinkers – willnow reap society’s richest rewards and share itsgreatest joys.”Daniel Pink, A Whole New Mind
  • 43. groopskool.net
  • 44. thisweekinwebdesign.com
  • 45. In Closing
  • 46. Production Designer: $35
  • 47. Visual Designer: $75Production Designer: $35
  • 48. User Experience Designer: $125Visual Designer: $75Production Designer: $35
  • 49. a big favor
  • 50. @josecaballerOn a scale of 1 to 10, 1 being “sucked”10 being “holy mother of god”...How did I do?What can I improve?
  • 51. Thank You