Your SlideShare is downloading. ×
the importance of Great Design

why design is so important &
tips for designing well




JARED PONCHOT * DRUPAL DESIGN CAM...
Jared Ponchot of Lullabot
Jared Ponchot of Lullabot
Jared Ponchot of Lullabot
Making the world work beautifully
Making the world work beautifully

‣   What is design?
Making the world work beautifully

‣   What is design?
‣   Why is design so important?
Making the world work beautifully

‣   What is design?
‣   Why is design so important?
‣   How does one produce GREAT desi...
Fun with semantics
Fun with semantics

because words mean things!
Design is NOT
Design is NOT

‣   Proficiency with Adobe’s Creative Suite
Design is NOT

‣   Proficiency with Adobe’s Creative Suite
‣   Proficiency with CSS
Design is NOT

‣   Proficiency with Adobe’s Creative Suite
‣   Proficiency with CSS
‣   Awareness of Helvetica Neue
Design is NOT

‣   Proficiency with Adobe’s Creative Suite
‣   Proficiency with CSS
‣   Awareness of Helvetica Neue
‣   Si...
Design is NOT

‣   Proficiency with Adobe’s Creative Suite
‣   Proficiency with CSS
‣   Awareness of Helvetica Neue
‣   Si...
The difference between a Designer and Developer,
when it comes to design skills, is the difference
between shooting a bull...
What is design?

According to wikipedia, “Design is the planning
that lays the basis for the making of every object
or sys...
Or . . .

According to wikipedia, “Graphic design is a
collaborative process between a client and a
designer — in conjunct...
Design is the conscious effort to
impose a meaningful order.




                                    - VICTOR PAPANEK
Design is not just what it looks like and feels like.
Design is how it works.




                                        ...
Design is problem solving.

But wait, there’s more. Problem solving requires
knowing your problem!

Design is the diagnosi...
Solve problems, don’t create them
Jared’s profound conclusion

Design is one tiny part decoration and several
giant parts problem assessment and solution.
N...
One more semantic thing

Theming is simply the technical implementation
of visual design. You do not need to be a designer...
Why is GREAT design so important?
Why is GREAT design so important?

‣   Great design yields meaningful communication.
Why is GREAT design so important?

‣   Great design yields meaningful communication.
‣   Great design truly solves problem...
Why is GREAT design so important?

‣   Great design yields meaningful communication.
‣   Great design truly solves problem...
Also, BAD design can be deadly
Or at least make people uncomfortable
Questions about whether design is necessary or
affordable are quite beside the point: design is
inevitable. The alternativ...
A case study in design importance

 mp3 player 1   vs.   mp3 player 2
1st mp3 Player in the US Market!

                   Diamond Rio PMP300
                   November 1998
Meet the competition (a few years late to the party)

                          Apple iPod
                          Octob...
And the winner is?

Diamond Rio advantages:
‣ Longer battery life


‣ More Storage


‣ Able to play more formats


‣ First...
Design is strategic, and impeccably designed
systems, products, and services are really all that
separate one organization...
Great design for Apple meant
Great design for Apple meant

‣   A name change (no longer Apple Computer)
Great design for Apple meant

‣   A name change (no longer Apple Computer)
‣   Became the #1 music retailer in the world
 ...
Great design for Apple meant

‣   A name change (no longer Apple Computer)
‣   Became the #1 music retailer in the world
 ...
Great design for Apple meant

‣   A name change (no longer Apple Computer)
‣   Became the #1 music retailer in the world
 ...
Great design for Apple meant

‣   A name change (no longer Apple Computer)
‣   Became the #1 music retailer in the world
 ...
Great design excites people

Advocacy is the key indicator of long term
customer value and retention.


                  ...
Quick Summary
Quick Summary

‣   Design is part beautification, but MOSTLY
    problem discovery and problem solving.
Quick Summary

‣   Design is part beautification, but MOSTLY
    problem discovery and problem solving.
‣   Great design c...
How to produce GREAT design?

Jared’s not-so-pantented, largely appropriated,
borrowed, learned, and sometimes stolen tips...
How to produce GREAT design?
How to produce GREAT design?

In 7 Easy Steps
How to produce GREAT design?

In 7 Easy Steps
‣ Steal . . . I mean get inspired (or at least influenced)
How to produce GREAT design?

In 7 Easy Steps
‣ Steal . . . I mean get inspired (or at least influenced)


