What is UX
UX is not UI
How is it Different than UI
• UX Designer is concerned with how a product
feels
• UX Designer works with Creative Director and
Visual Designer
• Involved in every stage of the products
creation
• Ties all aspects of the interactions with the
brand
What does a UX Designer Do?
What does a UX Designer Do?
• Scenario Improve Existing Site
– Restrictive Legacy Process
– Limited Budget
– Limited Scope
What does a UX Designer Do?
• Scenario Improve Existing Site
– IA. Can the pages be reorganized?
– Copy. Can the copy be improved?
– User Flow. Can the process be improved?
What does a UX Designer Do?
• Scenario Redesign Website
– Start with business goals / Client interview
– Content/Asset audit
– Ideation
– Prototype
– Test
– Design
– Build
Google Example
• UX Designer Thinks They’re Helping…
UX Process
Elements of a Webpage
• Brand Header
• Purpose/Benefit of this Product
• Call to Action
• Tokens of Trust
Elements of a Webpage
• Brand Header
Elements of a Webpage
• Purpose/Benefit of this Product
Elements of a Webpage
• Call to Action
Elements of a Webpage
• Tokens of Trust
Tools
• Pen and Paper
• Software with a grid layout
– Illustrator
– Omnigraphal
• Photoshop Layers
• Templates
• Google Keyword Planner
Prototyping
• Drawn
• Paper
• Low fidelity prototype
• Hi-Fi prototype
Wireframes
• Creates a common language for the design
• Move to digital when
– Many visual elements repeat
– Details begin to emerge
– Consistent size and shapes are needed
Frameworks
• JQueryUI
• Booststrap
Content Design Psychology
• Maslow’s Hierarchy
Content Design Psychology
• Maslow’s Hierarchy
Analyzing Structure
• Chunk out the main content areas
• Identify proof of trust
• What is the key offering
• The Call to Action
• What is the consequence of the CTA

IDX 200 - Week1

  • 1.
    What is UX UXis not UI
  • 2.
    How is itDifferent than UI • UX Designer is concerned with how a product feels • UX Designer works with Creative Director and Visual Designer • Involved in every stage of the products creation • Ties all aspects of the interactions with the brand
  • 3.
    What does aUX Designer Do?
  • 4.
    What does aUX Designer Do? • Scenario Improve Existing Site – Restrictive Legacy Process – Limited Budget – Limited Scope
  • 5.
    What does aUX Designer Do? • Scenario Improve Existing Site – IA. Can the pages be reorganized? – Copy. Can the copy be improved? – User Flow. Can the process be improved?
  • 6.
    What does aUX Designer Do? • Scenario Redesign Website – Start with business goals / Client interview – Content/Asset audit – Ideation – Prototype – Test – Design – Build
  • 7.
    Google Example • UXDesigner Thinks They’re Helping…
  • 8.
  • 9.
    Elements of aWebpage • Brand Header • Purpose/Benefit of this Product • Call to Action • Tokens of Trust
  • 10.
    Elements of aWebpage • Brand Header
  • 11.
    Elements of aWebpage • Purpose/Benefit of this Product
  • 12.
    Elements of aWebpage • Call to Action
  • 13.
    Elements of aWebpage • Tokens of Trust
  • 14.
    Tools • Pen andPaper • Software with a grid layout – Illustrator – Omnigraphal • Photoshop Layers • Templates • Google Keyword Planner
  • 15.
    Prototyping • Drawn • Paper •Low fidelity prototype • Hi-Fi prototype
  • 16.
    Wireframes • Creates acommon language for the design • Move to digital when – Many visual elements repeat – Details begin to emerge – Consistent size and shapes are needed
  • 17.
  • 18.
    Content Design Psychology •Maslow’s Hierarchy
  • 19.
    Content Design Psychology •Maslow’s Hierarchy
  • 20.
    Analyzing Structure • Chunkout the main content areas • Identify proof of trust • What is the key offering • The Call to Action • What is the consequence of the CTA