Date post: | 27-Jan-2015 |
Category: |
Technology |
Upload: | thegroop |
View: | 117 times |
Download: | 3 times |
HOW Interactive Conference 7 steps to becoming a User Experience focused graphic designer
11/02/11
Prepared by Jose Caballer
Jose
I am a web designer
Born Digital
Razorfish 1996-2001 The Groop 2001 - Today
Question: How many of you do mainly print design?
Question: How many of you do only web?
Question: How many of you do a little bit of both?
How many of you have had a challenging web project, or a challenging experience doing code, or interacting with a programmer, or setting expectations with a client?
7 steps to becoming a User Experience focused graphic designer
Step 1
Stop: Saying it’s about
tech!
Step 1
I have been designing websites for almost 15 years and I have yet to code
a website for a client...
But José, I am only one person in my studio?
Collaborate: It’s about groups
Step 2
1. Inception 2. Execution 3. Launch
Product Definition
1. Brand Definition2. User Profiling3. Business Priorities 4. Competitive Audit5. Story6. Messaging7. Groop Brief
1. User Stories2. Use Cases & Flows3. Sitemap4. Wireframes5. Development Spec.6. Content Spec.
1. Database Layer2. Application Layer3. Presentation Layer4. Elements (CSS, Javascript, Flash etc.)5. Hosting Setup6. Q/A & Load Testing
1. Bug Fixes2. Analytics3. Site Administration4. Multivariate Testing5. Marketing6. Partners7. Celebration
1. Analysis2. Usage Patterns3. Demographic Detail4. Feature Revision5. User Focus Groups6. Release Planning7. Performance
1. Stylescape2. Identity System3. Typography4. Iconography5. Color Palette6. Style Guide
1. Copywriting2. Imagery3. Videography4. Animation5. Editing6. Rights Clearances7. Content Loading
1. Template Design2. User Interface3. Front End Spec.4. Design Application5. User Testing6. Product Revisions7. Marketing Strategy
Information Architecture
Identity & Visual Design
User Experience
Development (Front & Back)
Content Creation
Launch & Iterate
“This whole ‘collaboration, we’ll work together as a team’... I find it f***ing difficult...” Advertising Creative, Dec 2010 Fast Company Article
This is because “Interactive Design” requires Business, Creative, Tech and Marketing people to work together. Each with different interests in a project.
ROI
RGB
SQL
USP
Business Creative Tech Marketing
ROI RGB USP
SQL
Listen: It’s not about you
Step 3
Don’t do “it”: Design “why”
Step 4
1
Sarah Talbott Manager
33 year-oldFemale Newly married
Responsible for the day-to-day execution of campaign elements for her department.
She needs help directing her work to highest priority tasks and milestones, reducing trivial workload, seeing where progress is being made in related activities and enabling visibility to her peers and manager.
Will adopt the IMM tool if it is easy and visually intuitive, will reject if it is complicated, dense and overly data heavy.
Watch Milestone
Online Ideation
Create Checklist
Start Date: 00/00/12 Approvals: Asset Link:
Filmmaker Verbal app’l in meeting.Due Date: 00/00/12
Online Debut: 00/00/12
Status:
Online Creative Tier 1
Priority: High
<internal link to DDS or AS>OL
Notes:Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Studio Awaiting reply.Talent Email approvalLegal --
1Duration: 6 months
Approved
Edit Milestone Clone Milestone
1
2
Sarah arrived on Monday morning to find an email from legal letting her know that the Winnie the Pooh poster approval is getting delayed by 2 weeks. Nooooo!
She clicks on the “Campaigns” pulldown and finds Winnie The Pooh
Once on the Campaign detail page, she clicks on “Edit Milestone”
3
Sarah Talbott
Legal Delay with Winnie the Pooh
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.
Best,Chris
YourBrand
YourGoals
Users’Needs
Who You Are
User Needs
Business Goals
Business Goal
User Need
Features & Functionality
43
1
Sarah Talbott Manager
33 year-oldFemale Newly married
Responsible for the day-to-day execution of campaign elements for her department.
She needs help directing her work to highest priority tasks and milestones, reducing trivial workload, seeing where progress is being made in related activities and enabling visibility to her peers and manager.
Will adopt the IMM tool if it is easy and visually intuitive, will reject if it is complicated, dense and overly data heavy.
Watch Milestone
Online Ideation
Create Checklist
Start Date: 00/00/12 Approvals: Asset Link:
Filmmaker Verbal app’l in meeting.Due Date: 00/00/12
Online Debut: 00/00/12
Status:
Online Creative Tier 1
Priority: High
<internal link to DDS or AS>OL
Notes:Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Studio Awaiting reply.Talent Email approvalLegal --
1Duration: 6 months
Approved
Edit Milestone Clone Milestone
1
2
Sarah arrived on Monday morning to find an email from legal letting her know that the Winnie the Pooh poster approval is getting delayed by 2 weeks. Nooooo!
She clicks on the “Campaigns” pulldown and finds Winnie The Pooh
Once on the Campaign detail page, she clicks on “Edit Milestone”
3
Sarah Talbott
Legal Delay with Winnie the Pooh
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.
Best,Chris
1. Inception 2. Execution 3. Launch
Product Definition
1. Brand Definition2. User Profiling3. Business Priorities 4. Competitive Audit5. Story6. Messaging7. Groop Brief
1. User Stories2. Use Cases & Flows3. Sitemap4. Wireframes5. Development Spec.6. Content Spec.
1. Database Layer2. Application Layer3. Presentation Layer4. Elements (CSS, Javascript, Flash etc.)5. Hosting Setup6. Q/A & Load Testing
1. Bug Fixes2. Analytics3. Site Administration4. Multivariate Testing5. Marketing6. Partners7. Celebration
1. Analysis2. Usage Patterns3. Demographic Detail4. Feature Revision5. User Focus Groups6. Release Planning7. Performance
1. Stylescape2. Identity System3. Typography4. Iconography5. Color Palette6. Style Guide
1. Copywriting2. Imagery3. Videography4. Animation5. Editing6. Rights Clearances7. Content Loading
1. Template Design2. User Interface3. Front End Spec.4. Design Application5. User Testing6. Product Revisions7. Marketing Strategy
Information Architecture
Identity & Visual Design
User Experience
Development (Front & Back)
Content Creation
Launch & Iterate
Be George Lucas: Tell Stories
Step 5
You are not are not a “Graphic Designer” you are a movie director - you tell stories!
Face your fear: “Luke I am your
father”
Step 6
YOU
evil flakeyobnoxious
product
dorkyEvil Flakey Obnoxious Dorky
big ideas & openness
promoting ideas & social
technical & deep knowledge
control & consistency
What type of designer are you?
thegroop.net/blog
Teamtreehouse.comLynda.compsd2html.comElance.comHOW Interactive Conf. 2012
Be(at) the 1%: Don’t work for
change. Be change.
Step 7
“The last few decades have belonged to the computer programmers who could crank code, lawyers who could craft contracts, MBAs who could crunch numbers. But the keys to the kingdom are changing hands. The future belongs to creators, designers, storytellers, caregivers, big picture thinkers – will now reap society’s richest rewards and share its greatest joys.”
Daniel Pink, A Whole New Mind
groopskool.net
thisweekinwebdesign.com
In Closing
Production Designer: $35
Visual Designer: $75
Production Designer: $35
User Experience Designer: $125
Visual Designer: $75
Production Designer: $35
a big favor
@josecaballer
On a scale of 1 to 10, 1 being “sucked”
10 being “holy mother of god”...
How did I do?
What can I improve?
Thank You