web design in 2009
DESCRIPTION
My presentation for Barcamp Gent (Dec 2009), but unfortunately I didn't make it. You'll see that's it a more "updated" version of my previous Barcamp Gent presentation: http://www.slideshare.net/erlend/what-web-designers-could-learn-from-print-designers-presentationTRANSCRIPT
![Page 1: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/1.jpg)
Web Design
Monday 28 December 2009
![Page 2: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/2.jpg)
Web 2.0 is so 2005
Monday 28 December 2009
![Page 3: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/3.jpg)
And yet people still say ...
“I want that design to be more 2.0”
Monday 28 December 2009
![Page 4: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/4.jpg)
2009 - 2005 = 4 years
Monday 28 December 2009
![Page 5: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/5.jpg)
Who’s fault is that?
Monday 28 December 2009
![Page 6: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/6.jpg)
It’s everyone’s faultEveryone’s fault?
Picture by flickr.com/photos/isayx3
Monday 28 December 2009
![Page 7: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/7.jpg)
It’s everyone’s faultWe are the ones to blame!
Monday 28 December 2009
![Page 8: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/8.jpg)
It’s everyone’s fault“We” as in: designers,
developers, accounts, ...
Monday 28 December 2009
![Page 9: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/9.jpg)
It’s everyone’s faultWhy? We love to hide
behind technology
Monday 28 December 2009
![Page 10: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/10.jpg)
Web 2.0 & web 3.0 has brought us
a lot of “new” (sometimes useful) stuff...
Monday 28 December 2009
![Page 11: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/11.jpg)
... but how has web design
changed ever since?
Monday 28 December 2009
![Page 12: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/12.jpg)
Web Design should
become more mature
Monday 28 December 2009
![Page 13: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/13.jpg)
This is what people think when you say
you’re a web designer...
Monday 28 December 2009
![Page 14: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/14.jpg)
It’s a pixel perfect craft that communicates
a clear & structured message.
My definition of web design:
Monday 28 December 2009
![Page 15: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/15.jpg)
2 things to keep in mind
Monday 28 December 2009
![Page 16: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/16.jpg)
The internet is all about content
&
People get frustrated in no time
Monday 28 December 2009
![Page 17: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/17.jpg)
5 skills each web designer should practice
Picture by flickr.com/photos/anjin
Monday 28 December 2009
![Page 18: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/18.jpg)
... or at least should have an interest in!
Monday 28 December 2009
![Page 19: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/19.jpg)
Information Design
Usability
Typography
Visual Language
Change - ?
1
2
3
4
5
Monday 28 December 2009
![Page 20: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/20.jpg)
Skill 1: Get addicted to Information Design
Picture by konigi.com
Monday 28 December 2009
![Page 21: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/21.jpg)
“Information design makes complex information easier to understand and use”
Monday 28 December 2009
![Page 22: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/22.jpg)
‣ Human-centered design
‣ Measure information density
‣ What’s the knowledge base of my audience?
‣ Whitespace is sexy
‣ Prioritize
‣ Respect Standards
Monday 28 December 2009
![Page 23: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/23.jpg)
Monday 28 December 2009
![Page 24: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/24.jpg)
Skill 2: Usability, to ease everyone’s mind
Picture by flickr.com/photos/jepoirrier
Monday 28 December 2009
![Page 25: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/25.jpg)
“Don’t make me think - please”
Monday 28 December 2009
![Page 26: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/26.jpg)
‣ “What we design for” VS“How people really use it”
‣ Sense of Location
‣ What elements are clickable?
‣ Visual Hierarchy
‣ Less noise more signal
‣ Be consistent: it gives people the grip they need
Monday 28 December 2009
![Page 27: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/27.jpg)
Monday 28 December 2009
![Page 28: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/28.jpg)
Who doesn’t recognize these shapes?
Monday 28 December 2009
![Page 29: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/29.jpg)
Skill 3: Typography, yes we Kern
Monday 28 December 2009
![Page 30: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/30.jpg)
“typography is the art and technique of arranging type”
Monday 28 December 2009
![Page 31: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/31.jpg)
‣ Drop the tiny font-size
‣ Use different font-faces
‣ People Love color
‣ What should be emphasized?
Monday 28 December 2009
![Page 32: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/32.jpg)
Monday 28 December 2009
![Page 33: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/33.jpg)
Skill 4: Visual Language
Picture by flickr.com/photos/41894180030@N01
Monday 28 December 2009
![Page 34: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/34.jpg)
Matching content and design. “Are they telling the same story?”
Monday 28 December 2009
![Page 35: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/35.jpg)
‣ Your design shouldcommunicate something
‣ There’s no such thing as;“One template to rule them all”
‣ Design your content, notonly the surroundingelements
‣ Your header & footer shouldn’t be the only Climax
‣ Your copy should bepart of the lay-out
Monday 28 December 2009
![Page 36: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/36.jpg)
Monday 28 December 2009
![Page 37: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/37.jpg)
Monday 28 December 2009
![Page 38: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/38.jpg)
Skill 5change
Monday 28 December 2009
![Page 39: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/39.jpg)
“Find a piece of the status-quo and try to change it”
Seth Godin
Monday 28 December 2009
![Page 40: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/40.jpg)
“You can tell who the pioneers are from the arrows sticking out of
their backs”
Hugh MacLeod
Monday 28 December 2009
![Page 41: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/41.jpg)
Web design is Craftsmanship
Craftsmanship gets noticed twice as hard
Picture by flickr.com/photos/jepoirrier
Monday 28 December 2009
![Page 42: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/42.jpg)
Web design is functional, it goes further
then creating a good looking website
Monday 28 December 2009
![Page 43: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/43.jpg)
Every website has a goal
How do we support the visitor in completing that goal?
Monday 28 December 2009
![Page 44: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/44.jpg)
Good Web design equals higher ROI
and a bunch of happy visitors
Monday 28 December 2009
![Page 45: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/45.jpg)
... Everyone is happy!
Monday 28 December 2009
![Page 46: Web Design in 2009](https://reader034.vdocuments.us/reader034/viewer/2022051613/54c7f2e94a7959b6118b4582/html5/thumbnails/46.jpg)
That’s it!
Erlend Debast
Web designer @ proximity BBDO
twitter.com/erlend
Monday 28 December 2009