• Save
Getting Your UI/UX to Oooze With Brand Yumminess
Upcoming SlideShare
Loading in...5
×
 

Getting Your UI/UX to Oooze With Brand Yumminess

on

  • 1,717 views

Presentation first given to MiUPA.org at TechSmith in Lansing, MI - 05/19/2011

Presentation first given to MiUPA.org at TechSmith in Lansing, MI - 05/19/2011

Statistics

Views

Total Views
1,717
Views on SlideShare
1,717
Embed Views
0

Actions

Likes
1
Downloads
0
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment
  • Interaction Design- Flow of users through the systemInformation Architecture - Wireframe - Categories of navigation -
  • Information Design - Layering -How are we going to say it - How are we going to present it

Getting Your UI/UX to Oooze With Brand Yumminess Getting Your UI/UX to Oooze With Brand Yumminess Presentation Transcript

  • Getting Your UI/UX to Ooooozewith Brand Yumminess
    Kevin Skarritt
    CEO/Owner
    Flock Marketing
    Grand Ledge, MI
    @skarritt
    #MiUPA
  • Introduction to Brand
    • A 9 Second Test
  • Introduction to Brand
    Fast Food
    McDonalds
    Burger King
    Wendy’s
    Subway
    Taco Bell
    Hardees
    KFC
    Arby's
    Dairy Queen
    Chick-Fil-A
    Del Taco
    Sonic
    In-and-Out
    White Castle
    • Cola
    • Coke
    • Pepsi
    • RC Cola
    • Faygo
    • Red Bull Cola
    • Crown Cola
    • Sam’s Cola
    • Go Cola
    • Athletic Shoes
    • Nike
    • Addidas
    • Reebok
    • Puma
    • Converse
    • Rockport
    • Saucony
    • Airwalk
    • Avia
    • New Balance
    • Fila
    • Brooks
    • Osiris
    • Diadora
  • Pieces of Brand
    Products/Services
    Customer
    Company
  • Pieces of Brand
  • Pieces of Brand
  • Archetype Connection
  • Carl Jung & Archetypes
    • Why Archetypes?
    • 12 Archetypes:
    • The Mother
    • The Hero
    • The Jester
    • The Artist
    • The Ruler
    • The Angel
    • The Guru
    • The Lover
    • The Magician
    • The Outlaw
    • The Neighbor
    • The Explorer
  • Archetype #1 — The Artist
    Also known as:
    Creator, inventor, innovator, musician, writer, dreamer
    Strategy
    Examples
    Lego, Crayola, Sony, Swatch, 3M
  • Archetype #2 — The Neighbor
    Also known as:
    Regular guy, everyman, realist, working stiff, solid citizen
    Strategy
    Examples
    Maytag, Saturn, Wendy’s, Charles Schwab, Dodge
  • Archetype #3 — The Lover
    Also known as:
    Partner, friend, intimate, enthusiast, spouse, romantic
    Strategy
    Examples
    Hallmark, Chanel, Jaguar, Haagen Dazs
  • Archetype #4 — The Jester
    Also known as:
    Trickster, fool, joker, comedian
    Strategy
    Examples
    Pepsi, M&M, Ben & Jerrys, AFLAC
  • Archetype #5 — The Mother
    Also known as:
    Caregiver, nurturer, saint, altruist, parent, helper, supporter, hand holder
    Strategy
    Examples
    Campbells, Volvo, Allstate, GE
  • Archetype #6 — The Guru
    Also known as:
    Sage, expert, scholar, thinker, academic, planner, mentor, teacher
    Strategy
    Examples
    CNN, McKinsey, Barnes & Noble, Wall Street Journal
  • Archetype #7 — The Angel
    Also known as:
    Innocent, utopian, mystic, dreamer
    Strategy
    Examples
    Coke, McDonalds, Ivory Soap, Baskin Robbins
  • Archetype #8 — The Explorer
    Also known as:
    Pioneer, seeker, wanderer, pilgrim, individualist
    Strategy
    Examples
    Starbucks, Jeep, Bounty
  • Archetype #9 — The Hero
    Also known as:
    Champion, warrior, rescuer, superhero, dragon slayer, winner
    Leader, crusader, general, team player
    Strategy
    Examples
    Nike, FedEx, The Marines
  • Archetype #10 — The Rebel
    Also known as:
    Outlaw, misfit, revolutionary, wildman
    Strategy
    Examples
    Harley Davidson, Napster, Apple
  • Archetype #11 — The Magician
    Also known as:
    Visionary, alchemist, catalyst, shaman, healer, medicine man
    Strategy
    Examples
    Calgon, MasterCard, Dupont, Lucent, Axe
  • Archetype #12 — The Ruler
    Also known as:
    Boss, aristocrat, king/queen, politician
    Strategy
    Examples
    IBM, Mercedes, Hilton, EF Hutton, Microsoft
  • POP QUIZ!!
  • Calvin Klein
    “Between Love and
    Madness Lies Obsession”
  • Toyota
    “Moving Forward”
  • UI/UX
    You might now be asking…
    “How does this affect UI/UX development?”
    OR
    “How do I get my UI/UX to ooze
    with brand yumminess?”
  • Elements of User Experience
    Jesse James Garrett
    “Elements of User Experience”
  • Fun With a Mock Case Study
    • Draw on Coupon-Chic
    • Local with plans for expansion
    • Established client-base
    • 72% Moms
    • Mother Archetype
  • The Strategy Plane
    From JJG…
    User Needs: Externally derived goals for the site; identified through user research, ethno/techno/psycho-graphics, etc.
    Site Objectives: Business, creative, or other internally derived goals for the site
  • The Scope Plane
    From JJG…
    Functional Specs: “Feature Set” detailed descriptions of functionality the site must include in order to meet user’s needs
    Content Requirements: Definition of content elements required in the site in order to meet user needs
  • The Structure Plane
    From JJG…
    Interaction Design: Development of application flows to facilitate user tasks, defining how the user interacts with site functionality
    Information Architecture: Structural design of the information space to facilitate intuitive access to content
  • The Skeleton Plane
    From JJG…
    Interface Design: Design of elements to facilitate user interaction with functionality
    Info. Design: Designing the presentation of information to facilitate understanding
    Nav Design: Design of navigation elements to facilitate the user’s movement through the information architecture
  • The Surface Plane
    From JJG
    Graphic treatment of interface elements (the “look and feel”)
    Visual treatment of text, graphic page elements and navigational elements
  • Group Exercise
    Groups of 5 to 7
    Review the interface provided
    Discuss how things might change if they adopted the designated archetype
    User Needs, Site Objectives
    Functional Specs, Content Req’s
    Interaction Design, Info. Architecture
    Interface/Nav Design, Info. Design
    Visual Design
    Other Ideas?
  • Wrap it up …
    Brand evolves … it’s not created
    Emotional connection & differentiation
    Entire team needs to speak with one voice
    Find (and empower) your brand evangelists
    Questions?
  • Connect With Me…
    1-888-FLOCK-88
    kevin@flockmarketing.com
    @skarritt
    facebook.com/skarritt
    facebook.com/flockmarketing
    linkedin.com/in/skarritt
    Time for a door prize!!!
    Try this … Text “fan flockmarketing” to 32665