Graphic Design: The Forgotten Web Standard

Loading...

Flash Player 9 (or above) is needed to view presentations.
We have detected that you do not have it on your computer. To install it, go here.

7 comments

Comments 1 - 7 of 7 previous next Post a comment

  • + swasden Sharon Wasden 1 month ago
    These slides are ABSOLUTELY A-MAZING!

    I went to your site and was disappointed to discover that the streaming video of your talk could not be found. Please let me know when it can be found!
  • + tvebak Thomas Jean 2 months ago
    PLEASE!!!
    Could you export this to PDF?
    I dont own a MAC!
  • + fdallolmo Fabrizio Dall'Olmo 2 months ago
    Wonderful work. I havedownloaded but I can’t open it because I have Keynote ’08. Any chance to have a link to open it with my 'old' application or powerpoint?
  • + dcaron Denise Caron 5 months ago
    Brilliant!
  • + guest4878f8 guest4878f8 6 months ago
    Good ! ;-)
  • + guest9bbbf0 guest9bbbf0 6 months ago
    Fantastic slides, my favorite is slide 14, would love to have that as a desktop background. Well done for pushing the standards of presentation slides.
  • + guestb0a7388 guestb0a7388 6 months ago
    Nice one Mike!

    It was one of the best talks at FOWD and by far the best slides i’ve ever seen at any event! The video was amazing too!
Post a comment
Embed Video
Edit your comment Cancel

Notes on slide 1

Intro - Designer at Carsonified
So title of my talk is: Graphic Design: The Forgotten Web Standard.
Talk in two chapters:
1. Observations from 2 years as a web designer. Balance of converation - Code/tech over design.
2. How graphic design can help us create ACCESSIBLE - USABLE and BEAUTIFUL sites.

Print background
One day two years ago got drunk
Then I fell in love with web design

Taught by Nick Harris

the last two years have been an interesting time.
sucked into world of web.
learnt code + how web industry works.


Amazed at community interaction, conversation, passion.
forums, blogs, events, meet-ups.

It’s great to see that passion and interaction on -
Something that didn’t happen to me in the print world.

Really struck me - Code based tech chat -
Semantic Markup, CSS, Microformats, Progressive Enhancement.
This is all cool - we need to learn.
Flip side to this.

1. Obsessive, repetitive conversation over minor details
h1 debate, where to use spans, site width, the fold, VALIDATION.

2. BUT EVEN *TOO MUCH* OF THE SENSIBLE CHAT CAN BE COUNTER PRODUCTIVE!

EXAMPLE: Progressive Enhancement. Party glass - Richer user experience.

The excessive focus on theories, tools and process rather then end product.
We need to learn - but not obsess - Artists debating paint brushes???

These obsessions can hampers progression - web is new - finely tuning an old engine
These debates are cogs in a much larger machine.

it’s interesting we tend to focus on the technical side...
because I don’t think limitations come from our tools...
they come from our imaginations.

You can know your tools inside out...
but you still need to be able to design

There’s a missing conversation on the web

I care.. we all care about web standards & graphic design contributes to this -
Graphic design is your greatest weapon in creating - ACCESSIBLE - USABLE and BEAUTIFUL websites

Lets take a look how graphic design can do this.

Layout:
make your site easy to use.
don’t over complicate things.
design for flow.
use space space to balance content.
UI design - Ryan Singer.
DESIGN FOR EXPERIENCE

Make your site engaging.
make it beautiful.
Make it connect Emotionally

The bit I love!
progressive enhancement debate.
Richer user experience by design.



Typography contributes to accessibility and the beauty of your site.
Size, style, contrast, clear titles, readable paragraphs.
Attention to detail with - tracking and leading (letterspacing, line height)

get creative with type - Type bases for great design!

Web typography debate:
it’s how we use fonts
not how many we have

Copy is...
informative
engaging - factually & emotionaly
Good Copy influences design
Strapline example




Colour is beautiful and complicated.
Communicates
Seduces
Creates Mood
Learn colour theory
Choosing schemes - Dulux charts

whole other talk
photography and illustration
bring a page to life
use none over crap

web is drowned in trends
make your mark by breaking away
ask yourself why? flickr feed, twitter feed.
Are you adding content for sake of it?

Become the trendsetter
stay away from galleries for inspiration - use books & your environment
Go to smashing magazine - check 2009 trends - avoid them

Imagine your web page in print.
Think outside the context of the web.
It’ll make you think of things you’ve never though of before.

