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
3
520
Non-Designer's Design
Keisuke Tada
May 13, 2013
Tweet
Share
More Decks by Keisuke Tada
See All by Keisuke Tada
少人数スタートアップでどうやって素早くユーザに価値を届けるか
tdksk
0
340
Haptic Feedback による効果的なマイクロインタラクション
tdksk
4
13k
Tablet View of COOKPAD Website
tdksk
0
220
Other Decks in Design
See All in Design
Design Your Own App Using Figma by Medha Muppala
gdgmontreal
0
1.5k
世界中のチームワークをどうデザインしているのか
ka3zu1ma10
0
270
20240921-図書館の実空間とデジタル資源の接点をデザインする-dtk55-Designing-the-interface-between-the-library's-physical-space-and-digital-resources
majimasachi
0
430
Tableau曲線表現講座(2024.11.21)
cielo1985
0
220
AIネイティブな時代におけるUXデザインの在り方とは
kuni29
0
1.1k
急成長中のWINTICKETにおける ちいさくはじめるライティング改善 / winticket-writing
cyberagentdevelopers
PRO
1
240
共通言語としてのデザイントークンと Figmaでの運用
kamy0042
0
180
The Very Small Creatures - dressing up warm sequence
lizziestoryboards
0
130
志ある事業の種を社会に開花させるための挑戦/ Designship2024_Nishimura
root_recruit
0
230
デザインシステム構築の進め方 基本から実践まで、具体的な手順を徹底解説
ncdc
1
360
利用者が離れないUX/UIデザイン 長く使われる業務アプリデザインのポイント
ncdc
4
310
共創するのはモノではなく価値 ── 日本の「はたらく」を変える挑戦 / Designship2024 MainStage
visional_engineering_and_design
1
680
Featured
See All Featured
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
113
50k
Building a Modern Day E-commerce SEO Strategy
aleyda
38
7k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
30
2.1k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
356
29k
For a Future-Friendly Web
brad_frost
176
9.5k
StorybookのUI Testing Handbookを読んだ
zakiyama
28
5.4k
The World Runs on Bad Software
bkeepers
PRO
66
11k
Bash Introduction
62gerente
610
210k
Designing for Performance
lara
604
68k
Building Your Own Lightsaber
phodgson
104
6.2k
RailsConf 2023
tenderlove
29
970
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
8
1.2k
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/ қ қ