Lock in $30 Savings on PRO—Offer Ends Soon! ⏳

宅宅設計入門

Avatar for Hai Feng Kao Hai Feng Kao
February 18, 2016
Design
5
320

 宅宅設計入門

寫給宅宅的設計法則(Alignment & Contrast)

Avatar for Hai Feng Kao

Hai Feng Kao

February 18, 2016
Tweet

More Decks by Hai Feng Kao

See All by Hai Feng Kao
物件導向的文藝復興:用DCI重塑程式設計的藝術
Avatar for Hai Feng Kao haifengkao
0
130
模組化的Swift架構(一) Redux入門
Avatar for Hai Feng Kao haifengkao
0
150
模組化的Swift架構(二) DDD速成
Avatar for Hai Feng Kao haifengkao
0
870
日常生活中的腦殘
Avatar for Hai Feng Kao haifengkao
0
280
機器學習超入門
Avatar for Hai Feng Kao haifengkao
0
180
UICollectionView自動布局
Avatar for Hai Feng Kao haifengkao
1
460
宅宅設計入門2
Avatar for Hai Feng Kao haifengkao
2
300

Other Decks in Design

See All in Design
Portfolio 齋藤明敏 Hiroyuki Saito
Avatar for HIROYUKI SAITO crearedesign
0
130
1年目デザイナーが実践する、チーム貢献のための2つのアプローチ
Avatar for kinomi kinomidesign
0
140
デザインエンジニアの延長にデザインマネージャーとしての可能性を探る
Avatar for takanorip takanorip
0
820
越境するデザイン人材：デザイナーが社会資本となる世界へ
Avatar for Goodpatch Inc. goodpatch
1
410
Ralph Penel Portfolio
Avatar for ralphpenel ralphpenel
PRO
0
150
アクセシビリティ推進を続けられるようにするヒント - Accessibility Conference CHIBA 2025
Avatar for uto usui uto
0
110
Building Experiences: Design Systems, User Experience, and Full Site Editing
Avatar for Michelle Schulp Hunt marktimemedia
0
300
モビリティプラットフォームの未来を築くクラウド基盤
Avatar for Hajime KOSHIRO kossykinto
0
150
ユーザー像を「みてね」らしく可視化する　家族アルバムみてねUXリサーチチームの取り組み
Avatar for MIXI DESIGN mixi_design
PRO
3
530
自分たちがターゲットになりにくい業務アプリケーションのユーザビリティを担保する取り組み / Initiatives to ensure the usability of business applications that are difficult for us to target
Avatar for Hiromi Morikawa hiromitsuuuuu
1
1.1k
TWCP#21 UXデザインと哲学のはなし
Avatar for MAMIYA Shinsuke shinn
0
150
mount_company_profile
Avatar for mount inc. mount_inc
0
3.9k

Featured

See All Featured
RailsConf 2023
Avatar for Aaron Patterson tenderlove
30
1.3k
Navigating Team Friction
Avatar for Lara Hogan lara
191
16k
Build your cross-platform service in a week with App Engine
Avatar for Jose L jlugia
234
18k
The Illustrated Children's Guide to Kubernetes
Avatar for Chris Short chrisshort
51
51k
ピンチをチャンスに：未来をつくるプロダクトロードマップ #pmconf2020
Avatar for Aki / @LoveIdahoBurger aki_iinuma
128
54k
Testing 201, or: Great Expectations
Avatar for Joseph Mastey jmmastey
46
7.8k
A Modern Web Designer's Workflow
Avatar for Chris Coyier chriscoyier
698
190k
Context Engineering - Making Every Token Count
Avatar for Addy Osmani addyosmani
9
520
VelocityConf: Rendering Performance Case Studies
Avatar for Addy Osmani addyosmani
333
24k
The Art of Programming - Codeland 2020
Avatar for Erika Heidi erikaheidi
56
14k
Designing for humans not robots
Avatar for Tammie Lister tammielis
254
26k
The Straight Up "How To Draw Better" Workshop
Avatar for Dennis Kardys denniskardys
239
140k

