5 Things Developers Need to Know About Design
-
date post
18-Oct-2014 -
Category
Design
-
view
3.066 -
download
0
description
Transcript of 5 Things Developers Need to Know About Design
![Page 1: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/1.jpg)
@PaulTrani
55
THINGS
Every Developer Needs to Know
ABOUT DESIGN
Monday, October 28, 13
![Page 2: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/2.jpg)
@PaulTrani
5
Paul TraniCreative Cloud Evangelist, Adobe17 years of making design mistakes4 year-old cleverly disguised as a reasonable adult
Monday, October 28, 13
![Page 3: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/3.jpg)
@PaulTrani
5
Why it matters...
Monday, October 28, 13
![Page 4: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/4.jpg)
@PaulTrani
5Research
www.jnd.org @PaulTraniMonday, October 28, 13
![Page 5: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/5.jpg)
@PaulTrani
5
Sexy?
Monday, October 28, 13
![Page 6: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/6.jpg)
@PaulTrani
5
Sexy!
Monday, October 28, 13
![Page 7: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/7.jpg)
@PaulTrani
155
Know that...
YOU’RE NOT A DESIGNER*
*But you are awesome and can fake it really well.Monday, October 28, 13
![Page 8: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/8.jpg)
@PaulTrani
5
Monday, October 28, 13
![Page 9: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/9.jpg)
@PaulTrani
25
Know how to...
LEAD THE EYE
Monday, October 28, 13
![Page 10: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/10.jpg)
@PaulTrani
5
It’s about leading the eye...
Monday, October 28, 13
![Page 11: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/11.jpg)
@PaulTrani
5
Monday, October 28, 13
![Page 12: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/12.jpg)
@PaulTrani
5
Monday, October 28, 13
![Page 13: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/13.jpg)
@PaulTrani
5
Monday, October 28, 13
![Page 14: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/14.jpg)
@PaulTrani
5
Monday, October 28, 13
![Page 15: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/15.jpg)
@PaulTrani
5
Monday, October 28, 13
![Page 16: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/16.jpg)
@PaulTrani
5
Monday, October 28, 13
![Page 17: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/17.jpg)
@PaulTrani
5
Monday, October 28, 13
![Page 18: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/18.jpg)
@PaulTrani
5
Monday, October 28, 13
![Page 19: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/19.jpg)
@PaulTrani
5
Monday, October 28, 13
![Page 20: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/20.jpg)
@PaulTrani
5Golden Ratio
Monday, October 28, 13
![Page 21: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/21.jpg)
@PaulTrani
5Golden Ratio
Fibonacci Numbers
Monday, October 28, 13
![Page 22: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/22.jpg)
@PaulTrani
5Golden Ratio
Monday, October 28, 13
![Page 23: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/23.jpg)
@PaulTrani
5Golden Ratio
Monday, October 28, 13
![Page 24: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/24.jpg)
@PaulTrani
5
Which object is easier to look at?
Monday, October 28, 13
![Page 25: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/25.jpg)
@PaulTrani
5
Sharp corners take focus outside the rectangle.
Monday, October 28, 13
![Page 26: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/26.jpg)
@PaulTrani
5
Rounded corners take focus inside the rectangle.
Monday, October 28, 13
![Page 27: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/27.jpg)
@PaulTrani
5
http://www.mani.de/backstage/?p=483
Monday, October 28, 13
![Page 28: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/28.jpg)
@PaulTrani
5
http://www.mani.de/backstage/?p=483
Monday, October 28, 13
![Page 29: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/29.jpg)
@PaulTrani
5
Adventure Co.escape normal
Monday, October 28, 13
![Page 30: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/30.jpg)
@PaulTrani
5
Monday, October 28, 13
![Page 31: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/31.jpg)
@PaulTrani
35
Know how to...
USE COLOR & IMAGERY
Monday, October 28, 13
![Page 32: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/32.jpg)
@PaulTrani
5
“Use color to emphasize importance, not decorate a page.” Alexander White
Monday, October 28, 13
![Page 33: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/33.jpg)
@PaulTrani
5
“A picture is worth a thousand words.”
“Let the picture tell the story.”
Monday, October 28, 13
![Page 34: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/34.jpg)
@PaulTrani
5
Monday, October 28, 13
![Page 35: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/35.jpg)
@PaulTrani
45
Know how to...
USE TEXT & TYPOGRAPHY
Monday, October 28, 13
![Page 36: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/36.jpg)
@PaulTrani
5Typography
“Typography has one plain duty before it and that’s to convey information in writing.”
Emil Ruder
Monday, October 28, 13
![Page 37: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/37.jpg)
@PaulTrani
5
Choosing Fonts
• Choose a font that fits the subject
• Don’t use more than three
Monday, October 28, 13
![Page 38: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/38.jpg)
@PaulTrani
5
Font Styles
Monday, October 28, 13
![Page 39: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/39.jpg)
@PaulTrani
5
Font Awesomeness
Monday, October 28, 13
![Page 40: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/40.jpg)
@PaulTrani
5
Monday, October 28, 13
![Page 41: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/41.jpg)
@PaulTrani
55
FEEDBACK FROM OTHERS
Always get...
Monday, October 28, 13
![Page 42: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/42.jpg)
@PaulTrani
5
Over 1 million members...
Behance.net
Monday, October 28, 13
![Page 43: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/43.jpg)
@PaulTrani
55
Design Fundamentals
1. You’re not a designer. (but you can fake it really well)2. Lead the eye with your layout.3. Use color and imagery to capture attention.4. Use fonts sparingly.5. Get feedback from others.
Monday, October 28, 13
![Page 44: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/44.jpg)
@PaulTrani
65
MAKE IT AWESOME
Then...
Monday, October 28, 13
![Page 45: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/45.jpg)
@PaulTrani
5
Adventure Co.escape normal
Monday, October 28, 13
![Page 46: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/46.jpg)
@PaulTrani
5
Monday, October 28, 13
![Page 47: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/47.jpg)
@PaulTrani
5
An electronic journal for mobile phones. Keep track of what you want and where you found it.
Monday, October 28, 13
![Page 48: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/48.jpg)
@PaulTrani
5
Monday, October 28, 13
![Page 49: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/49.jpg)
@PaulTrani
5
Monday, October 28, 13
![Page 50: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/50.jpg)
@PaulTrani
5
Monday, October 28, 13
![Page 51: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/51.jpg)
@PaulTrani
5
Monday, October 28, 13
![Page 52: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/52.jpg)
@PaulTrani
5
Monday, October 28, 13
![Page 53: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/53.jpg)
@PaulTrani
5
Closing Remarks
Monday, October 28, 13
![Page 54: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/54.jpg)
@PaulTrani
5
Don’t try to be great, try to be invisible.
Monday, October 28, 13
![Page 55: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/55.jpg)
@PaulTrani
5
Don’t “put a star burst behind it.”
Monday, October 28, 13
![Page 56: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/56.jpg)
@PaulTrani
5
Don’t use yellow text on a white background.
Monday, October 28, 13
![Page 57: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/57.jpg)
@PaulTrani
5
Don’t use Comic Sans.
Monday, October 28, 13
![Page 58: 5 Things Developers Need to Know About Design](https://reader034.fdocuments.us/reader034/viewer/2022051108/54431419afaf9fe7098b47f7/html5/thumbnails/58.jpg)
@PaulTrani
5
Thank You!
http://www.paultrani.com http://www.behance.net
Monday, October 28, 13