0
DESIGN TO
COMMUNICATE
Simon Collison
DIBI, Gateshead, April 2010
@simoncollison colly.com
This presentation is about starting points...
DESIGN
SQUARE
ONE
This presentation is not about...
HTML & CSS
JQUERY
PHOTOSHOPbecause these are just enablers
The screen brings with it different kinds of
challenges for visual design, some of which
occur exclusively in interactive ...
VISUAL
GRAMMAR
BALANCE
COMPOSITION
SYMMETRY
MOVEMENT
RHYTHM
REPETITION
PATTERNS
MENTAL
MODELS
The models people have of
themselves, others, the
environment, and the things
with which they interact.
MENTAL MODELS
Environment
Experience
Others
Me
Instruction
Interaction
MAPPING
The relationship between
two things.
Natural mapping leads to
immediate understanding.
MAPPING
Control Outcome
UnderstandingControl Outcome
SYSTEMS
We don’t design web pages.
We design systems.
ANDY CLARKE
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.
NOST...
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
SEMIOTICS
The study of signs offering
an explanation of how people
extract meaning from words,
sounds and images.
SEMIOTICS
Symbol Icon Index
TYPOGRAPHY
By using typography
we give a written idea
a visual form.
TYPOGRAPHY
COLOUR
Colour can bring designs to
life, inform hierarchies, create
bonds between elements, add
pace or emotion.
COLOUR
100% yellow
100% yellow
20% black
100% yellow
50% black
100% yellow
80% black
80% yellow 70% yellow 50% yellow
RESTRAINT &
REDUCTION
Constructing immediate meaning
through economy of use.
RESTRAINT & REDUCTION
PLAY
PERSONALITY
SELF-EXPRESSION
COURAGE &
CONVICTION
THANKS
Simon Collison
@simoncollison colly.com
Design To Communicate
Design To Communicate
Design To Communicate
Design To Communicate
Design To Communicate
Design To Communicate
Design To Communicate
Design To Communicate
Design To Communicate
Design To Communicate
Design To Communicate
Design To Communicate
Design To Communicate
Design To Communicate
Design To Communicate
Design To Communicate
Upcoming SlideShare
Loading in...5
×

Design To Communicate

4,397

Published on

As designers, we manipulate all that is available to us, aiming to present ideas in a visually engaging form. But what are our motives, and why do we go in a particular direction? Why do great designers have the courage to do things a certain way, and succeed?

Simon will explore how web designers can improve their thought processes by stepping away from the browser, and in turn bring clearer, well-reasoned thinking back into their work. He’ll introduce established and new ways of thinking, and key points of influence that can assist with any web design process.

Published in: Design
1 Comment
25 Likes
Statistics
Notes
No Downloads
Views
Total Views
4,397
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
517
Comments
1
Likes
25
Embeds 0
No embeds

No notes for slide

Transcript of "Design To Communicate"

  1. 1. DESIGN TO COMMUNICATE Simon Collison DIBI, Gateshead, April 2010 @simoncollison colly.com
  2. 2. This presentation is about starting points... DESIGN SQUARE ONE
  3. 3. This presentation is not about... HTML & CSS JQUERY PHOTOSHOPbecause these are just enablers
  4. 4. 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
  5. 5. VISUAL GRAMMAR
  6. 6. BALANCE COMPOSITION SYMMETRY MOVEMENT RHYTHM REPETITION PATTERNS
  7. 7. MENTAL MODELS
  8. 8. The models people have of themselves, others, the environment, and the things with which they interact. MENTAL MODELS
  9. 9. Environment Experience Others Me Instruction Interaction
  10. 10. MAPPING
  11. 11. The relationship between two things. Natural mapping leads to immediate understanding. MAPPING
  12. 12. Control Outcome
  13. 13. UnderstandingControl Outcome
  14. 14. SYSTEMS
  15. 15. We don’t design web pages. We design systems. ANDY CLARKE
  16. 16. MOTIVE
  17. 17. What are our motives, and why do we go in one particular direction? MOTIVE
  18. 18. NOSTALGIA
  19. 19. A longing for the past, or the ephemera of the olden days, and the sense that everything was better than it is today. NOSTALGIA
  20. 20. RHETORIC
  21. 21. The art of using language effectively in order to persuade. RHETORIC
  22. 22. VERNACULAR
  23. 23. The everyday language through which a group, community or regional area communicates. VERNACULAR
  24. 24. HUMOUR
  25. 25. The opportunity to present and exploit wit in order to communicate meaning. HUMOUR
  26. 26. SEMIOTICS
  27. 27. The study of signs offering an explanation of how people extract meaning from words, sounds and images. SEMIOTICS
  28. 28. Symbol Icon Index
  29. 29. TYPOGRAPHY
  30. 30. By using typography we give a written idea a visual form. TYPOGRAPHY
  31. 31. COLOUR
  32. 32. Colour can bring designs to life, inform hierarchies, create bonds between elements, add pace or emotion. COLOUR
  33. 33. 100% yellow 100% yellow 20% black 100% yellow 50% black 100% yellow 80% black 80% yellow 70% yellow 50% yellow
  34. 34. RESTRAINT & REDUCTION
  35. 35. Constructing immediate meaning through economy of use. RESTRAINT & REDUCTION
  36. 36. PLAY PERSONALITY SELF-EXPRESSION
  37. 37. COURAGE & CONVICTION
  38. 38. THANKS Simon Collison @simoncollison colly.com
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×