Transcript

  1. 疌疌戔懯獈槹 Hai Feng Kao CocoaHead Taipei 2016.02

  2. 傶Ջ讕疌疌ᥝ䨝戔懯牫 • ತ戔懯䒍ᥝ藳憒໒

  3. 傶Ջ讕疌疌ᥝ䨝戔懯牫 • ತ戔懯䒍ᥝ藳憒໒ • ತ戔懯䒍ᥝ磪桽

  4. 傶Ջ讕疌疌ᥝ䨝戔懯牫 • ᛔ૩戔懯অ舚珆

  5. 戔懯ጱӤӥૢݦ • 妔犋ฎ戔懯䒍፡ጱ戔 懯䨗 • ࣁՈ傶Ӯኴ愊ጱ憒 㳷

  6. 戔懯ጱࢥ㮆ဩ㳷 • Alignment 䌘煶 • Constrast 䌘穉 • Repetition ᯿薟

    • Proximity 獤觊

  7. 䌘煶 • ୌ缏殷ᶎزᔰԏ樌ጱ橕狌 • 獺蝨޾蘂ጱ眤憽

  8. 粚ᶎጱ䌘煶 • 䌘煶ૢ螲 • 䌘煶Ӿ樌 • 䌘煶ݦ螲 Google now

  9. 粚ᶎጱ䌘煶 • ᥝ՚奞捝ጱਁ: ݻૢ䌘煶 • 珅୚ဳ఺ጱ秂氂: ᗝӾ • ೲ衔 (Button):

    ᗝӾ穉斃অೲ Google now

  10. 粚ᶎጱ䌘煶 • 䌘煶ૢ螲 • 䌘煶Ӿ樌 • 䌘煶ݦ螲 Google map

  11. 氅ᜋጱ䌘煶

  12. य़ੜጱ䌘煶

  13. 䌘煶 • 獺蝨޾蘂ጱ眤憽 • 螨عڊ匍ॡग़ጱ橕蝫௔ • 犋ᥝݶ碻ڊ匍ݻૢ䌘煶޾ݻݦ 䌘๗

  14. 戔懯ጱࢥ㮆ဩ㳷 • Alignment 䌘煶 • Constrast 䌘穉 • Repetition ᯿薟

    • Proximity 獤觊

  15. 䌘穉 • 獺蝨珅୚Ոጱ殷ᶎ

  16. 罶奞ጱ䌘穉

  17. 罶奞ጱ䌘穉

  18. 粚ᶎጱ䌘穉 • 讙ᰂ穉ֺ 1.618 • 蚅ጼ穉ֺ 1.5 • ᤈ蚣: ਁࣳጱ1.5狝

    • ᤈ蚣䒻ۗ捝ᘏ݄捝ෟ螲ጱਁ • ᥝӞ蚏捝ጱਁ䛑扗婘ੜ蚣櫝

  19. 粚ᶎጱ䌘穉 • 䋿率Ӥ1.3 ~ 1.8᮷ݢ犥

  20. 粚ᶎጱ䌘穉 • 䌘穉ॡ䔶

  21. 犝ଶጱ䌘穉 • ӣ圵犝ଶ Fitbit

  22. 犝ଶጱ䌘穉 • ӣ圵犝ଶ Fitbit

  23. 犝ଶጱ䌘穉 • ࢥ圵犝ଶ Yelp

  24. 犝ଶጱ䌘穉 • አ箜褩ݢ犥䲒礚ฎ玽磪䌘穉犋䄪 䔶篇ጱ㺔氂 • ӣ圵犝ଶ • ጮ牏箜牏ἓ • ࢥ圵犝ଶ

    • ጮ牏亮箜牏窼箜牏ἓ Yelp

  25. 犝ଶጱ䌘穉 • ӣ㮆犋Ӟ䰬ጱ氅ᜋ

  26. 犝ଶጱ䌘穉 • 䌘穉犋᪃ • 犝ଶ皃ԒӞ䰬

  27. 䌘穉 • ದૣ物氅ᜋ牏य़ੜ牏绚ጮ牏罶奞牏 ୵制 • 螨ع犋䔶篇ጱ䌘穉 • 䌘煶ဩ㳷物Ӟ䰬 • 䌘穉ဩ介物覍ଉ犋Ӟ䰬

  28. 䌘穉 • Be Bold! Be Brave! • 犋ᥝ吚㮆睩୧ጱካՈ

  29. 戔懯ጱࢥ㮆ဩ㳷 • Alignment 䌘煶 • Constrast 䌘穉 • Repetition ᯿薟

    • Proximity 獤觊

  30. HPXᤈ㵕䛑አՕᶎ戔懯 稭蜰ے獈

  31. Be Bold! Be Brave! Don’t be a wimp!