Post on 17-Oct-2014
description
Pretty MobileHow to look good and why it matters
Thursday, May 23, 13
You’ll Learn
‣ How visuals support brand‣ Applying this to mobile‣ Making your apps better‣ The importance of icons
Please consider sharing!
Thursday, May 23, 13
Pay AttentionWhat do you think of these apps?
Thursday, May 23, 13
Thursday, May 23, 13
Thursday, May 23, 13
which...
stood out as good? bad?
Thursday, May 23, 13
worth $1b?
Thursday, May 23, 13
homemade?
Thursday, May 23, 13
for geeks?
Thursday, May 23, 13
why?
Thursday, May 23, 13
sorry... i lied
24 judgement calls in 7 second
‣ money
‣ education
‣ interesting
‣ etc.
Thursday, May 23, 13
what’s your brand?
professional
large
exciting
useful
grass roots
funeasy
personal
corporate
full featured
relaxing
Thursday, May 23, 13
your samples?
send:
‣ screenshot or wireframe
‣ 3 phrases to describe your brand
‣ brand inspiration (optional)
to: jess@gravityswitch.com
Thursday, May 23, 13
A Little About You
Thursday, May 23, 13
why’d ya come?
Existing App
New App
Thursday, May 23, 13
$0.00
$.99 - $2.99
$3.99 - $9.99
$9.99+
other (internal app)
pricing
$
$
$
?
Free!
$
$$
Thursday, May 23, 13
company size
lone gunslinger
2-10 employees/partners
11-100 employees
100+ employees
Thursday, May 23, 13
Thursday, May 23, 13
your superpower?
programming
design
usability
other
Thursday, May 23, 13
crayons
use Photoshop well
design 5 color pallets from this:
win awards for graphic design
design experience
Thursday, May 23, 13
A Little About MeFor perspective...
Thursday, May 23, 13
I’m a Hard-Ass
Thursday, May 23, 13
Thursday, May 23, 13
Thursday, May 23, 13
We make cool stuff with cool people.
Thursday, May 23, 13
Web. Mobile. Marketing. Strategy. Teaching.
Thursday, May 23, 13
You should also know
Thursday, May 23, 13
Artists Critique Art
Thursday, May 23, 13
It’s more fun to do great things
Thursday, May 23, 13
What is Visual Brand?Hint: not a style guide
Thursday, May 23, 13
Articulating Brand
Thursday, May 23, 13
(Most) Style Guides are Dumb
55 pages!
Thursday, May 23, 13
Please Don’t Ever do This
Thursday, May 23, 13
Mood Board / Style Tile
Thursday, May 23, 13
Mood Board / Style Tile
Thursday, May 23, 13
Thursday, May 23, 13
Thursday, May 23, 13
Try One
Find:PostersPicturesFontsColors
Thursday, May 23, 13
Remember
It doesn’t matter if you like it
It doesn’t matter if your boss likes it
It matters if it works!
Thursday, May 23, 13
Design ElementsFonts, colors, menus & navigation
Thursday, May 23, 13
FontsHow to choose
Thursday, May 23, 13
serif = conservative
Thursday, May 23, 13
serif = conservative sans-serif = modern
Thursday, May 23, 13
when in doubt...
easy to read small
more common (digitally)
... use sans-serif.
Thursday, May 23, 13
Strange Fonts are Hard
Thursday, May 23, 13
What else to know
‣ Buy your fonts
‣ 3 fonts MAXIMUM
‣ S p a c i n g matters
‣ Android still limited... but
Thursday, May 23, 13
you can’t go wrong with helvetica roboto
source: theunderstatement.com
Thursday, May 23, 13
Got Style?Menus & navigation
Thursday, May 23, 13
main menu
Thursday, May 23, 13
main menu
Thursday, May 23, 13
main menu
Thursday, May 23, 13
iPhone Vs. Android
Thursday, May 23, 13
main menu
Thursday, May 23, 13
colored navigation
Thursday, May 23, 13
Color Matters
Thursday, May 23, 13
Colors are HARD
2 years of Focused Practice
Thursday, May 23, 13
A Good Color Palette Has...
5-7 Colors
2 that stand out
3-5 that are related
Thursday, May 23, 13
Shortcut 1: Online
colorblender.com
Thursday, May 23, 13
Shortcut 2: From a Picture
Thursday, May 23, 13
Shortcut 2: From a Picture
Thursday, May 23, 13
What Else to Know
Thursday, May 23, 13
What Else to Know
‣ Match your saturation level
Thursday, May 23, 13
What Else to Know
‣ Match your saturation level
‣ More saturation isn’t better
Thursday, May 23, 13
What Else to Know
‣ Match your saturation level
‣ More saturation isn’t better
‣ Contrast is eye-catching
Thursday, May 23, 13
What Else to Know
‣ Match your saturation level
‣ More saturation isn’t better
‣ Contrast is eye-catching
‣ Too much contrast = a Kmart flier
Thursday, May 23, 13
TipsFrom the masters
Thursday, May 23, 13
If you haven’t gone too far...... You haven’t done your job.
Thursday, May 23, 13
Consider wireframes
Less to think about
Good/Bad
Thursday, May 23, 13
Thursday, May 23, 13
Rules of Thumb
‣ Cartoons don’t work
‣ Don’t use clipart (other than icons)
‣ Know if you want to stand out,
or catch up
‣ Discard 3 effects before shipping
Thursday, May 23, 13
Hiring a designer
2 hours
5-10 people
Pay them for their time
Mood Boards and Designs
You’ll know who to work with
Thursday, May 23, 13
Good/Bad Designer
Thursday, May 23, 13
Good/Bad Designer
What do you like?
Thursday, May 23, 13
Good/Bad Designer
What do you like?
What do you want people to feel?
Thursday, May 23, 13
Good/Bad Designer
What do you like?
What do you want people to feel?
Do I have to use your logo?
Thursday, May 23, 13
Good/Bad Designer
What do you like?
What do you want people to feel?
Do I have to use your logo?
What color should it be?
Thursday, May 23, 13
Good/Bad Designer
What do you like?
What do you want people to feel?
Do I have to use your logo?
What color should it be?
Is there a style guide to be aware of?
Thursday, May 23, 13
Good/Bad Designer
What do you like?
What do you want people to feel?
Do I have to use your logo?
What color should it be?
Is there a style guide to be aware of?
I’ll make you a style guide first.
Thursday, May 23, 13
Good/Bad Designer
What do you like?
What do you want people to feel?
Do I have to use your logo?
What color should it be?
Is there a style guide to be aware of?
I’ll make you a style guide first.
I’ll start with mood boards
Thursday, May 23, 13
The Golden Rule
If you can’t tell what you changed in the
past 10 minutes, it’s time to stop
working.
Christine Mark
Thursday, May 23, 13
Critiquescritiques are about being critical
jason@gravityswitch.com
Thursday, May 23, 13
Iconswhat can we learn from logos
Thursday, May 23, 13
Hiring a designer
2 hours
5-10 people
Pay them for their time
Mood Boards and Designs
You’ll know who to work with
Thursday, May 23, 13
What’s the Difference?
Thursday, May 23, 13
There’s Also These
Thursday, May 23, 13
Icons Should Be Iconic
don’t tell a story
one idea only
simple shapes
don’t overdo it
Thursday, May 23, 13
Icon Critiquesjason@gravityswitch.com
Thursday, May 23, 13
What is Brand?other than a word designers use to charge
more money...
Thursday, May 23, 13
brand = emotionsnot a logo
Thursday, May 23, 13
what does your app
in 140 characters
Thursday, May 23, 13
who uses it?
in 140 characters
Thursday, May 23, 13
what should users feel?
national brands
what emotions?
what expectations do they have?
Thursday, May 23, 13
What did Jessica do?look at some samples
Thursday, May 23, 13
Ask Me Questions
http://gravityswitch.com/andevconjason@gravityswitch.com@jasonNmark
eBooks (Thursday 8:30)
Thursday, May 23, 13