• Save
Graphic Design For Developers
Upcoming SlideShare
Loading in...5
×
 

Graphic Design For Developers

on

  • 8,420 views

Slide deck from my guest appearance on "Web Wednesday" June 4, 2008.

Slide deck from my guest appearance on "Web Wednesday" June 4, 2008.

Statistics

Views

Total Views
8,420
Views on SlideShare
8,310
Embed Views
110

Actions

Likes
19
Downloads
0
Comments
3

8 Embeds 110

http://franksworld.com 38
http://edel518.wikispaces.com 19
https://bboc.vvc.edu 19
http://www.slideshare.net 11
http://www.brijj.com 9
http://www.franksworld.com 7
http://bboc.vvc.edu 6
http://ig.gmodules.com 1
More...

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…
  • nice one...loved it
    can i have this one ...
    myi.y2k@gmail.com

    thnxs
    Are you sure you want to
    Your message goes here
    Processing…
  • very good presentations, and would you like to share this presentation with my?
    my email, wzmgogo@sohu.com
    Thanks.
    Are you sure you want to
    Your message goes here
    Processing…
  • Excellent sharing and nice presentation.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Graphic Design For Developers Graphic Design For Developers Presentation Transcript

  • Frank La Vigne Applied Information Sciences Microsoft MVP: Tablet PC www.FranksWorld.com [email_address]
    • 15 years of professional experience
    • Started career writing Microsoft Visual Basic 3 applications
    • Microsoft MVP: Tablet PC
    • User Group & Code Camp speaker
    • CoDE Magazine Author
    • President Emeritus of Richmond.NET User Group
    • Lead Designer @ Applied Information Sciences
      • Blog: http://www.franksworld.com
      • Corporate: http://www.appliedis.com
    • “ I’m not an artist.” No one is asking you to be one.
    • “ UI is just fluff anyways.” Have you ever been frustrated by one?
    • “ Good UI is subjective.” Not Really. It is measurable.
    • “ I don’t own any turtlenecks.” That’s OK.
  •  
    • UI = User Interface
    • UX = User Experience
    • Graphic design is a process
      • Just like designing software: There are rules, patterns and conventions
    • There are even acronyms
      • User Interface (UI)
      • User Experience (UX)
    • What’s the difference between UI and UX?
      • It’s easy actually.
    * Or how I stopped worrying and embraced my creative side.
  •  
  •  
    • User Interface is
      • What the user sees
        • Controls
        • Layout
    • User Experience is
      • What the user feels
        • Steps in a process
        • Wait times
        • Shifts in attention & eye focus
    • Yogi Berra
    Examples of good (and bad) design are all around us.
    • Q: Why are screens like this still common sights at retail stores, hospitals, etc in 2008?
    • A: It’s actually usable.
    • Keystroke navigation
    • Consistent
    • High contrast
    • But how?
    • Look at the application through a user’s eyes:
    • Are the text boxes lined up?
      • Neatness counts you know.
    • A lot of folks rarely use the mouse.
      • Do the tab orders line up?
      • Do keyboard shortcuts make sense?
    • Are frequent tasks easy?
      • Count the number of clicks/keystrokes/context shifts it takes to perform a task.
    • Look at the application through a user’s eyes:
    • Is a given screen’s purpose obvious?
      • To you?
      • To everyone else?
      • To your target customers?
    • Placement of information
      • In Western Cultures, users read from Top Left to Bottom Right
      • “ Above the fold”
  •  
  •  
  •  
    • Which site is likely to get repeat visitors?
    • Which site is more likely to generate revenue?
    • Does UX design matter?
  •  
  •  
  •  
    • Yogi Berra
    What good is data if decision makers can’t understand its meaning?
  • What good is data if decision makers can’t understand its meaning? Edward R. Tufte, Visual Explanations: Images and Quantities, Evidence and Narrative (1992)
    • Look at the application through a user’s eyes:
    • Can users readily identify important data?
      • Colors and Contrast
      • Font size
    • Can users see text clearly?
      • If they have to squint or hunt, then the answer is no.
  •  
    • Relevance and frequency are immediately obvious
  •  
    • Colors
    • Draw our attention
    • Excite the mind
    • Have significance and meaning
    • Inspire emotions
      • Can make us hungry, nervous or calm
    • Red
      • Red is also considered an intense, or even angry, color that creates feelings of excitement or intensity
    • Yellow
      • Yellow can also create feelings of frustration & anger
      • Yellow can also increase the metabolism.
    • Green
      • symbolizes nature and the natural world.
      • represents tranquility, good luck, health, and jealousy.
    • Yogi Berra
    the predominance of the colors red & yellow in many restaurants is there only to make customers hungry
    • Yogi Berra
    Blue conveys importance and confidence without being somber or sinister, hence the blue power suit of the corporate world
    • The Tools to Build a Better User Experience
    • Expression is a suite of products for building UX’s
    • --Much like Office is a suite of business tools
    • Demos
    • Expression Design
    • Expression Blend
  • Frank La Vigne www.FranksWorld.com [email_address]