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
Koji Kuno
July 25, 2017
Design
1
850
グラフィックデザイナーさん向け Webについて学習するときに押さえておくべき点
グラフィックデザイン専門の制作会社さんにて、今後Webの仕事を広げていく上で知っておくべき”さわり”程度の内容をレクチャーするためのスライド
Koji Kuno
July 25, 2017
Tweet
Share
More Decks by Koji Kuno
See All by Koji Kuno
unitoneが楽しくなるまでの道のり
oleindesign
0
85
WordPress 6.5 の新機能紹介
oleindesign
0
120
How to deal with WordPress themes in the future
oleindesign
0
1.6k
WordPress(再)入門 - 運用・学習編
oleindesign
0
210
WordPress(再)入門 - カスタマイズ編
oleindesign
0
240
WordPress(再)入門 - コンテンツ作成方法編
oleindesign
0
200
WordPress(再)入門 - テーマ・プラグイン編 / introduction-to-wordpress-again-theme-plugin
oleindesign
0
220
WordPress(再)入門 - 基本設定編 / introduction-to-wordpress-again-basic-settings
oleindesign
0
440
WordPress(再)入門 - 基礎知識・環境編
oleindesign
2
980
Other Decks in Design
See All in Design
Мышление дизайнера историями. Как текстовые модели человеческого поведения помогают проектировать
ashapiro
0
400
デザイナー向けフライル説明資料
toshiblues
0
130
Yahoo!フリマ:生成AI利用機能ならではのインターフェース設計について / Yahoo! JAPAN Flea Market: Interface Design Specific to Generative AI Utilization Features
lycorptech_jp
PRO
0
460
UXデザインはなぜ定着しないのか?
designstudiopartners
0
970
AI業務アプリケーションの体験デザイン
kazuhirokimura
0
170
The Spectacular Lies of Maps
axbom
PRO
1
280
新卒の目から見たサイボウズのデザイン組織
ryota5884
0
180
portfolio.pdf
onof003
0
160
1920*1080pxに設定したケース / Google Slide Size Test
arthur1
0
3.4k
「UXとUIの違い」v2
shirasu3
0
230
[2025.6.30 もがく中堅デザイナー、キャリアの分岐点] なんでもやる系デザイナーのもがきかた
taka_piya
1
3.4k
harutaka Vision Deck
zenkigenforrecruit
0
220
Featured
See All Featured
The Cost Of JavaScript in 2023
addyosmani
53
8.9k
Being A Developer After 40
akosma
90
590k
Imperfection Machines: The Place of Print at Facebook
scottboms
268
13k
[RailsConf 2023] Rails as a piece of cake
palkan
57
5.8k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
30
9.7k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
7
850
Become a Pro
speakerdeck
PRO
29
5.5k
Fireside Chat
paigeccino
39
3.6k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
229
22k
KATA
mclloyd
32
14k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
33
2.4k
Transcript
8FCʹֶ͍ͭͯश͢Δͱ͖ʹ ԡ͓͖͑ͯ͘͞ άϥϑΟοΫσβΠφʔ͞Μ͚
ࣗݾհ͍ͤͯͩ͘͞͞ʂ 0MFJO%FTJHOද ٱߊ࢘ʢ͘ͷ͜͏͡ʣ ܦྺɿذෞੜ·ΕɻେֶۚɻάϥϑΟο ΫσβΠϯઐֶߍଔۀˠࠂཧళ੍ ࡞෦ʹब৬ˠϩϯυϯʹ̎ཹֶˠҹձ ࣾฤू෦ʹब৬ˠϑϦʔϥϯεͱͯ͠ಠཱɻ 8PSE1SFTTϢʔβʔͷͨΊͷҬίϛϡχςΟɺ 8PSE#FODIذෞͷϞσϨʔλʔͱͯ͠׆ಈ͍ͯ͠·͢ɻ
ΞδΣϯμ ᶃ 8FCͬͯԿʁ ᶄ ΠϯλʔωοτͷΈͱʁ ᶅ άϥϑΟοΫσβΠϯͱ8FCσβΠϯͷҧ͍ͱʁ ᶆ 8FCαΠτ੍࡞ͷྲྀΕͱʁ ᶇ
8FCαΠτΛೲͨ͠ޙʹඞཁͳ͜ͱͱʁ ᶈ ·ͱΊ
8FCͬͯԿʁ
888ͱ w 8PSME8JEF8FCͷུ w ᥨͷ্ʹுΓ८Β͞ΕͨٿنใωοτϫʔΫ
Πϯλʔωοτͱ w ༷ʑͳॴʹ͋ΔҟͳΔίϯϐϡʔλΛͭͳ͗߹Θͤͨ ωοτϫʔΫࣗମͷ͜ͱ w ϗʔϜϖʔδ&$αΠτͷΑ͏ͳ8FCΞϓϦέʔγϣϯ ΛؚΜͩ888&ϝʔϧαʔϏεɺαʔόʔͱΫϥΠΞ ϯτؒͰͷϑΝΠϧసૹͳͲΛར༻Ͱ͖ΔͰ͋Δ
ݱࡏͷΠϯλʔωοτར༻ڥ Πϯλʔωοτ ࣸਅ Իָ ө૾ ςΩετ ύιίϯ ςϨϏ ΧʔφϏ εϚʔτϑΥϯ
ܞଳి ήʔϜػ
ΠϯλʔωοτͷΈͱʁ
αʔόʔͬͯͳʹʁ w Πϯλʔωοτ্ͷσʔλΛஔ͍͓ͯ͘ॴ w ಠࣗͰ༻ҙͨ͠ΓɺϨϯλϧͨ͠Γ͢Δ͜ͱ͕Ͱ͖Δ w Ϣʔβʔ͔Βͷཁٻ͕αʔόʔʹಧ͖ɺඞཁͳใΛૹ Γฦ͢͜ͱʹΑͬͯɺϢʔβʔଆͰΣϒαΠτΛදࣔ ͢Δ͜ͱ͕Ͱ͖Δ
υϝΠϯͱ w Πϯλʔωοτ্ͷॅॴͷΑ͏ͳͷ w ಠࣗʹऔಘͨ͠υϝΠϯΛαʔόʔʹඥ͚ͮΔ͜ͱʹΑͬ ͯɺυϝΠϯೖྗˠαʔόʔʹΞΫηεˠΣϒαΠτ දࣔ͞ΕΔɹͱͳΔ w DPNOFUPSHJOGPCJ[NFͳͲͳͲ
IUUQͱIUUQTͷҧ͍ w IUUQ)ZQFSUFYU5SBOTGFS1SPUPDPMͷུ w IUUQZBIPPDPKQͱZBIPPDPKQʹIUUQͰ௨৴ͯͩ͘͠ ͍͞ɺͱ͍͏໋ྩʹͳΔ w IUUQT)551PWFS44-5-4ͷུ w IUUQͷ௨৴Λ҉߸Խͯ͠ߦ͍·͢Αͱ͍͏ҙຯ
ͳΜͰ࠷ۙIUUQT͕ਪ͞ΕΔͷ͔ w ୈҰʹηΩϡϦςΟڧ͕૿͢ w (PPHMF͕ΣϒαΠτΛධՁ͢Δج४ͷ̍ͭͩͱެද͠ ͔ͨΒʢ)5514FWFSZXIFSFఏএʣ w IUUQTΛར༻͢Δʹূ໌ॻ͕ඞཁ w αʔόʔબͼͷࡍʹߟྀ͢Δඞཁ͕͋Δ
w ࠓޙ৽ઃ͢ΔΣϒαΠτIUUQTͰ࢝Ίͨํ͕ྑ͍
άϥϑΟοΫσβΠϯͱ 8FCσβΠϯͷҧ͍ͱʁ
୯Ґͷҧ͍ w άϥϑΟοΫʢ%51ʣͷ߹جຊ୯ҐϛϦϝʔτϧ w 8FCͷ߹QYʢϐΫηϧʣ
Χϥʔͷҧ͍ w %51$.:, w 8FCσβΠϯ3(# w ҹ̐৭ʹՃ͑ͯಛ৭ͳͲ༻͍Δ͕ݟ͑ํجຊత ʹಉ͡ w ϢʔβʔͷϞχλʔʹઃఆͯ͋͠ΔϓϩϑΝΠϧͰ৭࠼
ڥ͕େ͖͘ҟͳΔ
ମݧͷҧ͍ w ҹࢴͷ࣭ײഩԡ͠Ͱͷ৮ײͳͲΛମݧͰ͖Δ w 8FCΞχϝʔγϣϯϜʔϏʔɺޮՌԻԻָͳͲෳ ͷײ֮ʹ͑ΒΕΔ w ҹ͑ΒΕΔϝοηʔδͷྔ͕ཧతʹ੍ݶ͞Ε Δ w
8FCใྔͷ੍ݶཧతʹͳ͍͕ɺޮՌతʹૌٻ͠ ͳ͍ͱλʔήοτʹڹ͔ͳ͍
ίετόϥϯεͷҧ͍ w ҹޮՌଌఆˠमਖ਼ˠҹˠ w 8FCޮՌଌఆˠमਖ਼ˠޮՌଌఆˠमਖ਼ɾɾɾ w ͦΕͧΕඞཁͳίετʹҧ͍͕͋Δ w εϐʔυײʹҧ͍͕͋Δ w
8FCΫϥΠΞϯτ͕ίετΛΠϝʔδ͍͠ ʢҹʹൺͯʮ؆୯Ͱ͠ΐʁʯͱࢥΘΕ͍ͯΔͱ͜Ζ͕͋ΔͷͰݟੵΓ ༰Λཧղͯ͠Β͑ͳ͍࣌ͪΒ΄Βʣ
λʔήοτͷҧ͍ w ҹͰૂ͑Δλʔήοτͱ8FCͰૂ͑Δλʔήοτ େ͖͘ҧ͏ w ΫϥΠΞϯτͷϏδωεαʔϏεͷ༰छྨʹΑͬ ͔ͯͬ͠Γͱ͍͚Δඞཁ͕͋Δ
8FCαΠτ੍࡞ͷྲྀΕͱʁ
ώΞϦϯά w ΫϥΠΞϯτ͔ΒώΞϦϯάΛߦ͏ w άϥϑΟοΫσβΠϯ੍࡞ͷ༷ΛܾΊΔஈ֊Ͱಉ༷ ͷ͜ͱΛߦ͏ͣ w ղܾ͍ͨ͠Λ໌֬ʹͯ͠ɺํ๏Λߟ͑Δ w ඞͣ͠8FC͕࠷దͳ͑ͱݶΒͳ͍
ཁ݅ఆٛ w 8FC੍࡞ʹඞཁͳཁ݅ఆٛΛߦ͏ w ͜ͷஈ֊ͰܾΊΔ͜ͱΛ͓Ζ͔ͦʹ͢ΔͱɺϓϩδΣΫ τͷޙʹ่Εͯ͘Δ͜ͱ͕ଟ͍
ϫΠϠʔϑϨʔϜ w άϥϑΟοΫσβΠϯͰݴ͏ɺαϜωΠϧ w ͜ͷஈ֊Ͱը໘ߏΛ͔ͬ͠Γͱ٧Ί͓ͯ͘͜ͱ͕ඞཁ w ͜ͷઌͷఔͰߏ෦ͷมߋΛࢪ͢߹ɺ͕૿͑ ͯ࠷ऴతͳίετ͕Ε্͕Δ͜ͱʹͳΔ
ϫΠϠʔϑϨʔϜΛ࡞ΔΞϓϦ "EPCF9% 4LFUDI
σβΠϯ੍࡞ w *MMVTUSBUPS͘͠1IPUPTIPQ͕ओྲྀ w ઌ΄Ͳͷ"EPCF9%4LFUDIͰ݁͢Δ͜ͱͰ͖Δ w ϏδϡΞϧσβΠϯ͚ͩͰͳ͘ɺ͘ϢʔβʔମݧΛσ βΠϯ͢ΔΠϝʔδ͕ඞཁʢϗόʔ֤෦ΞχϝʔγϣϯͳͲͷಈ͖ͷ ࢦࣔඞཁʣ w
ϨΠϠʔ໊Λ͔ͬ͠Γͱ͚ͭͯɺσʔλΛ୭͕ݟͯΘ ͔Γ͘͢࡞ΔบΛ͚ͭΔ
ίʔσΟϯάɾ࣮ w )5.-$44+BWB4DSJQUͰίʔσΟϯά w $.4ʢ$POUFOUT.BOBHFNFOU4ZTUFNʣ Λ͏߹ʹɺͦΕʹͬͨ ఔ͕ൃੜ͢Δ߹͕͋Δ w දతͳ$.4ʹɺ8PSE1SFTT.PWBCMF5ZQFɺ DPODSFUFͳͲ͕͋Δ
w 8PSE1SFTTੈքதͷΣϒαΠτͷҎ্ΛΊΔγΣ ΞɻຊࠃͰ$.4γΣΞҎ্ͱѹతɻ
࣮ػςετ w ࣮ࡍʹར༻͢Δαʔόʔ͘͠ςεταʔόʔʹͯಈ ࡞֬ೝ w ରԠ͢ΔϒϥβσόΠεͰͷ࣮ػ֬ೝ w ݹ͍ϒϥβʹରԠ͢Δʹผίετ͕ඞཁͱߟ͑Δํ ͕ϕλʔ w
༷͕͔ͬ͠Γݻ·͍ͬͯͳ͍ͱςετͳ͊ͳ͊ʹͳͬ ͯ͠·͏
ೲ w ೲܗ༷ࣜʑ w ͲΜͳঢ়ଶͰೲ͔डͷλΠϛϯάͰඞܾͣΊΔ ˠޙ͔Βʮ͋Εͬͯʯ͕૿͑ͯ͘Δͱݟੵ่յ w ΣϒαΠτೲ͔ͯ͠Β͕ελʔτ
8FCαΠτΛೲͨ͠ޙʹ ඞཁͳ͜ͱͱʁ
ΣϒαΠτ੍࡞͕ऴྃͨ͠Β ࣍ΣϒαΠτӡӦͷ։࢝
͜Μͳ͜ͱ͕ඞཁʹͳΔ͔ʁ w 4/4ʢ5XJUUFSGBDFCPPLJOTUBHSBN-*/&ʣͷӡ༻ɾӡ༻ ߦɾӡ༻ΞυόΠε w ΞΫηεղੳʹΑΔ࣍ͷΞΫγϣϯબఆ w ผഔମ͔Βͷ13 w ϦεςΟϯάࠂग़ߘ
w ϥϯσΟϯάϖʔδ੍࡞ w ΦϯυϝσΟΞͷҭɾӡ༻
ΣϒαΠτΛ࡞ͬͨ ʹ ์͓͍ͬͯͯ0,
ٻΊΔ݁ՌΛಘΔͨΊʹ ʑվળΛ͍ͯ͘͠ͷ͕ ΣϒαΠτӡӦ
·ͱΊ
8FC੍࡞ຊʹΓͩ͘͞Μ w σΟϨΫγϣϯʢσΟϨΫλʔͷࣝʹఏҊͰ͖Δ෯ʣ w σβΠϯ੍࡞ ɾ੍࡞εϐʔυඞਢˠίετҙࣝ ɾ6*69ͷֶशকདྷతʹ͔ܽͤͳ͍ ɾݟͨΛ࡞Δ͚ͩͰະདྷͳ͍ˠʑࢼߦࡨޡ w ϑϩϯτΤϯυ
ɾ)5.-$44+BWB4DSJQUͷཧղσΟϨΫλʔɾσβΠφʔ ͱʹඞཁˠσβΠϯͷ࣮ݱํ๏ΛΠϝʔδ͢Δඞཁੑ
w όοΫΤϯυ ɾ8FCαʔϏεΛӡӦ͢Δ߹ʹαʔόʔͳͲͷࣝ ඞཁʹͳͬͯ͘Δ w ӡ༻ ɾΞΫηεղੳ ɾϚʔέςΟϯά ɾ4/4ʹؔ͢Δࣝ ɾϥΠςΟϯά
ɾΫϥΠΞϯτ͕ʑΉٙʹ͑Δྗʢࣝʣ
8FCຐ๏ͷಓ۩Ͱͳ͍ ཧ อक ӡ༻ w ʮਓྗʯΛ͔͚Δ͔ɺʮ͓ۚʯ Λ͔͚Δ͔ w ์͓͍ͬͯͯརӹΛੜΈग़͠ ͯ͘ΕΔຐ๏ͷಓ۩Ͱͳ͍
w ʮ̍ͭͷళฮʯʮҰਓͷࣾһʯ ΛҭͯΔɺͱߟ͑Α͏
ʮάϥϑΟοΫσβΠϯ͕Ͱ͖Δʯ ͱ͍͏ڧΈΛੜ͔͢ w άϥϑΟοΫσβΠϯͱ8FCσβΠϯڞ௨͢Δ෦ ଟ͍͕ߟ͑Δ͜ͱ͕ҧ͏෦͋Δ w ଟ֯తͳࢹΛ͍࣋ͬͯΔͱ͍͏ϝϦοτΛੜ͔͢ w άϥϑΟοΫྗʹΞχϝʔγϣϯΛՃ͑ͨΓετʔϦʔ Λఴ͑Δˠಈը੍࡞ؔ࿈ʹਐग़ՄೳʢαΠωʔδʣ
w άϥϑΟοΫྗʴίʔσΟϯάྗʹॏๅ͞ΕΔ
͝੩ௌ ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