Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Getting Fun With Design, UI, and All Things Int...

David Leininger
February 22, 2013

Getting Fun With Design, UI, and All Things Internety

A basic explanation of UI and responsive to executives from my company's peer group. Understanding why responsive and good UI is important.

David Leininger

February 22, 2013
Tweet

More Decks by David Leininger

Other Decks in Design

Transcript

  1. TODAY’S AGENDA AKA... What I’m going to talk at you...

    1. What is UI? 2. What is Responsive Web Design? 3. Show and Tell 4. El futuro de Internet en todo el mundo 5. Pizza Party and Team Building Exercises
  2. WHAT IS UI? And why "e heck is it so

    imp#tant? • A user interface is the system by which people interact with a machine.
  3. WHAT IS UI? And why "e heck is it so

    imp#tant? • A user interface is the system by which people interact with a machine. • A user interface is the system by which people interact with a ANYTHING.
  4. WHAT IS UI? And why "e heck is it so

    imp#tant? • Somethings have to be so simple they work without instruction • Others are taught over time to a point that they become second nature.
  5. UI CHECKLIST Good UI is clear, concise, and helpful 1.

    Know your user 2. Pay attention to patterns 3. Stay consistent 4. Use visual hierarchy 5. Provide feedback 6. Be Forgiving 7. Empower your user 8. Speak their language 9. Keep it simple
  6. NEW PROBLEMS Now "e user can use a! kinds of

    devices... iMac, iPhone, iPad... • Mobile phones • Tablets • Retina display computers
  7. WHAT IS RWD? Responsive Web Design • Flexible Grids •

    Media Queries • Flexible Images (at a minimum)
  8. IS RWD IMPORTANT? M#e "an you would believe... • Meets

    users where they are at • Single site, single source of content • Futureproof
  9. RWD IS GOOD UI Responsive Web Design • Tailored solution

    for each screen size • Uses touch and swipe gestures for mobile • Puts important content first
  10. MOBILE FIRST What does "at mean? • Worry about essential

    content first • Reduces content/design bloat • Gives users the content at the top
  11. SHOW AND TELL False Interaction • False Interaction is when

    the user thinks and feels like they are doing something to interact with the page content, but in actuality they aren’t. • http://simple.com • http://squareup.com/careers/creative • http://knowclassic.com coming soon...
  12. THE FUTURE It’s here and it’s awesome • Icon Fonts

    • New (way m#e awesome) Media Queries