dead simple design 3 - for web designers
DESCRIPTION
Presented live at Joomla Chicago meetup for web designers, Dead Simple Web Design 3 focuses on helping web designers keep focused on simplicity, in an ever-increasing complex task, designing websites and apps.TRANSCRIPT
Dead Simple Web Design 3
Confessions of a Forty-something Design Guy Living In a Hipster World.
!
John Coonen
The FINAL
>
“Everything should be made
as simple as possible, but not simpler.”
Albert Einstein
But First… !
Let’s introduce you to various creative types: fine artists, graphic artists,
graphic designers and you: web designers
!
…
Fine Artists: They create works to
please themselves.
Commercial Artists:They create works toplease their clients.
Graphic Artists:crossover fine/commercial artists,
with a bigger mortgage to pay.
Graphic Designers:are graphic artists, with
a serious case of OCD
Web Designers:are a mix of all that, plus code!
Which means…
…We are seriously messed up.
So, if designers werewere personified
by dogs…
Fine Artist: A Breed Apart
Graphic Artist: Everyone’s Favorite
Graphic Designer: Perfect Showdog
Web Designer: The All-Purpose Mutt
Web Designers are today’s design, code & project
management pros;Jacks & Jills of all trades,
and masters of none.
The way to stay within your skillset, and keep customers
coming back is through “dead-simple design.”
“Graphic design is a creative process that combines art
and technology to communicate
ideas.”
-AIGA
Dead-simple design delivers maximum information with a minimalistic style.
“I didn’t have time to write a
short letter,
Mark Twainso I wrote a long
one instead.”
Dead-simple design: !
Communicates Engages Clarifies
Economizes
to MOVE the User Along
Design is not User Experience, but design
helps dictate UX.
This is NOT Dead-simple design:
Neither is this:
But this is:
There’s dead-simple, and there’s
dead on arrival…
(OK, take a deep cleansing breath)
God likes things simple for us.
He said:
“Just follow these ten simple rules.”
!- God
But did we listen?
“OMG. That’s not so good.”
“Only TEN Laws? It can’t be that simple.We need MORE!”
IF/AND/THEN:
IF90% of communication
is non-verbal,
ANDDesign is non-verbal,
THENyou can communicate
90% better through great design.
we may be living
!
!
!
in a hipster world
but don’t worry, most hipsters
can’t design either.
butnow, you can too!
These dead-simple design techniques & tools will
have you designing like a hipster in no time.
!
• Don’t use more than 2 fonts or variations
• Don’t break the grid
• Don’t let your client dictate design
• Don’t view templates first
• Write first
• Embrace the grid
• Coordinate colors
• Use paper & pencil
• Use Photoshop or Fireworks
Do This. Not That.hipster approved
!
• Don’t ignore accessibility
• Don’t forget to “kern” headlines ;)
• Don’t mix design styles, no matter how tempting
• Embrace photos
• Choose classic fonts
• More line space!
• Be consistent
• Hire a designer (seriously)
Do This. Not That.hipster approved
Also:
• Make the point early
• Know the rules before you break them
• Focus on benefits, not features
• Be reserved in your art direction ;)
hipster approved
• Edit, edit, edit
• Question every step, remove if unsure
• Check final against goals
• Get input before going live
• Show it to a 5th grader
hipster approved
Read up onSaul Bass & Paul Rand,
kings of dead-simple design.
hipster approved
Saul BassSaul Bass
Paul Rand
“Simplicity is not the goal. It is the by-product of a good idea and
modest expectations.”
Paul Rand
These design resources
will give you a head start:
hipster approved
RocketTheme YooTheme JoomlArt
ThemeXpert Gavick
Bang2Joom
hipster approved
PHOTOS:
Veer flickr
Instagram Getty
Jupiter
hipster approved
INSPIRATION:
Smashing Mag Dribbble Envato
CSS Tricks ShayHowe.com
!
hipster approved
hipster approved
DIY DESIGN:
And Finally,My “Never Evers”!
• Never Ever: estimate under 40 hours to create a website or app
• Never Ever: estimate under 60 hours to fix someone else’s
CREDITS: !
Bass, Saul Budweiser
Canter, Mitch Dannaway, Adham Da Vinci, Leonardo
Einstein, Albert Fairey, Shepard
!God
King, Phil Lautrec, Henri de Toulouse
Leroyer, Philippe Levie, Aaron
Matisse, Henri Miedaner, Eke Miller, Alyssa
Miller, J. Howard Monet, Claude
Petrovski, Vase Rand, Paul
Rebsch, Sadi Roscover, Dylan
Twain, Mark Warhol, Andy
Williams, Sean
Logos & brilliant quotation Budweiser poster Clever tweets Web design / Coder iIllustration The Mona Lisa Quotation, the e=mc2 thing & crazy hair Smashing Pumpkins album cover Obama Hope poster 10 Commandments, plus like, everything Sweet mutt photo 7 Dance at the Moulin Rouge Wicked tattoo artist CEO of Box, smart Tweet on UX Isn’t in this. I just like Henri. Photo of the “fine artist” dog “Rafa” the Golden Retriever portrait “We Can Do It!” poster Monet Reading The Newspaper Wizenheimer photo Quotation & awesome logos Typography poster with Super Mario Steve Jobs illustration Quotation + great sense of humor First “selfie” ever Bob Marley poster
Contact Info: !!
John Coonen Partner, Coffee Group Inc
http://coffeegroup.us @CoffeeGroup
!