‣ Visual Hierar...
How to produce GREAT design?

In 7 Easy Steps
‣ Steal . . . I mean get inspired (or at least influenced)


‣ Visual Hierar...
How to produce GREAT design?

In 7 Easy Steps
‣ Steal . . . I mean get inspired (or at least influenced)


‣ Visual Hierar...
How to produce GREAT design?

In 7 Easy Steps
‣ Steal . . . I mean get inspired (or at least influenced)


‣ Visual Hierar...
How to produce GREAT design?

In 7 Easy Steps
‣ Steal . . . I mean get inspired (or at least influenced)


‣ Visual Hierar...
How to produce GREAT design?

In 7 Easy Steps
‣ Steal . . . I mean get inspired (or at least influenced)


‣ Visual Hierar...
A thief is only as good as his loot

Steal from the best
Recreate the masters

Just as painters learn by doing “studies” or
reproductions of master works, so should you!




Bougu...
Ok, so don’t actually steal, but . . .

You don’t need to reinvent the wheel!
If design is essentially problem solving, an...
Unique solutions are often
 NOTthe best solutions
Don’t worry about people stealing your design work.
Worry about when they stop.




                                      ...
So what am I advocating?

‣   Study
‣   Be Influenced
‣   Find Inspiration
Visual Hierarchy - Easy as 1, 2, 3

Visual hierarchy is the emphasis and classification of
elements according to a) relati...
Start with the right questions
Start with the right questions

‣   Who will use what I’m designing?
Start with the right questions

‣   Who will use what I’m designing?
‣   What will they want to do with it?
Start with the right questions

‣   Who will use what I’m designing?
‣   What will they want to do with it?
‣   What will ...
Design before you design

This isn’t rocket surgery.
‣   Evaluate & organize Drupal entities
    ‣   FEATURES
         ‣ N...
Fundamentals of Design & Visual Hierarcy
Fundamentals of Design & Visual Hierarcy

‣   proportion
Fundamentals of Design & Visual Hierarcy

‣   proportion
‣   proximity
Fundamentals of Design & Visual Hierarcy

‣   proportion
‣   proximity
‣   position
Fundamentals of Design & Visual Hierarcy

‣   proportion
‣   proximity
‣   position
‣   alignment
Fundamentals of Design & Visual Hierarcy

‣   proportion
‣   proximity
‣   position
‣   alignment
‣   contrast
Fundamentals of Design & Visual Hierarcy

‣   proportion
‣   proximity
‣   position
‣   alignment
‣   contrast
‣   color
Proportion & Visual Importance


    2



                   1
    3
Proximity & Visual Relationships
Position & Visual Importance


    1




    2          3
Alignment & Relationships
Contrast
Color & Visual Importance

‣   Warm colors stand out
‣   Cool colors recede
Basic color theory tip

Create nice color palettes by:
‣ Letting others do it for you


‣ Choose a color and find somethin...
Nifty visual hierarchy trick
Nifty visual hierarchy trick
beautiful geometry

The nature of proportions & grid systems
the Golden Section Rectangle
simple 3 by 3 grid
Less is less. Less is better.

Jason Fried coined the phrase “less is less”
because he said that less is more "implies tha...
Any intelligent fool can make things bigger and
more complex . . . It takes a touch of genius - and a lot
of courage to mo...
Perfection is achieved, not when there is nothing more
to add, but when there is nothing left to take away




           ...
That’s all I’ll say about simplicity
Practice makes perfect

Don’t be afraid to keep working
Every creator painfully experiences the chasm
between his inner vision and its ultimate expression.




                  ...
Be consistently ok & occasionally great

Consistently CREATE ok designs
Consistently SHOW the occasional great ones
Also k...
The best design tool is a long eraser
with a pencil at one end.




                                        - MARTY NEUMEI...
Creative Pause

Stop, take a break, do something fun, move on to
something else!
The ‘creative pause’ is defined as the time interval
which begins when the thinker interrupts conscious
preoccupation with...
Even if it keeps you up all night, wash down the walls and scrub the oor of your study
before composing a syllable.

Clean...
Summary before the finale

‣   Stealing (study, influence, & inspiration)
‣   Visual Hierarchy
‣   Proportions & Grid Syst...
Great Expectations: Self & Others
Great Expectations: Self & Others

‣   Expect great things from yourself.
Great Expectations: Self & Others

‣   Expect great things from yourself.
‣   Surround yourself with people who expect you...
The Pygmalion effect

