The Art Of Colors
Upcoming SlideShare
Loading in...5
×
 

The Art Of Colors

on

  • 47,059 views

 

Statistics

Views

Total Views
47,059
Views on SlideShare
32,284
Embed Views
14,775

Actions

Likes
137
Downloads
3,623
Comments
22

91 Embeds 14,775

http://moodle.apc.edu.ph 11789
http://nso.district287.org 618
http://visualcommunication.tistory.com 526
http://theteachermademedoit.pbworks.com 245
http://secmoodle.district287.org 205
http://prezi4u.tistory.com 171
http://inglesiecc.wordpress.com 120
http://burakargin.blogspot.com 114
http://www.slideshare.net 101
http://phobosmarketing.blogspot.com 99
http://boowoon.egloos.com 87
http://dtpword.pbworks.com 86
http://artsandcraftsbybea.blogspot.com.es 58
http://www.alaeditions.org 51
https://www.cs.ubbcluj.ro 45
http://www.ala.org 30
http://blog.livedoor.jp 30
http://artsandcraftsbybea.blogspot.com 27
http://www.hanrss.com 25
http://blendedschools.blackboard.com 21
http://www.cs.ubbcluj.ro 18
http://www.slidemagnet.com 18
http://adguer.blogspot.com 17
http://introf13sou.wikispaces.com 15
http://valoriprimilab.blogspot.com 15
http://www.flashquix.com 15
http://localhost 15
http://ang-dibujoeso.blogspot.com 14
http://www.elearning.sek.es 14
http://wpmu.bionicteaching.com 13
http://www.adguer.com 11
http://philosophyrecycled.blogspot.com 10
http://blog.joins.com 9
http://cvcc.blackboard.com 9
http://techinedstreyle.wikispaces.com 7
http://burakargin.blogspot.com.tr 7
http://ang-dibujoeso.blogspot.com.es 6
http://neocoin.net 6
http://amolafoto.blogspot.com 6
http://coloresdelverano.blogspot.com 6
http://pinterest.com 6
http://webdevs.eversun.ph 4
https://cvcc.blackboard.com 4
http://database4kids.blogspot.com 4
http://rubencastrillo.blogspot.com.es 4
http://www.techgig.com 4
https://elearning.uh.edu 4
http://rubencastrillo.blogspot.com 3
https://unis.blackboard.com 3
http://mycourse.highbury.ac.uk 3
More...

Accessibility

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

110 of 22 Post a comment

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…

110 of 22

Post Comment
Edit your comment

The Art Of Colors The Art Of Colors Presentation Transcript

  • The Art of Colors A few tips for user interface designers by elisa giaccardi [email_address]
  • Let’s warm up !
  • Let’s start with some basics
  • There are two color systems
  • Additive Subtractive red + green + blue = white magenta + yellow + cyan = black
  • UI designers use the additive system
  • What is this jargon ? hue brilliance saturation
    • Hue
    name and properties of a color that enables it to be perceived
    • Brilliance
    how light or dark a color is
    • Saturation
    the level and mixture of white , black , grey or complimentary included in colors
  • What are these ? primary secondary tertiary colors
  • Learn the color wheel
  • Another way to visualize
  • Another way to visualize
  • Primary colors
  • Secondary colors
  • Tertiary colors
  • Analogous colors
  • Opposite colors are complementary
  • Combinations of opposite or analogous colors are harmonic
  • Now you know the jargon too!
  • Wasn’t it additive ?
  • Web color wheel
  • Do colors have personality ?
  •  
  • © Edward Burtynsky What about this orange ?
  • © Philip-Lorca diCorcia How about this yellow ?
  • © Cindy Sherman And what about this green ?
  • It’s about relationships
  • Dynamic relationship
  • Dynamic-static relationship
  • Static relationship
  • It’s a matter of contrast
  •  
  •  
  •  
  •  
  • It’s about balance
  •  
  •  
  • Think with your eyes !
  • Color palette tips & tools
  • Strive for harmony
  • Be mindful of contrast effects
  • Understand color dominance
  •  
  • Rules of thumb for UI designers
  • Ensure text readability through contrast
    • Avoid the use of textures and pattern for backgrounds behind texts
    • Avoid contrasts that cause eye fatigue
    • Avoid color combinations that cause illusions when positioned together
  • Enhance user experience
    • Establish conventions and use color consistently
    • Use color both to support users’ tasks and for branding
    • Use color to enhance aesthetic appeal and user satisfaction
  • Use color for identification, grouping, and emphasis
    • Relate visual elements
    • Demarcate different areas
    • Highlight important task-related information
  • Use color associations in expressing state information
    • Be consistent with job-related color associations
    • Learn about cultural color associations
  • Indicate availability using color or value
    • For links
    • For controls
    • For icons
    • For windows
  • Some good readings
    • Itten, Johannes
    • The Art of Color
    • New York: John Wiley & Sons, 1974
    • Pabini, Gabriel-Petit
    • Color Theory for Digital Displays
    • http://www.uxmatters.com/
    • Pabini, Gabriel-Petit
    • Applying Color Theory to Digital Displays
    • http://www.uxmatters.com/
  • Slides available at