Future of web design is many things:
Web design is Graphic Design.
Front end code + design is part of the same job.
Code is a web designer’s paint brush - use it well... but concentrate on the canvas not the brush.
*Learn from past masters to catapult you into the future*

Committed to web standards???

Web is beautiful place - it’s new - it needs to grow - you’re responsible for that.
***Graphic design is club - Hillman Curtis Film***

You might have noticed that I’ve used my slides to experiment with some graphic design.
Nice way to end my talk.

I have a poster

my influences.
Grow up with david carson and neville brody
recently: peepshow collective and i love dust
Joseph Müller-Brockmann (these slides)
searching flickr


124 Favorites

Graphic Design: The Forgotten Web Standard - Presentation Transcript

  1. No transcript available.

+ mikekusmikekus, 6 months ago

custom

20502 views, 124 favs, 61 embeds more stats

A talk I gave at the 'Future of Web Design' confere more

More info about this document

© All Rights Reserved

Go to text version

  • Total Views 20502
    • 13039 on SlideShare
    • 7463 from embeds
  • Comments 7
  • Favorites 124
  • Downloads 900
Most viewed embeds
  • 2818 views on http://www.thethingswemake.co.uk
  • 2137 views on http://thethingswemake.co.uk
  • 790 views on http://events.carsonified.com
  • 555 views on http://www.emob.fr
  • 296 views on http://blog.fabioseixas.com.br

more

All embeds
  • 2818 views on http://www.thethingswemake.co.uk
  • 2137 views on http://thethingswemake.co.uk
  • 790 views on http://events.carsonified.com
  • 555 views on http://www.emob.fr
  • 296 views on http://blog.fabioseixas.com.br
  • 221 views on http://ueberzeugend-praesentieren.de
  • 125 views on http://blog.barbayellow.com
  • 123 views on http://www.fran6art.com
  • 95 views on http://createordie.de
  • 44 views on http://www.ryancerbus.com
  • 34 views on http://www.coreycanada.com
  • 26 views on http://www.bibox.fr
  • 22 views on http://www.modula.fi
  • 19 views on http://entwickler.com
  • 12 views on http://www.mallmusmedia.com
  • 11 views on http://www.screation.co.uk
  • 10 views on http://utku.tumblr.com
  • 9 views on http://actenblog.jellyfeed.com
  • 8 views on http://graphiceyedea.co.uk
  • 8 views on http://scarperosse.tumblr.com
  • 7 views on http://www.adamwintle.com
  • 7 views on http://shubox.net
  • 6 views on http://daniseuba.wordpress.com
  • 6 views on http://reddev001
  • 5 views on http://www.cibcommunications.co.uk
  • 5 views on http://www.netvibes.com
  • 4 views on http://tariqsobh.wordpress.com
  • 4 views on http://thecuriousbrain.com
  • 4 views on http://isgenoa.wordpress.com
  • 4 views on http://www.garysguide.org
  • 4 views on http://blog.lnzurich.com
  • 3 views on http://michmilk.blog.pl
  • 3 views on http://jbeau.basecamphq.com
  • 3 views on http://translate.googleusercontent.com
  • 3 views on http://presentations.tumblr.com
  • 2 views on http://feeds.feedburner.com
  • 2 views on http://www.slidemagnet.com
  • 2 views on http://static.slidesharecdn.com
  • 2 views on http://entwickler-magazin.de
  • 2 views on http://tvebak.dk
  • 2 views on http://xn--diseo3-zwa.com
  • 1 views on http://jessek.tumblr.com
  • 1 views on http://feeds2.feedburner.com
  • 1 views on https://events.carsonified.com
  • 1 views on http://www.iweb34.com
  • 1 views on http://wildfire.gigya.com
  • 1 views on http://nothingisoverrated.blogspot.com
  • 1 views on http://screation.co.uk
  • 1 views on http://lordphoenix.tuxfamily.org
  • 1 views on http://www.blogger.com
  • 1 views on http://webmail1f.orange.fr
  • 1 views on http://slidemagnet.com
  • 1 views on file://
  • 1 views on http://mail3.voila.fr
  • 1 views on http://localhost:8888
  • 1 views on http://webmail22.orange.fr
  • 1 views on http://www.newsgator.com
  • 1 views on http://www.planetaki.com
  • 1 views on http://74.125.93.132
  • 1 views on http://www.geolab21.blogspot.com
  • 1 views on http://geolab21.blogspot.com

less

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate. If needed, use the feedback form to let us know more details.

Cancel
File a copyright complaint
Having problems? Go to our helpdesk?

Categories