Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Design is in the Details

Bryan Veloso
May 22, 2008
Design
18
1.2k

Design is in the Details

(This is an older presentation, given back at the 2008 edition of WebVisions.)

Design is in the Details is a presentation that is dedicated to showing you that the small things really do matter in design. My colleague Dan Rubin and I compare CNN and Fox News, showing how subtleties in padding, spacing and even contrast can make any site look more professional. We end with tips and tricks that we use on a daily basis and a reveal of a quick redesign of Fox News done especially for the presentation.

Bryan Veloso

May 22, 2008
Tweet

More Decks by Bryan Veloso

See All by Bryan Veloso
Hybrids Rule Everything Around Me (BlendConf)
bryan
3
540
Hybrids Rule Everything Around Me (A Web Afternoon)
bryan
5
240
Designing Your Open Source Project (DjangoCon)
bryan
14
1.4k
Design Your Own Open Source Project (PyCon Philippines)
bryan
19
2.3k
Recruiting Designers for your Open Source Project
bryan
14
2.1k
Hub
bryan
11
780
Super Hybrid Robots
bryan
106
12k
Music & Morning Musume
bryan
40
5.5k

Other Decks in Design

See All in Design
Webアプリケーションアクセシビリティ解説ウェビナー「8章 アクセシブルなUI設計の原理を導く」
magi1125
1
160
全社を巻き込んだコーポレートバリューの再定義に関するデザイナーの関わり方
sugiyama_sukedachi
0
170
WHAT ARE ME?
takuro_nakajima
PRO
0
1.2k
顕在化されていない期待、デザインの灯台
daitorii
1
1.1k
Sociotechnical design for software and human systems
xinyao
2
480
Ride or Die Animatics
warwatkar
0
140
TrollsTopia: Funtography- Part 1
kenijam
0
210
Product-Writing
aguringo
5
2.8k
1人歩きする営業資料作成
yutoshukuya
0
130
デザインに関わる全ての人たちでエベレスト登頂を目指すために取り組んでいること
amishiratori
0
560
コラボレーションを小さくはじめ、大きく広める - 相互理解のためのデザイン＆開発交流会, Friends of Figma Tokyo by Yasuhiro Yokota
yasuhiroyokota
2
1.2k
みてね デザイン組織の変遷とデザインマネージャーの振り返り
naoyawatanabe
3
570

Featured

See All Featured
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
18
1.7k
From Idea to $5000 a Month in 5 Months
shpigford
377
45k
A Modern Web Designer's Workflow
chriscoyier
689
190k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
29
6k
Learning to Love Humans: Emotional Interface Design
aarron
266
39k
Git: the NoSQL Database
bkeepers
PRO
421
63k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
118
38k
We Have a Design System, Now What?
morganepeng
42
6.7k
Building Applications with DynamoDB
mza
88
5.6k
Visualization
eitanlees
135
14k
Rebuilding a faster, lazier Slack
samanthasiow
72
8.2k
Web Components: a chance to create the future
zenorocha
304
41k

Transcript

  1. DESIGN IS IN THE DETAILS Bryan Veloso & Dan Rubin

    S01

  2. HI! I’M BRYAN O_o; Introduction S02

  3. Introduction S03

  4. AND I’M DAN ¬_¬; Introduction S04

  5. Introduction S05

  6. WHY ARE WE HERE? Introduction S06

  7. SMALL THINGS MATTER Introduction S07

  8. WHAT THIS IS NOT: Introduction S08

  9. WHAT YOU’LL LEARN: Introduction S09

  10. LAYOUT, TYPE & PIXELS Introduction S10

  11. LET YOUR LAYOUT BREATHE Demonstration S11

  12. Demonstration S12

  13. Demonstration S13

  14. Demonstration S14

  15. Demonstration S15

  16. Demonstration S16

  17. Demonstration S17

  18. Demonstration S18

  19. Demonstration S19

  20. NOW LET’S COMPARE Demonstration S20

  21. Demonstration S21

  22. Demonstration S22

  23. Demonstration S23

  24. USE RANGE KERNING Demonstration S24

  25. Demonstration S25

  26. Demonstration S26

  27. SIGNAL AND NOISE Demonstration S27

  28. SIGNAL AND NOISE Demonstration S28

  29. Demonstration S29

  30. WHEN BLACK ISN’T Demonstration S30

  31. USE YOUR EYES Demonstration S31

  32. SRSLY , USE UR EYES Demonstration S32

  33. Demonstration S33

  34. FLAT IS BORING Demonstration S34

  35. DEPTH HAPPENS Demonstration S35

  36. LIGHT VS. DARK Demonstration S36

  37. MINT SCREEN Demonstration S37

  38. MINT SCREEN Demonstration S38

  39. MINT SCREEN Demonstration S39

  40. Demonstration S40

  41. PIXEL **CKING Demonstration S41

  42. PIXEL HACKING Demonstration S42

  43. MOAR SCREENS Demonstration S43

  44. Demonstration S44

  45. Demonstration S45

  46. Demonstration S46

  47. MOAR SCREENS Demonstration S47

  48. MOAR SCREENS Demonstration S48

  49. MOAR SCREENS Demonstration S49

  50. KNOW WHEN TO QUIT Demonstration S50

  51. SPACING, SPACING Education S51

  52. BORDER PATROL Education S52

  53. SIMPLE CONTENT SPACING Education S53

  54. THE RULE OF TEN Education S54

  55. SUPER- FLUOUS DETAILS Education S55

  56. TIPS & SHORT - CUTS Education S56

  57. Education S57

  58. SHIFT+ ARROW (←↑→↓) Education S58

  59. LAYER BLENDING MODES Education S59

  60. MOAR LAYER HACKING Education S60

  61. ⌘+⇧+C= COPY MERGED Education S61

  62. THE REVEAL Education S62

  63. Education S63

  64. Education S64

  65. THE REVEAL Education S65

  66. THE REVEAL Education S66

  67. DESIGN. ISINTHE DETAILS.com Education S67

  68. THANKS! ^_^v Education S68