elegance without compromise
DESCRIPTION
What will the web look like in the next few years, and how will we shape it? Looking at where we've been, where we're at, and where we're going, Simon will share his experiences and ideas. He'll consider how traditional design theory, our ability to adapt, and the courage of our own convictions will help us strive for a better tomorrow.TRANSCRIPT
Elegance
Elegance Without Compromise with Simon Collison 10th Icelandic Web Awards, 4th February 2011
WITHOUT COMPROMISE
PREFACE
WHY AM I HERE?
Icelanders are very forward-thinking, and quickly embrace new technologies. The web is no exception, and I’m seeing an increasing number of beautifully designed, standards-compliant sites reaching out from the island. A couple of the ones listed [in the article] have already impressed the global design community—and for good reason.
http://col.ly/s/612nd June 2004
This future is not necessarily about...
HTML & CSSJQUERYPHOTOSHOP because these are just enablers
CHAPTER ONE
OUR VOCABULARY
I could list projects in every category from logos, to annual reports, to magazine covers, to packaging, to typefaces, to opening titles that could be considered landmark projects… But when it comes to web sites, I can’t think of a single www that could be comparable.
ARMIN VIT
Landmark websites, where art thou? Speak Up, April 2009.
The screen brings with it different kinds of challenges for visual design, some of which occur exclusively in interactive media.
It’s unrealistic to think our old methods can fill in all the gaps, but new interaction patterns and visual languages emerge everyday.
These are the building blocks for our new design principles.
JASON SANTA MARIA, 2008
PATTERNSTHAT ARE UNIQUELY OURS
BALANCECOMPOSITIONSYMMETRYMOVEMENTRHYTHMREPETITIONPATTERNS
SYSTEMSFOR EVOLVING WEBSITES
We don’t design web pages. We design systems.
ANDY CLARKE
DESKTOPSCREEN RESOLUTIONVIEWPORTMOBILE DEVICESORIENTATIONRENDERING ENGINESLAYOUT
http://jasonsantamaria.com/http://gregorywood.co.uk/
ADAPTIVELAYOUTS
The ability to alter the presentation of a website without altering its structure should have opened up the floodgates of design creativity.
JEREMY KEITH, 2006
RESPONSIVEWEB DESIGN
http://www.alistapart.com/articles/responsive-web-design/
NO SILVER BULLET
Adaptive Systems for Multiple Devices HD Live 4th Nov 2010
FOR THE MOBILE WEB
CHAPTER TWO
NECESSARY NAIVETY
Sports Illustrated for iPad
http://www.romancortes.com/blog/pure-css-coke-can/
http://neography.com/experiment/circles/solarsystem/
http://www.nevermindthebullets.com/
http://hardboiledwebdesign.com/
CHAPTER THREE
FUNDAMENTALS
TYPOGRAPHY
By using typographywe give a written idea a visual form.
TYPOGRAPHY
http://typography.com/email/2010_03/index_tw.htm
COLOUR
Colour can bring designs to life, inform hierarchies, create bonds between elements, add pace or emotion.
COLOUR
MOTIVE
What are our motives, and why do we go in one particular direction?
MOTIVE
NOSTALGIA
A longing for the past, or the ephemera of the olden days, and the sense that everything was better than it is today.
NOSTALGIA
Copyright BBC 2010
RHETORIC
The art of using language effectively in order to persuade.
RHETORIC
VERNACULAR
The everyday language through which a group, community or regional area communicates.
VERNACULAR
HUMOUR
The opportunity to present and exploit wit in order to communicate meaning.
HUMOUR
http://www.atmostheory.com/index.php?/projects/commands/http://www.frankchimero.com/
AFFORDANCE
An affordance is a quality of an object, or an environment, that allows an individual to perform an action.
AFFORDANCE
Attractive things work better.
DON NORMAN
TEXTURES
REDUCTION & RESTRAINT
Constructing immediate meaning through economy of use.
RESTRAINT & REDUCTION
CHAPTER FOUR
RESPOND TO OUR WORLD
Environment
Experience
Others
Me
Instruction
Interaction
http://www.tat.se/openinnovation/
http://www.tat.se/openinnovation/
CHAPTER FIVE
PAST PRESENT & FUTURE
http://www.chromeexperiments.com/detail/browser-ball/
I THINK...
THE FUTURE IS ALREADY HERE
http://lostworldsfairs.com/atlantis/
FINALLY
SOME CONCLUSIONS
SO, HOW DO YOU LIKE MY PRESENTATION?
Questions?
Simon Collison
http://colly.com@simoncollison