The Pygmalion effect, or Rosenthal effect, refers to
the phenomenon in which the greater the
expecta...
Great Expectations: Clients
Great Expectations: Clients

‣   Choose great clients
Great Expectations: Clients

‣   Choose great clients
‣   Never make the logo bigger
Great Expectations: Clients

‣   Choose great clients
‣   Never make the logo bigger
‣   Definitely don’t make it “pop”
To achieve great things, two things are needed: a plan,
and not quite enough time.




                                   ...
Good design is all about making other designers feel
like idiots because that idea wasn’t theirs.




                    ...
D4D Boston 2010: Great Design - Why It's Important and How to Achieve It
D4D Boston 2010: Great Design - Why It's Important and How to Achieve It
D4D Boston 2010: Great Design - Why It's Important and How to Achieve It
Upcoming SlideShare
Loading in...5
×

D4D Boston 2010: Great Design - Why It's Important and How to Achieve It

1,354

Published on

This presentation was given at Drupal Design Camp Boston 2010. It covers a brief definition of design, some examples of why it's so important, and some tips for how to produce great design.

This presentation was revised/improved/enhanced for DCATL so check that out here: http://www.slideshare.net/jponch/dcatl-2010-the-importance-of-great-design

Published in: Design
0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,354
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
0
Comments
0
Likes
3
Embeds 0
No embeds

