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
Think Design for Future.
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
Kazuki YAMASHITA
March 08, 2016
Design
5
1.4k
Think Design for Future.
これからのデザインを考える
FRONTEND CONFERENCE 2016, 5th Mar 2016
Designed by IMPATH
Kazuki YAMASHITA
March 08, 2016
Tweet
Share
More Decks by Kazuki YAMASHITA
See All by Kazuki YAMASHITA
What Was UX Design All About?
ykazu
2
910
Core skills of the Design for Front-end
ykazu
17
51k
Primer of Information Architecture 2018
ykazu
5
590
Think of the User Experience not UX
ykazu
6
1.3k
Sustinable Frontend Design
ykazu
8
1.7k
Primer of Information Architecture 2016
ykazu
5
2.1k
Other Decks in Design
See All in Design
見過ごさない誠実さ_アクティブバイスタンダーとIntegrityが支えるアジャイル文化 / integrity-and-active-bystander
spring_aki
1
290
新卒2年目デザイナーが、UX検定基礎にチャレンジした話
designer_no_pon
0
1.2k
結びながら、ひらく - にじむ境界のデザイン
hilokifigma
3
1.3k
Correspondence:共に生成していく過程
akiramotomura
0
190
From the Visible Crossroads: Turning Outputs into Outcomes
takaikanako
2
1.1k
ドルちゃん
design_dolphins
0
550
アンエシカルデザインの枠組みの提案 -HCD-Netダークパターン研究会活動報告-
securecat
0
200
デザインを信じていますか
sekiguchiy
1
950
decksh object reference
ajstarks
2
1.5k
これからの「Webデザイン」の話をしよう~デザイナーの私が考えるブロックテーマへの対応で変わりゆくデザインの価値~
ds35mm
0
540
アクセシビリティ推進を続けられるようにするヒント - Accessibility Conference CHIBA 2025
uto
0
180
Ralph Penel Portfolio
ralphpenel
PRO
0
260
Featured
See All Featured
The Cost Of JavaScript in 2023
addyosmani
55
9.5k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
196
71k
Max Prin - Stacking Signals: How International SEO Comes Together (And Falls Apart)
techseoconnect
PRO
0
85
Heart Work Chapter 1 - Part 1
lfama
PRO
5
35k
ラッコキーワード サービス紹介資料
rakko
1
2.3M
Java REST API Framework Comparison - PWX 2021
mraible
34
9.1k
The Impact of AI in SEO - AI Overviews June 2024 Edition
aleyda
5
730
We Analyzed 250 Million AI Search Results: Here's What I Found
joshbly
1
710
Building AI with AI
inesmontani
PRO
1
690
The Mindset for Success: Future Career Progression
greggifford
PRO
0
240
Designing for Timeless Needs
cassininazir
0
130
Visualization
eitanlees
150
17k
Transcript
Λߟ͑Δ ͜Ε͔Βͷ 5 Mar. 2016 - FRONTEND CONFERENCE 2016 σβΠϯ
ࢁ Լ Ұ थ ΠϯϑΥϝʔγϣϯΞʔΩςΫτ 69σΟϨΫλʔ ਓؒத৺ઃܭਪਐػߏࢍॿձһ ώϡʔϚϯΠϯλϑΣʔεֶձࢍॿձһ
ҙঊͷܭը ઃܭ ػೳඒతܗ designare design “Design is how it works.”
Why Design? ͳͥσβΠϯ͠ͳ͚ΕͳΒͳ͍ͷͰ͠ΐ͏ʁ͜Ε·ͰσβΠϯʹ͍ͭͯٞ͞Εਚ͘͞Ε͖ͯ·ͨ͠ɻ
ϑϩϯτΤϯυʹ͓͚ΔσβΠϯͭ͘ΔͨΊͷͷٕज़͕ᷓΕɺͦͷεϐʔυ૿͍ͯ͠·͢ɻ
UI UX IA accessibility ΤϯδχΞʹ͜ͷΑ͏ͳΩʔϫʔυͰσβΠϯࢹΛٻΊΒΕ͍ͯ·͢ɻ
UX 69ᴷᴷϢʔβʔத৺ʹαʔϏεΛσβΠϯ͢Δͱ͍͏ຐ๏ͷΑ͏ʹײ͡ΒΕΔΩʔϫʔυͰ͕ͨ͘͢͞Μͷཁૉ͕แׅ͞Ε͍ͯ·͢ɻ
UX *" ใઃܭ *Y% 6* 6& ϢʔβϏϦςΟֶ )$* ίϯϐϡʔλֶ *%
ۀσβΠϯ %&4*(/*/('03*/5&3"$5*0/CZ%BO4BGGFS ͱͱϢʔβʔͱϞϊαʔϏεͷ૬ޓ࡞༻ΛσβΠϯ͢ΔΠϯλϥΫγϣϯσβΠϯ͕த৺తͳׂͰͨ͠ɻ
σβΠϯʁ ͜͜Ͱ͓͢ΔσβΠϯͱʁ
ϏδϡΞϧ ࢹ֮ใσβΠϯ IUUQXXXKKHOFUFMFNFOUTQEGFMFNFOUTQEG ࠎ֨ ใߏ ཁ݅ త σβΠϯϏδϡΞϧ͚ͩͰͳ͘ɺతΛ۩ମԽ͍ͯ͘͜͠ͱσβΠϯͰ͢͠ɺͻͱͭͻͱͭΛߟ͑Δ͜ͱσβΠϯͰ͢ɻ
σβΠϯʺͭ͘Δ ͭ͘Δ Ή͠ΖσβΠϯͷଟ͘ͷ෦ͭ͘ΔҎ֎ͷ͜ͱͩͱݴͬͯաݴͰ͋Γ·ͤΜɻ
ͭ͘Δ #PPUTUSBQ4UVEJP 8FCqPX 1JOHFOEP MBOEJOHQBHFJP "44&.#-: ͭ͘ΔͨΊͷαʔϏεͨ͘͞Μ͋Γ·͢ɻྫ͑8FCαΠτ͏ίʔσΟϯά͢Δ࣌Ͱͳ͍ͷ͔͠Ε·ͤΜɻ
ͭ͘Δ "QQMF)VNBO*OUFSGBDF(VJEFMJOF (PPHMF.BUFSJBM%FTJHO(VJEF σβΠφʔͷҙٛʁ ΤϯδχΞͷͨΊͷσβΠϯΨΠυϥΠϯᴷᴷσβΠφʔͷҙٛͲ͜ʹ͋ΔͷͰ͠ΐ͏͔ʁ
σβΠφʔ ΤϯδχΞ σβΠφʔͱΤϯδχΞᴷᴷ৬ೳʹۀ͞Ε͍ͯͯͨΓલͷΑ͏ʹײ͡ΒΕ·͕͢ɺͦͦҰॹͰ͋ͬͨͣͰͳ͍Ͱ͠ΐ͏͔ɻ
σΟϨΫλʔ ܦӦ Ϣʔβʔ σβΠφʔ ΤϯδχΞ ͞ΒʹࢲͨͪϢʔβʔͷͨΊʹͳʹ͔Λͭ͘Δɺͱ͍͏͜ͱΛߟ͑ͨ߹ʹɺ͜ͷϢʔβʔ·Ͱʹ͋ΒΏΔਓ͕հࡏ͠·͢ɻ
Ϣʔβʔ͕͍͍͢Α͏ʹσβΠϯͨ͠ ΠϯλϑΣʔεͱͯ͠ͷಓ۩ɺ͔ͭͯ͏ਓ͕͍͘͢࡞Δɺͭ·Γ͏ਓ͕σβΠϯΛ͍ͯ͠·ͨ͠ɻ
ݐங σβΠϯ ϓϩμΫτ σβΠϯ άϥϑΟ οΫ σβΠϯ ΠϯςϦΞ σβΠϯ ࢈ۀֵ໋Ҏ߱ɺͦΕͧΕͷۀͰσβΠφʔͱͯ͠ͷઐੑཱ͕֬͞Ε·ͨ͠ɻ
ݐங σβΠϯ ϓϩμΫτ σβΠϯ ΠϯςϦΞ σβΠϯ άϥϑΟ οΫ σβΠϯ Ͱߟ͑ͯΈΕɺࢲͨͪͷීஈͷੜ׆ͷதͰͦΕͧΕͷσβΠϯྖҬΛҙࣝ͢Δ͜ͱͳ͘ɺମݧҰຊͷઢͷΑ͏Ͱ͢ɻ
ݐங σβΠϯ ϓϩμΫτ σβΠϯ άϥϑΟ οΫ σβΠϯ ΠϯςϦΞ σβΠϯ ༏ΕͨͦΕͧΕͷσβΠφʔɺ͓ޓ͍ͷྖҬΛΧόʔ͠߹͍ͳ͕ΒɺϢʔβʔʹҧײͳ͘Ұຊͷମݧʹͭͳ͍͛ͯ·͢ɻ
͜ΕΒΛʮͭͳ͙ʯɻ͜Ε·͞ʹσβΠφʔͰ͔͠Ͱ͖ͳ͍͜ͱͩͱࢥ͍·͢ɻ ͦΕͧΕͷσβΠϯྖҬ͕ࣾձΛߏ͢Δݱʹ͓͍ͯɺͦΕҒେͳྗΛ͍࣋ͬͯΔͱݴ͑·͢ɻ
σβΠϯʹͭͳ͙ Ϟϊ αʔϏε ͜ͷΑ͏ʹɺσβΠϯͱͭ͘ΔͷͰͳ͘ʮͭͳ͙ʯ͜ͱʹ͋Δɺͱ͍͏͜ͱ͕͔͖ͬͯ·ͨ͠ɻ ϞϊͱαʔϏεͷͦΕͧΕͷσβΠϯ͕͋ΓɺͦΕΒΛߦ͖དྷ͢ΔϢʔβʔͷͨΊʹͭͳ͙͜ͱ͕σβΠϯɺͱ͍͏ߟ͕͑͋Γ·͢ɻ ϑϩϯτΤϯυͦͷද໘తͳͷʹࢹ͕ͪ͠ʹͳΓ·͕͢ɺ͜ͷʮͭͳ͙ʯͱ͍͏͜ͱ͕σβΠϯࢹͰ͢ɻ
ϞϊͷσβΠϯ Ϟϊ ʮϞϊ͔ΓσβΠϯͯ͠ͳΒͳ͍ʯᴷᴷࠓϞϊͷ࣌Ͱͳ͘ɺίτɺମݧͷ͔࣌ͩΒͱ͍͏͜ͱͩͱࢥ͍·͢ɻ ͔͠͠ϞϊΛσβΠϯ͍ͯͨ͠ɺ͔ͭͯͷܳۀσβΠϯʹɺͱ͋Δߟ͕͑ਫ਼௨͍ͯ͠·ͨ͠ɻ
༻ ඒ ͷ ༄फӻ 1889-1961 ຽܳӡಈ IUUQXXXNJOHFJLBOPSKQBCPVUZBOBHJTPFUTVIUNM
༄फӻ 1889-1961 ༻ͱඒ͕݁ΕΔͷɺ ͜Ε͕Ͱ͋Δ ༻ͱ͍͏ͷػೳͰͳ͘ɺ ৺ͷ༻Ͱ͋Δ ʮͷಓʯ ༻ ඒ ͷ
Ұൠతʹػೳඒͱ͍͏ͷ͕͋Γ·͕͢ɺ͜ͷʮ༻ͷඒʯʮ৺ʯͱ͍͏ݴ༿Ͱ৺ͷॆΛॏཁࢹ͍ͯ͠·͢ɻ ৺ͷॆͱࠓͰݴ͏69ͰಘΒΕΔͷͰ͢ɻඒ͠͞ɺ͏ͷͷ৺͕ຬͨ͞Εɺ ͦ͜ʹඋΘΔػೳΛࢦ͍ͯ͠Δͱ͔࣌Βݴ͍ͬͯͨ͜ͱʹͳΓ·͢ɻ
σβΠϯͷࢹ σβΠϯʺͭ͘Δʜͭͳ͛Δ σβΠφʔͱΤϯδχΞ ͭ͘Δ͜ͱͬͱ؆୯ʹ
ײੑΛຏ͘ ͦͯ͠σβΠϯʹͲ͏ͯ͠֎ͤͳ͍ඞཁͳʮײੑʯσβΠφʔ͚ͩͷͰ͋Γ·ͤΜɻײੑΛຏ͘ͱ͍͏͜ͱɺͦΕͧΕͷࣄͷྖҬΛ ͛ͯϞϊΛݟΔ͜ͱ͕Ͱ͖·͢ɻྗษֶͰͳ͘ɺϞϊͷݟํΛগ͠ม͑Δ͜ͱͰײੑ্͕Δͱࢥ͍ͬͯ·͢ɻ ײੑΛຏ͖ɺࠓ͓ͨ͠Α͏ͳσβΠϯࢹΛ࣋ͭ͜ͱͷํ͕ࣄͷ࣭Λม͑ΒΕΔͱࢥ͍·͢ɻ
ඒ͍͠ Ԓ͔ ͔ ࣸਅΛࡱΔతมΘΓ·͕ͨ͠ɺ͖Ε͍ͩͳͱࢥ͏ॠؒΛ͙͢ʹ4/4ʹྲྀͯ͠͠·͍ͬͯ·͢ɻ σδλϧԽࣗવʹ͍ͨ͢Δײੑ͑͞σδλϧͷதʹ͠·͍ͬͯΔ͜ͱ͕͋Γ·͢ɻͦΕͰײੑʹ͔ͭͳ͍··ʹͳΓͦ͏Ͱ͢ɻ ͦͦײੑඒ͍͠ɺԒ͔ɺ͔ͳͲɺͦ͏ײ͡ΔॠؒͰ͢ɻ
ۭΛͳ͕Ίͯ៉ྷͩͳͱࢥ͏͚ͩͰ͍͍ͱࢥ͍·͢ɻۭຖҧ͏৭Ͱɺຖܾͯ͠ಉ͡৭ͳ͍ͱݴΘΕ͍ͯ·͢ɻ ؟Ͱݟͯɺ4/4Ͱͳ͘৺ʹײΛೖΕΔ͜ͱ͕ײੑΛຏ͘ҰาʹͳΓ·͢ɻ ͳʹࣸਅʹࡱΒͳͯ͘ɺهԱͷதʹೖΕ͓͚ͯͩ͘Ͱ͍͍ͱࢥ͍·͢ɻ
͓͍͍͠ɺ͓͍ͦ͠͏ɻͦ͏ࢥ͑ΔͷײੑͰ͢ɻྉཧͷϓϩηεσβΠϯʹࣅ͍ͯ·͢ɻ ͍͠ςΫχοΫݟͨͷΓ͚Ͱͳ͘ɺ०ͷͷͦͷͱ͖৯͍ͨɺ৯ͯΒ͍͍ͨͳͱࢥ͏ͷΛߟ͑ͯɺΈ߹ΘͤΔɻ Ͳ͏ͬͨΒ͖Ε͍ʹͰͳ͘ɺ͓͍͘͠ͳΔ͔Λௐཧͯ͠ߟ͑Δ͜ͱσβΠϯͷϓϩηεͰ͢ɻ
ཧղ ؍ ఆٛ ૾ ࢼ࡞ ͏ Կ͕͖ʁ ०ͷͷʁ ݙཱΛߟ͑ ম͖Ճݮʁ
ຯݟΛͯ͠ ঌ্͕͠Ε σβΠϯࢥߟͱ͍͏ͷ͕͋Γ·͕͢ɺͷΛ࡞ΔલʹԿ͕ඞཁͳͷ͔Λཧղ͢ΔɺͲ͏ͳͷ͔ͬ͘͡Γ؍͠ɺΛఆٛ͢Δɻ ఆٛ͞Εͨͷ͔Β૾͠ɺࢼ࡞ͯ͠Έ࣮ͯࡍʹͬͯͲ͏͔Λςετ͢ΔΓํྉཧಉ͡Ͱ͢ɻ
࠷ޙʹ
ػೳ͚ͩͰղܾͰ͖ͳ͍ෆ߹ཧ͕͋͞Δɻ ࠷ޙʹͰ͕͢ɺࢲ͕σβΠϯͱ͍͏ͷΛ௨͍ͯ͠·ߟ͍͑ͯΔ͜ͱͰ͢ɻ ػೳ͚ͩͰղܾͰ͖ͳ͍ෆ߹ཧ͞ᴷᴷ͜Ε͜Ε͔ΒͲΜͳʹศརͳͷ͕Ͱ͖ͯͦͷͷ͚ͩͰຬ͠ͳ͍ෆ߹ཧ͞ ඞͣΔͱݴ͏͜ͱͰ͢ɻෆ߹ཧ͞Λগͳ͘͢ΔͨΊʹମݧΛҰຊʹ͢ΔͨΊʹσβΠϯͷߟ͑ํΛେʹ͍ͨ͠Ͱ͢ɻ
ྖҬͷதͰٕज़Λڝͬͯྑ͔͔ͬͨ࣌Βɺ ྖҬΛ֦ு͠ͳ͕Βͭͳ͕ΓΛ͍ͭͬͯ࣌͘͘ɻ ࠓ͔ͭͯͷͦΕͧΕͷྖҬͰ/PΛͱΔ͜ͱͰͳ͘ɺͦΕΒΛ֦ுͯͭ͠ͳ͕ΓΛ͍ͭͬͯ࣌ͩ͘͘ͱࢥ͍·͢ɻ ྖҬͱσβΠϯͰ͋ͬͨΓΤϯδχΞϦϯάͰ͋ͬͨΓͰ͢ɻ ৬ҬʹͱΒΘΕͳ͍ΓํͰσβΠϯͷྗͰͭͳ͍͖͍͛ͯͨͱࢥ͍ͬͯ·͢ɻ
σβΠφʔ͕ৗʹҙࣝ͠ɺ ຊͷྑ͞Λࠜఈ͔Βม͍͑ͯ͘༐ؾ͕ඞཁɻ ͋ΒΏΔͷσβΠϯ͞Ε͍ͯ·͢ɻଟ͘ͷແ໊ͳσβΠφʔʹΑͬͯɺಛʹ*5ͷσβΠϯ͢Ͱʹࣗવ౫ଡ͞Ε͍ͯΔ͔͠Ε·ͤΜɻ ͰσβΠφʔਅͬਖ਼໘͔Βຊͷྑ͞Λৗʹҙࣝͯ͠ม͍͑ͯ͘༐ؾ͕ඞཁͩͱࢥ͍ͬͯ·͢ɻ ؆୯ʹͭ͘ΕΔ͔Βͱ͍ͬͯσβΠϯ͢Δ͜ͱΛΊͳ͍Ͱ͍ͩ͘͞ɻ
ͦΕʹଟ͘ͷײੑΛඞཁͱ͢Δɻ ײੑ͕ͳ͍··ͰɺඞͣյΕΔၪ͍ͷɻ ײੑʮײͨ͡ऀউͪʯ ײੑਓؒͰ͋Ε୭͕ຏ͚ΔͷɻಛʹຊਓͷײੑૉΒ͍͠ͱݴΘΕ͍ͯ·͢ɻσβΠϯͱ͍͏ߦҝɺײੑ͕ͳ͍··औΓΉͱɺ ؆୯ʹର͕͜ΘΕͯ͠·͏͔ͳ͍ͷͰ͢ɻ͔ͩΒײੑΛຏ͘͜ͱΛࢭΊ͍͚ͯͳ͍ͱࢥ͍ͬͯ·͢ɻ ͦͷײੑײͨ͡ऀউͪͰ͢ɻੜ׆ࣗવͷதʹͨ͘͞Μ͋Γ·͢ɻ
Why Design? ΤϯδχΞɺσβΠφʔؔͳ͘ࠓσβΠϯ͕ٻΊΒΕ·͢ɻͳͥ࡞Δͷ͔ʁΛߟ͑Δ͜ͱ͏σβΠϯࢹͰ͢ɻ ͜Ε͔Βࢲແ໊ͳσβΠφʔͱͯ͠ɺ͍ͭͷؒʹ͔ͦ͜ʹ͋ΔΑ͏ͳσβΠϯΛ৺͕͚͍ͨͰ͢ɻಛʹ6*ͳͲۭؾͷΑ͏ʹɺͳʹײ͡Β Εͳ͍͘Β͍ͳͷͰ͋Ε͍͍ͳͱࢥ͍·͢ɻօ͞ΜͷσβΠϯͲΜͳͷͰ͠ΐ͏͔ʁ·ͨσβΠϯʹ͍ͭͯߟ͑Λ͓ฉ͔͍ͤͩ͘͞ɻ
Thank you http://ykazu.com/