Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Non-Designer's Design
Search
Keisuke Tada
May 13, 2013
Design
560
3
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Non-Designer's Design
Keisuke Tada
May 13, 2013
More Decks by Keisuke Tada
See All by Keisuke Tada
少人数スタートアップでどうやって素早くユーザに価値を届けるか
tdksk
0
400
Haptic Feedback による効果的なマイクロインタラクション
tdksk
4
15k
Tablet View of COOKPAD Website
tdksk
0
250
Other Decks in Design
See All in Design
2026の目標「もっと定量的に事業、会社へ貢献する!」
yuri_ohashi
0
860
Build for the Web, Build on the Web, Build With the Web
csswizardry
0
470
root COMPANY DECK / We are hiring!
root_recruit
3
29k
生成AIの不確実性を価値に変える、「ビズリーチ」の体験設計 / KNOTS2026
visional_engineering_and_design
6
1.3k
「見せる」登壇資料デザインの極意
takanorip
4
1.1k
Rethinking IFUs: What Board Game Rulebooks Contribute to IFU Usability
deadlinepoet
0
330
速く作れるかではなく、速く学べるか ― 学習ループを回すパイロットの途中報告
nagata03
0
530
デザインの文脈を理解する:エンジニアがデザインカンファレンスに参加して得た学びと気づき
hypebeans
0
240
保育現場にAIを 〜人と技術に橋を架けるデザインで考えてきたこと〜 uiuxcamp2026-hoiku-ai-design
hiro93n
1
330
「バイブコーディングって何?」から始まった、 AIとの一年間と、その先のこと
seto
0
640
CULTURE DECK/Creative Director
mhand01
0
1.3k
凡庸を落とすハーネス
hiromimaeo
1
510
Featured
See All Featured
Art, The Web, and Tiny UX
lynnandtonic
304
22k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
367
27k
Noah Learner - AI + Me: how we built a GSC Bulk Export data pipeline
techseoconnect
PRO
0
210
Building Experiences: Design Systems, User Experience, and Full Site Editing
marktimemedia
0
550
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
201
75k
The Power of CSS Pseudo Elements
geoffreycrofte
82
6.3k
Amusing Abliteration
ianozsvald
1
220
State of Search Keynote: SEO is Dead Long Live SEO
ryanjones
0
220
Lessons Learnt from Crawling 1000+ Websites
charlesmeaden
PRO
1
1.3k
The Limits of Empathy - UXLibs8
cassininazir
1
400
Stewardship and Sustainability of Urban and Community Forests
pwiseman
0
250
The browser strikes back
jonoalderson
0
1.4k
Transcript
Non-Designer’s Design Keisuke Tada
ର σβΠϯײ ϩδοΫཱྗ σβΠϯٕज़
ର ඪ σβΠϯײ ϩδοΫཱྗ σβΠϯٕज़
Agenda σβΠϯͱԿ͔ͳͥσβΠϯ͕ॏཁ͔ ϏδϡΞϧσβΠϯͷجૅ ϓϨθϯςʔγϣϯࢿྉͷσβΠϯ Web σβΠϯͷτϨϯυ
What is Design?! Why is it Important?
σβΠϯ =
σβΠϯ ͔͍͍͓ͬ͜͠ΌΕ ≠
σβΠϯ ղܾͷͨΊͷखஈ =
σβΠϯ ղܾͷͨΊͷखஈ = ߟ͍͑ͯΔ͜ͱɺͬͨ͜ͱΛ! ਖ਼͘͠ɺັྗతʹ͑Δ!
ίϯςϯπ
ίϯςϯπ σβΠϯ
ίϯςϯπ σβΠϯ త! தΛΘΓ͘͢͢Δ खஈ! ݟͨΛྑ͘͢Δ
σβΠϯ
ίϯςϯπ σβΠϯ
ίϯςϯπ σβΠϯ खஈ! ݟͨΛཧ͢Δ త! த͕ચ࿅͞ΕΔ
Basics in Design
Font Sans Serif Serif ໌ே ΰγοΫ
None
Sans Serif! Serif
Color Hue Saturation Value ৭૬ ࠼ ໌
Color Tools • HUE / 360 http://hue360.herokuapp.com/ • Color Scheme
Designer 3 http://colorschemedesigner.com/ • ColorHexa http://www.colorhexa.com/
Alignment This text is flush left. Some people call it
quad left, or you can say it is left aligned. This text is flush right. Some people call it quad right, or you can say it is right aligned. This text is centered. If you are going to center text, make it obvious.
Design in Presentation Slide
ྲྀΕʼৄࡉ
ϙΠϯτΛ໌֬ʹ ! ཱͨͤΔͱ͜Ζগͳ͘ ! ίϯτϥετΛ͖ͬΓͤ͞Δʢେ͖͞ɺଠ͞ɺ৭ɺ༨നʣ ! දɺάϥϑɺਤͳͲಛʹҙ ! Օॻ͖ͳΔ͘ආ͚Δ !
ҰຕͷεϥΠυʹऩΊΔ͖༰͔ख़ྀ͢Δ
ϊΠζΛগͳ͘ ! ςΩετগͳ͘ ! ϑΥϯτ׳Ε͠·Εͨͷ͕ແ ! ΞχϝʔγϣϯΛແବʹΘͳ͍ ! ແବͳάϥσʔγϣϯɺγϟυɺઢېࢭ !
ΉΈͨΒʹͰғΘͳ͍ ! ͏৭ͷ͑Δ ! άϥϑͷෆཁͳςΩετɺઢফ͢
Web Design Trends
Flat
Circle
Blur
References • ϊϯσβΠφʔζɾσβΠϯϒοΫ http://www.amazon.co.jp/dp/4839928401 • ΘΔσβΠϯ http://tsutawarudesign.web.fc2.com/ • Hack Design
http://hackdesign.org/ қ қ