Post on 13-Jan-2015
description
transcript
Beautifying the web with illustration
1
October 23, 2008© Cindy Li | www.cindyli.com
Illustration...
“A picture is worth a thousand words.”
2
Illustration is a Work of Art
© Alberto Seveso, www.recycledarea.co.uk3
“It’s pretty!”
Illustration Beautifies the Web
4
homage to “geocities 1996” by Bruce Lawson | www.csszengarden.com/?cssfile=http://www.brucelawson.co.uk/zen/sample.css5
“No really, it really is pretty!”
Illustration...
6
Illustration is Business
7
Illustration is Personal
8
Illustration is Social
www.e-hobo.com9
Illustration is Social
10
Illustration is Social
11www.700molemen.com/list
Illustration is Social
www.facebook.com12
Illustration is Social
www.facebook.com13
Illustration is Iconic
www.joyent.com14
Illustration is Iconic
15
Illustration is Iconic
15
Different perspective to a website using illustration
© Veerle Pieters, veerle.duoh.com
Illustration vs. Photography
16
© Veerle Pieters, veerle.duoh.com
Illustration vs. Photography
17
www.google.com
Illustration is Fun
18
Adds personality to corporate logos
www.google.com/holidaylogos.html
Illustration is Fun
19
Adds personality to corporate logos
Courtesy of AOL.com
Illustration is Fun
20
Adds personality to corporate logos
www.yahoo.com
Illustration is Fun
21
Localization for each illustration
www.google.com
Illustration is Current
22
www.mixx.com/404.html
Illustration eases the pain of a 404
23
www.mixx.com/404.html24
Illustration eases the pain of a 404
blog.mozilla.com/error.html25
Illustration eases the pain of an error
Illustration is Silly
26twitter.com
A collection of images to explain directions
www.mezzoblue.com/archives/2007/08/27/reduce/
Illustration is Instructional
27
A collection of images to explain directions
www.mezzoblue.com/archives/2007/08/27/reduce/
Illustration is Instructional
28
No matter what language
www.ms-centrum.be/nl/zorgaspecten/voeding.html
Illustration is Multi-lingual
29
No matter what language
Illustration is Multi-lingual
30www.ms-centrum.be/nl/zorgaspecten/voeding.html
No matter what language
Illustration is Multi-lingual
31www.ms-centrum.be/nl/zorgaspecten/voeding.html
Illustration is an Explanation
32www.resemble.com
New concepts are harder to grasp
www.resemble.com
Illustration is an Explanation
33
New concepts are harder to grasp
34
Illustration is an Explanation
www.resemble.com
www.threadless.com
Illustration is Wearable
35
www.threadless.com/sizechart
Illustration is a Guide
36
Illustration is Personalization
37
Illustration is Personalization
37
Illustration is Personalization
38
Slide 32:Whatnot: www.flickr.com/photos/whatnot/2761052573/Emily Chang: www.flickr.com/photos/emilychang/2764290285/Ariel Waldman: www.flickr.com/photos/arielwaldman/2762423030/RellyAB: www.flickr.com/photos/fizzkitten/2760400091/James J. Malcom: www.flickr.com/photos/akaxaka/2765840140/Cindy Li: www.flickr.com/photos/cindyli/2763586784/TheMattHarris: www.themattharris.comCaleb Keiter: www.flickr.com/photos/calebkeiter/2763301347/Mark Casias: www.flickr.com/photos/teampoop/2765518131/Wordridden: www.flickr.com/photos/wordridden/2764235572/TheAdnostic: www.flickr.com/photos/theadnostic/2764510898/DrewVigal: www.flickr.com/photos/drewvigal/2774245997/
Sites to check outSlide 7: www.silverbackapp.comwww.flickr.com/explore/pandawww.strawpollnow.comwww.voteforchange.comwww.brightkite.com
Slide 8:www.alifelski.comwww.ma.ttwww.meomi.comwww.nikdaum.comwww.handmademonsters.comwww.theadnostic.comwww.eyeswideapart.blogspot.com
Thanks to:Craig CookJason GarberCinzia GavelanvMatt HarrisBrian Ivanovich
October 23, 2008© Cindy Li | www.cindyli.com
AmateurIllustrator.comDeviant Art
CSSbeauty.comScreenfluent.com
Reference sites:
Geert LeyseeleChris MoellerVeerle PietersJody ThomasShannyn Timrott