No notes for slide
  • Fancy intro slide
  • I’m Jared Ponchot
    I work for Lullabot
    Lullabot is an awesome company that’s worked with lots of awesome clients
    You may know us from our videos
  • I’m Jared Ponchot
    I work for Lullabot
    Lullabot is an awesome company that’s worked with lots of awesome clients
    You may know us from our videos
  • I’m hoping to incompletely answer the following 3 questions
    - What is design?
    - Why is design so important?
    - How does one produce GREAT design?
    Why not talk specifically about Drupal?
  • I’m hoping to incompletely answer the following 3 questions
    - What is design?
    - Why is design so important?
    - How does one produce GREAT design?
    Why not talk specifically about Drupal?
  • I’m hoping to incompletely answer the following 3 questions
    - What is design?
    - Why is design so important?
    - How does one produce GREAT design?
    Why not talk specifically about Drupal?
  • lets start by defining design a bit
  • Let’s start with what design is NOT
    - Proficiency with Adobe’s Creative Suite
    - Proficiency with CSS
    - Awareness of Helvetica Neue
    - Simply liking Apple products
    - Drupal Theming
  • Let’s start with what design is NOT
    - Proficiency with Adobe’s Creative Suite
    - Proficiency with CSS
    - Awareness of Helvetica Neue
    - Simply liking Apple products
    - Drupal Theming
  • Let’s start with what design is NOT
    - Proficiency with Adobe’s Creative Suite
    - Proficiency with CSS
    - Awareness of Helvetica Neue
    - Simply liking Apple products
    - Drupal Theming
  • Let’s start with what design is NOT
    - Proficiency with Adobe’s Creative Suite
    - Proficiency with CSS
    - Awareness of Helvetica Neue
    - Simply liking Apple products
    - Drupal Theming
  • Let’s start with what design is NOT
    - Proficiency with Adobe’s Creative Suite
    - Proficiency with CSS
    - Awareness of Helvetica Neue
    - Simply liking Apple products
    - Drupal Theming
  • Scott Hanselman - incidentally a DEVELOPER not designer for Microsoft
  • These may or may not be that helpful
  • Ok so what about visual design?
  • I really like the way Victor Papanek put it
  • aesthetic is indeed part of it, but that it’s not JUST that.
  • - design professor used to say this all the time
  • It’s very easy to create problems rather than solving them
    - Common web UI problem example (multi select list)
  • So here’s my fabulous amalgam of definitions
  • And one more semantic thing
  • Now to the 2nd question, why is GREAT design so important?
    - meaningful communication
    - solves problems
    - creates great experiences
  • Now to the 2nd question, why is GREAT design so important?
    - meaningful communication
    - solves problems
    - creates great experiences
  • Now to the 2nd question, why is GREAT design so important?
    - meaningful communication
    - solves problems
    - creates great experiences
  • bad design can be deadly
  • or at least make people uncomfortable
  • Douglas Martin in book “Book Design” said . . .
  • So here’s a fun little true story that illustrates the importance of great design
    - One of these probably looks familiar
    - Anyone recognize or own mp3 player 1?
  • That’s the Diamond Rio PMP300
    - released in the US in November of 1998
    - first mp3 player released in US
  • Nearly 3 years later in October of 2001 Apple introduced it’s hokey rip-off of the Diamond Rio
  • In a head to head of what both products had at the time of their release, the Diamond Rio takes the cake.
  • So what’s the big difference between the two?
  • Apple made out pretty well in spite of coming late to market with a seemingly inferior product if you just stack up the features.
  • Apple made out pretty well in spite of coming late to market with a seemingly inferior product if you just stack up the features.
  • Apple made out pretty well in spite of coming late to market with a seemingly inferior product if you just stack up the features.
  • Apple made out pretty well in spite of coming late to market with a seemingly inferior product if you just stack up the features.
  • Apple made out pretty well in spite of coming late to market with a seemingly inferior product if you just stack up the features.
  • Another reason great design is SO important is that it gets people excited about things. Will Tschumy is actually Microsoft’s UX Evangelist for the western US.
  • So let’s sum up what we’ve covered so far
  • So let’s sum up what we’ve covered so far
  • And now onto the really good stuff, my tips and advice for how to produce GREAT design
  • - 7 key concepts that are important to me
    - I preach these to myself regularly
    - going to rush through these but at least introduce
  • - 7 key concepts that are important to me
    - I preach these to myself regularly
    - going to rush through these but at least introduce
  • - 7 key concepts that are important to me
    - I preach these to myself regularly
    - going to rush through these but at least introduce
  • - 7 key concepts that are important to me
    - I preach these to myself regularly
    - going to rush through these but at least introduce
  • - 7 key concepts that are important to me
    - I preach these to myself regularly
    - going to rush through these but at least introduce
  • - 7 key concepts that are important to me
    - I preach these to myself regularly
    - going to rush through these but at least introduce
  • - 7 key concepts that are important to me
    - I preach these to myself regularly
    - going to rush through these but at least introduce
  • - 7 key concepts that are important to me
    - I preach these to myself regularly
    - going to rush through these but at least introduce
  • - favorite design professor’s saying
    - What was he really saying?
  • - wife is a painter and an extremely good one.
    - These two paintings were some early paintings she did.
    - She LOVED Bouguereau and decided if she wanted to be able to paint like him she should try to do some of his paintings.
  • - not advocating plagiarism
    - am encouraging to not be afraid you’re not always unique

  • Unique is not always better!
  • - last little point on stealing
  • - Study
    - Cameron Moll “Influence is borrowed, inspiration is earned”
    - Stay current with things that are great influences
    - Be a person who has an eye for inspiration
  • Ok, so now that you know it’s ok to steal, let’s move on to some practical design training. Visual Hierarchy!
  • In order to achieve great visual hierarchy you’ll want to make sure you understand the problem you’re trying to solve
    Here are a few questions to ask at the beginning of this process
  • In order to achieve great visual hierarchy you’ll want to make sure you understand the problem you’re trying to solve
    Here are a few questions to ask at the beginning of this process
  • In order to achieve great visual hierarchy you’ll want to make sure you understand the problem you’re trying to solve
    Here are a few questions to ask at the beginning of this process
  • As it relates to Drupal, here’s some other pointers as to where to start
  • Ok, now some fundamentals
    There are a lot of ways to create visual hierarchy, so here are some very fundamental principles I’ll cover quickly
    I’m going to blaze through these and take some questions at the end
  • Ok, now some fundamentals
    There are a lot of ways to create visual hierarchy, so here are some very fundamental principles I’ll cover quickly
    I’m going to blaze through these and take some questions at the end
  • Ok, now some fundamentals
    There are a lot of ways to create visual hierarchy, so here are some very fundamental principles I’ll cover quickly
    I’m going to blaze through these and take some questions at the end
  • Ok, now some fundamentals
    There are a lot of ways to create visual hierarchy, so here are some very fundamental principles I’ll cover quickly
    I’m going to blaze through these and take some questions at the end
  • Ok, now some fundamentals
    There are a lot of ways to create visual hierarchy, so here are some very fundamental principles I’ll cover quickly
    I’m going to blaze through these and take some questions at the end
  • Ok, now some fundamentals
    There are a lot of ways to create visual hierarchy, so here are some very fundamental principles I’ll cover quickly
    I’m going to blaze through these and take some questions at the end
  • Proportion is a great and obvious way to achieve visual importance
  • proximity creates relationships
  • The eye (at least in the west) naturally reads left to right and top to bottom
  • Alignment also creates relationships (as well as beauty)
  • Contrast creates visual importance
  • Some basic color principles are that warm colors move toward the viewer and cool colors move away from the viewer
  • Another note on creating nice color palettes:
    there are some great color palette books and websites
    when in doubt, choose a color you like and find its complement
  • And finally, a nice trick for evaluating visual hierarch is the blur trick. You can do this with physical products or with web designs to get a better feel for what the eye is drawn to and what the visual hierarchy is
  • As you blur it the differences in visual hierarchy become even more apparent
    btw - this was ripped directly from Cameron Moll and a talk he gave in which he discusses visual hierarchy
  • Now this next topic always gets me excited and I could have spent hours on end assembling a huge examples list but I’m going to cover it quickly here
  • How many here are familiar with the Golden Section?
    Also called the Golden Ratio
    You see it in nature
    It’s an irrational mathematical constant
  • You’ll find that all sorts of products are designed by designers who love the Golden Section
  • Grid systems in general can be extremely helpful!
    Proportioning systems create beauty in design

  • Jason Fried is always good for an opinion and occasionally they really ring home with me.
  • Albert Einstein said it pretty well too
  • Less is less is pretty easy to understand

  • anything more is just unnecessary
    I did think that it would be really hilarious though to give like an hour long talk on less is less
  • One thing I preach to myself all the time is to keep working even when I don’t like the designs I’m creating, just keep working on it.
  • The writer Isaac Bashevis Singer talks about the chasm between your inner vision and that moment when you finally start to get it out
  • So here’s one of my personal mottos
  • remember, the best design tool is a long eraser with a pencil at one end
  • Of course, sometimes you just have to stop.
  • Cameron Moll, a designer I love and follow quite a bit, has written and talked a lot about Creative Pause recently and he shared this quote by a guy who I can’t pronounce his name.
  • Creative pause for me often involves doing something to clear my head
    I can usually only SLIGHTLY get whatever problem I’m trying to solve out and often I return with new vigor or new ideas.
    Cameron Moll talks about showering as being his great creative pause
    For me it’s cleaning, or taking a walk
    Billy Collins is one of my favorite poets and I just have to read you this poem he wrote called “Advice to Writers” because it speaks to the importance of having creative pause and a neat and tidy environment which I’m also addicted to

  • Great Expectations
    My favorite college professor wasn’t a design professor, but actually a professor I had in a drawing class. He was my favorite professor because he expected great things out of his students and he had a knack for making them believe that could do great things
    This is CRITICAL!
    If you’re in an environment where the people you work for or with expect and ask for mediocrity you need to get out!
  • Great Expectations
    My favorite college professor wasn’t a design professor, but actually a professor I had in a drawing class. He was my favorite professor because he expected great things out of his students and he had a knack for making them believe that could do great things
    This is CRITICAL!
    If you’re in an environment where the people you work for or with expect and ask for mediocrity you need to get out!
  • Anyone familiar with the Pygmalion effect?
    I’ve consistently found this to be true
  • This also applies to your clients
    A few tips here:
  • This also applies to your clients
    A few tips here:
  • This also applies to your clients
    A few tips here:
  • This is random and didn’t fit one of my 7 points very well, but it’s SO true
    Constraints are good - don’t kill yourself trying to avoid or eliminate them
  • And remember
    Questions?
  • Transcript of "D4D Boston 2010: Great Design - Why It's Important and How to Achieve It"

    1. 1. the importance of Great Design why design is so important & tips for designing well JARED PONCHOT * DRUPAL DESIGN CAMP BOSTON 2010
    2. 2. Jared Ponchot of Lullabot
    3. 3. Jared Ponchot of Lullabot
    4. 4. Jared Ponchot of Lullabot
    5. 5. Making the world work beautifully
    6. 6. Making the world work beautifully ‣ What is design?
    7. 7. Making the world work beautifully ‣ What is design? ‣ Why is design so important?
    8. 8. Making the world work beautifully ‣ What is design? ‣ Why is design so important? ‣ How does one produce GREAT design?
    9. 9. Fun with semantics
    10. 10. Fun with semantics because words mean things!
    11. 11. Design is NOT
    12. 12. Design is NOT ‣ Proficiency with Adobe’s Creative Suite
    13. 13. Design is NOT ‣ Proficiency with Adobe’s Creative Suite ‣ Proficiency with CSS
    14. 14. Design is NOT ‣ Proficiency with Adobe’s Creative Suite ‣ Proficiency with CSS ‣ Awareness of Helvetica Neue
    15. 15. Design is NOT ‣ Proficiency with Adobe’s Creative Suite ‣ Proficiency with CSS ‣ Awareness of Helvetica Neue ‣ Simply liking Apple products
    16. 16. Design is NOT ‣ Proficiency with Adobe’s Creative Suite ‣ Proficiency with CSS ‣ Awareness of Helvetica Neue ‣ Simply liking Apple products ‣ Theming
    17. 17. The difference between a Designer and Developer, when it comes to design skills, is the difference between shooting a bullet and throwing it. - SCOTT HANSELMAN
    18. 18. What is design? According to wikipedia, “Design is the planning that lays the basis for the making of every object or system.” - WIKIPEDIA.ORG
    19. 19. Or . . . According to wikipedia, “Graphic design is a collaborative process between a client and a designer — in conjunction with producers of form — to convey a specific message to a targeted audience. The term "graphic design" can also refer to a number of artistic and professional disciplines that focus on visual communication and presentation.” - WIKIPEDIA.ORG
    20. 20. Design is the conscious effort to impose a meaningful order. - VICTOR PAPANEK
    21. 21. Design is not just what it looks like and feels like. Design is how it works. - STEVE JOBS
    22. 22. Design is problem solving. But wait, there’s more. Problem solving requires knowing your problem! Design is the diagnosis and solving of problems.
    23. 23. Solve problems, don’t create them
    24. 24. Jared’s profound conclusion Design is one tiny part decoration and several giant parts problem assessment and solution. Notice I didn’t even mention PhotoShop
    25. 25. One more semantic thing Theming is simply the technical implementation of visual design. You do not need to be a designer to be a themer, but you’ll probably want a design before you start theming.
    26. 26. Why is GREAT design so important?
    27. 27. Why is GREAT design so important? ‣ Great design yields meaningful communication.
    28. 28. Why is GREAT design so important? ‣ Great design yields meaningful communication. ‣ Great design truly solves problems.
    29. 29. Why is GREAT design so important? ‣ Great design yields meaningful communication. ‣ Great design truly solves problems. ‣ Great design creates great experiences.
    30. 30. Also, BAD design can be deadly
    31. 31. Or at least make people uncomfortable
    32. 32. Questions about whether design is necessary or affordable are quite beside the point: design is inevitable. The alternative to good design is bad design, not no design at all. - DOUGLAS MARTIN
    33. 33. A case study in design importance mp3 player 1 vs. mp3 player 2
    34. 34. 1st mp3 Player in the US Market! Diamond Rio PMP300 November 1998
    35. 35. Meet the competition (a few years late to the party) Apple iPod October 2001
    36. 36. And the winner is? Diamond Rio advantages: ‣ Longer battery life ‣ More Storage ‣ Able to play more formats ‣ First to market (by almost 2 years) ‣ More functional
    37. 37. Design is strategic, and impeccably designed systems, products, and services are really all that separate one organization from another these days. Quality alone is not enough — a lot of people have good quality, right? Instead, the overall DESIGN of the "thing" must be so compelling that it serves as a key differentiator. - GARR REYNOLDS
    38. 38. Great design for Apple meant
    39. 39. Great design for Apple meant ‣ A name change (no longer Apple Computer)
    40. 40. Great design for Apple meant ‣ A name change (no longer Apple Computer) ‣ Became the #1 music retailer in the world (surpassing Walmart)
    41. 41. Great design for Apple meant ‣ A name change (no longer Apple Computer) ‣ Became the #1 music retailer in the world (surpassing Walmart) ‣ Approximately 80% of the mp3 player market
    42. 42. Great design for Apple meant ‣ A name change (no longer Apple Computer) ‣ Became the #1 music retailer in the world (surpassing Walmart) ‣ Approximately 80% of the mp3 player market ‣ Sold over 5 billion songs
    43. 43. Great design for Apple meant ‣ A name change (no longer Apple Computer) ‣ Became the #1 music retailer in the world (surpassing Walmart) ‣ Approximately 80% of the mp3 player market ‣ Sold over 5 billion songs ‣ Inspired several other revolutionary products (e.g. iPhone, iPad)
    44. 44. Great design excites people Advocacy is the key indicator of long term customer value and retention. - WILL TSCHUMY
    45. 45. Quick Summary
    46. 46. Quick Summary ‣ Design is part beautification, but MOSTLY problem discovery and problem solving.
    47. 47. Quick Summary ‣ Design is part beautification, but MOSTLY problem discovery and problem solving. ‣ Great design can help you knock Walmart down a peg or two.
    48. 48. How to produce GREAT design? Jared’s not-so-pantented, largely appropriated, borrowed, learned, and sometimes stolen tips and best practices for becoming a great designer
    49. 49. How to produce GREAT design?
    50. 50. How to produce GREAT design? In 7 Easy Steps
    51. 51. How to produce GREAT design? In 7 Easy Steps ‣ Steal . . . I mean get inspired (or at least influenced)
    52. 52. How to produce GREAT design? In 7 Easy Steps ‣ Steal . . . I mean get inspired (or at least influenced) ‣ Visual Hierarchy
    53. 53. How to produce GREAT design? In 7 Easy Steps ‣ Steal . . . I mean get inspired (or at least influenced) ‣ Visual Hierarchy ‣ Proportions & Grid Systems
    54. 54. How to produce GREAT design? In 7 Easy Steps ‣ Steal . . . I mean get inspired (or at least influenced) ‣ Visual Hierarchy ‣ Proportions & Grid Systems ‣ Less is Less
    55. 55. How to produce GREAT design? In 7 Easy Steps ‣ Steal . . . I mean get inspired (or at least influenced) ‣ Visual Hierarchy ‣ Proportions & Grid Systems ‣ Less is Less ‣ Consistency, Consistency, Repetition
    56. 56. How to produce GREAT design? In 7 Easy Steps ‣ Steal . . . I mean get inspired (or at least influenced) ‣ Visual Hierarchy ‣ Proportions & Grid Systems ‣ Less is Less ‣ Consistency, Consistency, Repetition ‣ Creative Pause
    57. 57. How to produce GREAT design? In 7 Easy Steps ‣ Steal . . . I mean get inspired (or at least influenced) ‣ Visual Hierarchy ‣ Proportions & Grid Systems ‣ Less is Less ‣ Consistency, Consistency, Repetition ‣ Creative Pause ‣ Great Expectations
    58. 58. A thief is only as good as his loot Steal from the best
    59. 59. Recreate the masters Just as painters learn by doing “studies” or reproductions of master works, so should you! Bouguereau reproductions painted by my wife
    60. 60. Ok, so don’t actually steal, but . . . You don’t need to reinvent the wheel! If design is essentially problem solving, and visual design visual problem solving, then why do we feel the urge to never solve the same problems in the same ways?
    61. 61. Unique solutions are often NOTthe best solutions
    62. 62. Don’t worry about people stealing your design work. Worry about when they stop. - JEFFERY ZELDMAN
    63. 63. So what am I advocating? ‣ Study ‣ Be Influenced ‣ Find Inspiration
    64. 64. Visual Hierarchy - Easy as 1, 2, 3 Visual hierarchy is the emphasis and classification of elements according to a) relative importance within the composition as a whole and b) parent, child, and sibling relationships. - CAMERON MOLL
    65. 65. Start with the right questions
    66. 66. Start with the right questions ‣ Who will use what I’m designing?
    67. 67. Start with the right questions ‣ Who will use what I’m designing? ‣ What will they want to do with it?
    68. 68. Start with the right questions ‣ Who will use what I’m designing? ‣ What will they want to do with it? ‣ What will I want them to do with it?
    69. 69. Design before you design This isn’t rocket surgery. ‣ Evaluate & organize Drupal entities ‣ FEATURES ‣ NODE TYPES ‣ CCK FIELDS ‣ VIEWS ‣ CONTEXTS ‣ ETC. ‣ Wireframe
    70. 70. Fundamentals of Design & Visual Hierarcy
    71. 71. Fundamentals of Design & Visual Hierarcy ‣ proportion
    72. 72. Fundamentals of Design & Visual Hierarcy ‣ proportion ‣ proximity
    73. 73. Fundamentals of Design & Visual Hierarcy ‣ proportion ‣ proximity ‣ position
    74. 74. Fundamentals of Design & Visual Hierarcy ‣ proportion ‣ proximity ‣ position ‣ alignment
    75. 75. Fundamentals of Design & Visual Hierarcy ‣ proportion ‣ proximity ‣ position ‣ alignment ‣ contrast
    76. 76. Fundamentals of Design & Visual Hierarcy ‣ proportion ‣ proximity ‣ position ‣ alignment ‣ contrast ‣ color
    77. 77. Proportion & Visual Importance 2 1 3
    78. 78. Proximity & Visual Relationships
    79. 79. Position & Visual Importance 1 2 3
    80. 80. Alignment & Relationships
    81. 81. Contrast
    82. 82. Color & Visual Importance ‣ Warm colors stand out ‣ Cool colors recede
    83. 83. Basic color theory tip Create nice color palettes by: ‣ Letting others do it for you ‣ Choose a color and find something in the neighborhood of it’s complement to go with it Complements reside opposite one another on the color wheel
    84. 84. Nifty visual hierarchy trick
    85. 85. Nifty visual hierarchy trick
    86. 86. beautiful geometry The nature of proportions & grid systems
    87. 87. the Golden Section Rectangle
    88. 88. simple 3 by 3 grid
    89. 89. Less is less. Less is better. Jason Fried coined the phrase “less is less” because he said that less is more "implies that more is better."
    90. 90. Any intelligent fool can make things bigger and more complex . . . It takes a touch of genius - and a lot of courage to move in the opposite direction. - ALBERT EINSTEIN
    91. 91. Perfection is achieved, not when there is nothing more to add, but when there is nothing left to take away - ANTOINE DE SAINT EXUPRY
    92. 92. That’s all I’ll say about simplicity
    93. 93. Practice makes perfect Don’t be afraid to keep working
    94. 94. Every creator painfully experiences the chasm between his inner vision and its ultimate expression. - ISAAC BASHEVIS SINGER
    95. 95. Be consistently ok & occasionally great Consistently CREATE ok designs Consistently SHOW the occasional great ones Also known as “Keep designing until it gets good”
    96. 96. The best design tool is a long eraser with a pencil at one end. - MARTY NEUMEIER
    97. 97. Creative Pause Stop, take a break, do something fun, move on to something else!
    98. 98. The ‘creative pause’ is defined as the time interval which begins when the thinker interrupts conscious preoccupation with an unsolved problem, and ends when the solution to the problem unexpectedly appears in consciousness. - INTERNATIONAL JOURNAL OF PSYCHOANALYSIS, PROFESSOR LAJOS SZÉKELY
    99. 99. Even if it keeps you up all night, wash down the walls and scrub the oor of your study before composing a syllable. Clean the place as if the Pope were on his way. Spotlessness is the niece of inspiration. The more you clean, the more brilliant your writing will be, so do not hesitate to take to the open elds to scour the undersides of rocks or swab in the dark forest upper branches, nests full of eggs. When you nd your way back home and stow the sponges and brushes under the sink, you will behold in the light of dawn the immaculate altar of your desk, a clean surface in the middle of a clean world. From a small vase, sparkling blue, lift a yellow pencil, the sharpest of the bouquet, and cover pages with tiny sentences like long rows of devoted ants that followed you in from the woods. - BILLY COLLINS from SAILING ALONE AROUND THE ROOM
    100. 100. Summary before the finale ‣ Stealing (study, influence, & inspiration) ‣ Visual Hierarchy ‣ Proportions & Grid Systems ‣ Less is Less ‣ Consistency, Consistency, Repetition ‣ Creative Pause
    101. 101. Great Expectations: Self & Others
    102. 102. Great Expectations: Self & Others ‣ Expect great things from yourself.
    103. 103. Great Expectations: Self & Others ‣ Expect great things from yourself. ‣ Surround yourself with people who expect you to be great.
    104. 104. The Pygmalion effect The Pygmalion effect, or Rosenthal effect, refers to the phenomenon in which the greater the expectation placed upon people, often children or students and employees, the better they perform.
    105. 105. Great Expectations: Clients
    106. 106. Great Expectations: Clients ‣ Choose great clients
    107. 107. Great Expectations: Clients ‣ Choose great clients ‣ Never make the logo bigger
    108. 108. Great Expectations: Clients ‣ Choose great clients ‣ Never make the logo bigger ‣ Definitely don’t make it “pop”
    109. 109. To achieve great things, two things are needed: a plan, and not quite enough time. - LEONARD BERNSTEIN
    110. 110. Good design is all about making other designers feel like idiots because that idea wasn’t theirs. - FRANK CHIMERO

    ×