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
Webデザインのトレンド
Search
Designsprint
June 09, 2016
Design
2
120
Webデザインのトレンド
このドキュメントは、事業主・起業家向けのWebデザイン研究資料です。デザイナー向けではありませんので、詳細な解説はありません。
Designsprint
June 09, 2016
Tweet
Share
More Decks by Designsprint
See All by Designsprint
spj-01book2019_.pdf
designsprint
0
140
ExOスプリント
designsprint
0
330
designsprint デザインスプリントのすすめ
designsprint
0
160
DESIGN SPRINT lecture and Workshop Strategic IT Management in Yahoo! LODGE
designsprint
1
130
Exponential Transformation - ExO SPRINT
designsprint
3
530
ExO SPRINT 説明会
designsprint
0
94
デザインスプリント1日説明会+ワークショップ
designsprint
0
190
Designsprint-Massive-Transformative-Purpose01.pdf
designsprint
0
270
designsprint-Jobs-To-Be-Done01
designsprint
0
130
Other Decks in Design
See All in Design
そのUIコンポーネント、これから先も使えますか?―Headless UI,Open UI,グローバルデザインシステム
sakito
2
2k
組織はみんなでつくる。デザイナーが仕掛ける急拡大する組織のカルチャーづくり
mkasumi
0
380
AI時代に、僕たちデザイナーはどう歩むか
kazuhirokimura
0
410
Meet, Learn, Grow × AI ― コミュニティで加速するスキル循環 「コミュニティと関わり方」
tame
0
270
組織の右腕として共創する ー デザインと経営の二つの視点から見えた、新しい支援のかたち/ Designship2025_Nishimura
root_recruit
PRO
0
140
portfolio.pdf
onof003
0
190
21 Ways to Call American Airlines Customer Care Full Guide USA
americanhub
0
220
高卒公務員から Webデザイナーになるまで
kinomidesign
0
110
株式会社バクタム 会社説明資料
bactum
0
360
7 Core Values of Round-L
wired888
0
2.2k
デザイナー向けフライル説明資料
toshiblues
0
170
DESIGNEAST 2025 A-3
_kotobuki_
0
100
Featured
See All Featured
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
35
3.2k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
52
5.6k
RailsConf 2023
tenderlove
30
1.2k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
55
3k
Building Better People: How to give real-time feedback that sticks.
wjessup
369
20k
A Modern Web Designer's Workflow
chriscoyier
697
190k
A designer walks into a library…
pauljervisheath
209
24k
It's Worth the Effort
3n
187
28k
What’s in a name? Adding method to the madness
productmarketing
PRO
24
3.7k
Measuring & Analyzing Core Web Vitals
bluesmoon
9
620
Leading Effective Engineering Teams in the AI Era
addyosmani
6
430
Statistics for Hackers
jakevdp
799
220k
Transcript
※هࡌ͍ͯ͠ΔιϑτΣΞαʔϏεɺίʔσΟϯάٕज़20153݄12ݱࡏͷͷͰ͋ΓɺҎ߱ɺ༷มߋʹΑΓ໊শը໘Ґஔ͕มߋ͞Ε͍ͯΔ߹͕͋Γ·͢ɻ ࣄۀओɾىۀՈ͚WebσβΠϯݚڀࢿྉ re-webdesigning.com Some rights reserved. WebσβΠϯͷ τϨϯυ Նຊ݈࢘
γϯάϧϖʔδͱʁ
͔͜͜ΒֶͿ͜ͱ γϯάϧϖʔδͱʁ γϯάϧϖʔδͷ5ͭͷύλʔϯ γϯάϧϖʔδͷಛ ̍ ̎ ̏ ͦͷଞͷτϨϯυ ̐
INDEX - γϯάϧϖʔδͱʁ ̎ɽγϯάϧϖʔδͷྺ࢙ ̍ɽγϯάϧϖʔδͷجૅࣝ - γϯάϧϖʔδͷಛ ̎ɽγϯάϧϖʔδͷ͓ܾ·Γύλʔϯ ̍ɽγϯάϧϖʔδͷత
̏ɽϥϯσΟϯάϖʔδͱͲ͕͜ҧ͏ʁ ̏ɽγϯάϧϖʔδ͕૿͑࢝Ίͨཧ༝
γϯάϧϖʔδͷجૅࣝ γϯάϧϖʔδͱ̍ϖʔδͰ݁ͨ͠“αΠτ”ɻ ̍ϖʔδͷதʹॏཁͳίϯςϯπ͕΄ͱΜͲཏ͞Ε ΔΑ͏ʹσβΠϯʢߏɾઃܭʣ͞Εͨɺಠཱͨ͠α ΠτɻάϩʔόϧφϏήʔγϣϯ͔ΒϖʔδϦϯΫ Ͱ֤ίϯςϯπʹҠಈ͢Δ͜ͱ͕Ͱ͖Δɻ ϫϯϖʔδɺγϯάϧϖʔδWebαΠτɺγϯάϧ ϖʔδ݁ܕαΠτɺϥΠνͳͲɺ͍Ζ͍Ζͳ໊শ ͰݺΕ͍ͯͯɺܾ·ͬͨݺͼํͳ͍ɻ
̴̬̱ΞϓϦέʔγϣϯɺήʔϜͳͲʹଟ༻͞ΕΔγϯάϧϖʔδΞϓϦ έʔγϣϯʢSPAʣͱࢦ͍ͯ͠Δͷ͕શ͘ҧ͏ͷͰҙ͕ඞཁɻ
γϯάϧϖʔδͷྺ࢙ ൃɺ͍͔ͭΒɾͲ͕͜࠷ॳ͔Βɺ͔Βͳ͍ɻ 2011͝Ζ͔ΒӳޠݍͰࣗવൃੜతʹ૿͑͡Ίͨɻ ຊͰ2013͝Ζ͔Β૿͑࢝Ί͕ͨɺ·ͩ·ͩਁಁͨ͠ ͱݴ͑ͳ͍ɻ͜Ε͔Βೝ͕ߴ·ΔͱࢥΘΕΔɻ 19929݄30ʹຊॳͷΣϒα ΠτΛ্ཱͪ͛ͨͷɺἚݝͭ ͘ࢢʹ͋Δʰจ෦লߴΤωϧΪ ʔཧֶݚڀॴʢKEKʣʱʢݱࡏͷ
ʰେֶڞಉར༻ػؔ๏ਓɾߴΤω ϧΪʔՃثݚڀػߏʱʣ͕ͩɺ αΠτͰͳ͘ɺ࣮ϦϯΫͷͳ ͍୯Ұϖʔδͩͬͨɻ ຊॳͷΣϒαΠτ“γϯάϧϖʔδ”ͩͬͨɻ TOPICS
γϯάϧϖʔδ͕૿͑࢝Ίͨཧ༝ ʮࠓ͔ͩΒʯͱ͍͏ཧ༝͕໌֬ʹ͋Δ - අ༻ͱՌͷόϥϯε͕ஸΑ͍ - JavaScriptʢjQueryʣɺCSSͷٕज़ൃୡɾख़Խ - ϓϩδΣΫτͷೲظԽ͕૿͍͑ͯΔ -
ϞόΠϧϑΝʔετʹ͢Δͱɺػೳతʹͦ͏ͳΔ - ̪̭ͷৢԽͱ͏·͘Ϛονϯά͍ͯ͠Δ - ϚʔέςΟϯάઓུ͕γϯϓϧʹͳ͖ͬͯͨ - γϯϓϧͳͷͰޮՌ͕ग़͍͢ɾଌΓ͍͢
γϯάϧϖʔδͷಛ
͔͜͜ΒֶͿ͜ͱ γϯάϧϖʔδͱʁ γϯάϧϖʔδͷ5ͭͷύλʔϯ γϯάϧϖʔδͷಛ ̍ ̎ ̏ ͦͷଞͷτϨϯυ ̐
γϯάϧϖʔδσβΠϯͷత ͏త͕ݶΒΕ͍ͯΔ - ϕϯνϟʔɺελʔτΞοϓاۀͷίʔϙϨΠταΠτ - ظؒݶఆΠϕϯτɾൢଅαΠτ - λϨϯτΞʔςΟετͷެࣜαΠτ -
αʔϏεͷεϖγϟϧαΠτ ଟϖʔδΑΓඅ༻͕͑ΒΕɺظؒमྃޙʹԼ͛ΔͷϥΫ ൺֱతΧϯλϯʹ࡞Εͯϝϯς͕ϥΫɻઌਐతͳΠϝʔδ͕͢Δ γϯϓϧʹ؍ͤΒΕɺ̍ϖʔδͰ͍݁ͯ͠Δͱ࡞ۀ͕ϥΫ ϒϩάձһϖʔδͷத৺ͱͯ͠దɻը໘ભҠͷΪϛοΫ͕Τϯλ ϝײΛৢ
γϯάϧϖʔδͷ͓ܾ·Γύλʔϯ ͜Εͧ“γϯάϧϖʔδ”ͱ͍͏ಛ͕͋Δ എܠ̍ຕը૾·ͨഎܠಈըΛϑΝʔ ετϏϡʔʹஔ ̍ άϩφϏը໘࠷্෦ʹஔ ̎ େ͖ΊจࣈαΠζ ̏
ΞΠίϯͷϙΠϯτ׆༻ ̐ ΊͷϗϫΠτεϖʔε ̑ γϯϓϧͰ΄ͲΑ͍ใྔ ̒ جຊηϯλʔἧ͑Ͱ̍ΧϥϜ ̓ γϯάϧϖʔδσβΠϯ Ӭٱʹෆ໓Ͱ͢ʂ The Best Website Design. ̖site. ࠷৽ٕज़ʹΑΔ εϜʔζͳಈ͖ ઐଐελοϑʹ ΑΔαϙʔτ ޮՌΛݕূࡁΈ ͷ҆৺Ϛʔέ ෯͍ۀछɾۀଶʹࢧ࣋͞ΕΔ ސ٬ຊҐͷखް͍αϙʔτɻ Ϣʔβʔࢥ͍ͷWebσβΠϯͱɺ ͍͍ͬͨԿͰ͠ΐ͏ɻجຊʹཱͪฦ
ϥϯσΟϯάϖʔδͱͲ͕͜ҧ͏ʁ ࣅ͍ͯΔ͕ɺػೳ໘ɾϚʔέςΟϯά໘Ͱશ͘ผͷ - ϥϯσΟϯάϖʔδ ػೳ໘ جຊతʹάϩʔόϧφϏήʔγϣϯ͕ͳ͘ɺίϯςϯπϖʔδͷ ্͔ΒԼ·Ͱͻͱଓ͖ʹͳ͍ͬͯΔɻ ϚʔέςΟϯά໘ ̪̭(ϢʔβɾΤΫεϖϦΤϯε)ߟྀ͠ͳ͍ɻϝʔϧϚΨδϯͷΦ
ϓτΠϯߪೖͳͲΦϑΝʔ͕͋Δ͜ͱ͕େલఏɻ -γϯάϧϖʔδ ػೳ໘ άϩʔόϧφϏήʔγϣϯΛத৺ʹͨ͠ը໘ભҠɻσβΠϯτʔϯ δϟϯϓͷը໘ߏͰɺίϯςϯπ͕̍ͭ̍ͭଳ͕ॎʹ࿈ͳΔΑ͏ ʹ͔Ε͍ͯΔɻ ϚʔέςΟϯά໘ ̪̭(ϢʔβɾΤΫεϖϦΤϯε)ॏࢹͰɺඞͣ͠ΦϑΝʔ͕͋Δͱ ݶΒͳ͍ɻ
γϯάϧϖʔδͷ ̑ͭͷύλʔϯ
͔͜͜ΒֶͿ͜ͱ γϯάϧϖʔδͱʁ γϯάϧϖʔδͷ5ͭͷύλʔϯ γϯάϧϖʔδͷಛ ̍ ̎ ̏ ͦͷଞͷτϨϯυ ̐
INDEX - γϯάϧϖʔδͷ̑ͭͷύλʔϯ ̗ɽγϯάϧϖʔδʴύϥϥοΫε ̖ɽγϯϓϧͳγϯάϧϖʔδ ̙ɽγϯάϧϖʔδʴύϥϥοΫεʴৄࡉϖʔδ ̘ɽγϯάϧϖʔδʴৄࡉϖʔδ ̚ɽมΓछ
γϯάϧϖʔδͷ̑ͭͷύλʔϯ ̗ɽγϯάϧϖʔδʴύϥϥοΫε ̖ɽγϯϓϧͳγϯάϧϖʔδ ̙ɽγϯάϧϖʔδʴύϥϥοΫεʴৄࡉϖʔδ ̘ɽγϯάϧϖʔδʴৄࡉϖʔδ ̚ɽมΓछ
̖ɽγϯϓϧͳγϯάϧϖʔδ ̥̘͚ʹ͚ͩ࡞ΒΕͨΦʔιυοΫεͳ࡞Γ ྫʣ ࡾҪॅ༑Ϩδσϯγϟϧɹ2020;͏ͭ͏ͷՈల
̖ɽγϯϓϧͳγϯάϧϖʔδ ϨεϙϯγϒͷίʔϙϨΠταΠτ ྫʣ KAIZEN PLATFORM
̗ɽγϯάϧϖʔδʴύϥϥοΫε ࢹ֮ԋग़͕ίϯςϯπྗΛҾ͖ग़͍ͯ͠Δ ྫʣ NTTίϛϡχέʔγϣϯζɹHTML5 Lab
̗ɽγϯάϧϖʔδʴύϥϥοΫε ࢹ֮ԋग़͕ίϯςϯπྗΛҾ͖ग़͍ͯ͠Δ ྫʣ Ben the Bodyguard(ϝϞΞϓϦͷαΠτ)
̗ɽγϯάϧϖʔδʴύϥϥοΫε ࢹ֮ԋग़͕ίϯςϯπྗΛҾ͖ग़͍ͯ͠Δ ྫʣ OK Studios
̗ɽγϯάϧϖʔδʴύϥϥοΫε ʮͳΔ΄ͲʂʯΞΠσΟΞউෛ ྫʣ Netlash bSeen
̘ɽγϯάϧϖʔδʴৄࡉϖʔδ ผϖʔδʹͨ͠ํ͕Α͍ભҠ͞Γ͛ͳ͘ ྫʣ SAEKO OFFICIAL WEBSITE
̙ɽγϯάϧϖʔδʴύϥϥοΫεʴৄࡉϖʔδ ख͞ͳ͍͕ඞવతͳΪϛοΫΛແʹԡ͍͑ͯ͞Δ ྫʣ SEOKO ASTRON 2014ϦκʔτݶఆϞσϧ
̚ɽมΓछ ಈ͖ͷ໘ന͕͞ݸੑΛৢ͠ग़͍ͯ͠Δϖʔδ ྫʣ Juvelér Langaard
̚ɽมΓछ ϑΥϯτͱಈ͖ͷ৽͞ͰҹΛਂΊΔૂ͍ ྫʣ BeerCamp at SXSW 2011
ͦͷଞͷτϨϯυ
͔͜͜ΒֶͿ͜ͱ γϯάϧϖʔδͱʁ γϯάϧϖʔδͷ5ͭͷύλʔϯ γϯάϧϖʔδͷಛ ̍ ̎ ̏ ͦͷଞͷτϨϯυ ̐
INDEX - ͦͷଞͷτϨϯυ ̗ɽΰʔετϘλϯ ̖ɽແݶεΫϩʔϧ ̙ɽશը໘ը૾ɾಈը ̘ɽυϩΞʔϘλϯ ̚ɽRetinaσΟεϓϨΠରԠ
A.ແݶεΫϩʔϧ ̍ϖʔδͰͯ͢ͷใΛදࣔ Yahoo! japan
B.ΰʔετϘλϯ എܠʹ༹͚ࠐΜͩಁ໌ͳϘλϯ ίϨʂ I AND C-Cruise
C.υϩΞʔϘλϯ ࡾຊઢ·ͨೋຊઢͷφϏήʔγϣϯɻ ίϨʂ
D.શը໘ը૾ɾಈը ͲͷσόΠεͰը໘͍ͬͺ͍ʹ͕Δը૾ Brindisa Tapas Kitchens
E.RetinaσΟεϓϨΠରԠ ϩΰϚʔΫ࣮ੇΑΓେ͖Ίʹ࡞Δɻ "QQMFͷ3FUJOBσΟεϓϨΠ ߴղ૾εΫϦʔϯ ʹରԠ͍ͯ͠ͳ͍ը૾ɺ J1IPOFͳͲͷߴղ૾σΟεϓϨΠͰɺ΅͚ͯදࣔ͞Εͯ͠·͍·͢ɻ࣮ ੇΑΓഒɾഒͷαΠζͷը૾Ͱ࡞͠ɺ$44ͰഒࢦఆΛ͠·͢ɻ