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
Tetsuhiro Sato
July 10, 2013
Design
0
190
出来ると嬉しいWebデザイナーのコーディング
AWDD#4 (
http://atnd.org/event/awdd04
) で発表に使用したスライドです。
Tetsuhiro Sato
July 10, 2013
Tweet
Share
More Decks by Tetsuhiro Sato
See All by Tetsuhiro Sato
oremega
oremega
1
1.1k
初心者向けざっくりHTML/CSSコーディングハンズオン資料
oremega
2
2.4k
デザイナー向けコーディング講座
oremega
4
1.8k
Other Decks in Design
See All in Design
Information Architects: The Missing Link in Design Systems
soysaucechin
0
260
知を活かせるチームづくりとは?-MIMIGURIで実践している「全員探究」の仕組みと文化づくり-
chiemitaki
1
540
Blender 4.1 で レッツ Vket Cloud!
kamera25
0
260
アクセシビリティのはじめかた デザイナー編
tokimari
3
1.1k
Breaking News on the Web
souvikdg
0
660
Карта процесса-опыта. Презентация метода
ashapiro
0
170
Pizza Trail v2
jerfusart
0
110
0→1でデザイナーは何とむきあうのか? / 0→1 Meetup 〜多様な0→1フェーズにおけるデザイナーの働き方〜 / Yasuhiro Yokota
yasuhiroyokota
1
460
丸井グループが取り組むエンタープライズアジャイルと プロダクトマネージャーの役割
muture
3
1.4k
202409_会社概要資料_Englishver.pdf
zakkerooni
0
160
ZOZO CDO Office Design
zozodevelopers
PRO
1
130
情報サービスユニット UXUIチーム紹介/btobuxui
nikkei_engineer_recruiting
2
190
Featured
See All Featured
Learning to Love Humans: Emotional Interface Design
aarron
270
40k
jQuery: Nuts, Bolts and Bling
dougneiner
61
7.4k
Imperfection Machines: The Place of Print at Facebook
scottboms
263
13k
Six Lessons from altMBA
skipperchong
26
3.3k
Practical Orchestrator
shlominoach
185
10k
Thoughts on Productivity
jonyablonski
66
4.2k
What's in a price? How to price your products and services
michaelherold
242
11k
Building a Modern Day E-commerce SEO Strategy
aleyda
36
6.8k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
0
96
Optimising Largest Contentful Paint
csswizardry
30
2.8k
The Straight Up "How To Draw Better" Workshop
denniskardys
230
130k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
45
4.8k
Transcript
ग़དྷΔͱخ͍͠ 8FCσβΠφʔͷίʔσΟϯά AWDD #4 ࠤ౻༟ AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10
137݄11༵
ࣗݾհ AWDD #4 ΞϥΠυΞʔΩςΫπגࣜձࣾ ࠤ౻༟5FUTVIJSP4BUP େֶଔۀޙʹ੍࡞ձࣾΛࣾܦݧ͠ɺ ݱࡏɺΞϥΠυΞʔΩςΫπגࣜձࣾͰ 8FCσβΠφʔͱͯ͠ΞϓϦɺαʔϏεʹ ܞΘ͍ͬͯ·͢ɻ झຯணɾςχε
!PSFNFHB AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 137݄11༵
͜ͷηογϣϯͷྲྀΕ AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 AWDD #4 σβΠφʔͱͯ͠ίʔσΟϯάΛ֮͑ͨྲྀΕ ίʔσΟϯάͷϝϦοτͱεΩϧηοτ
ϞχϓϥͰ͓͜ͳ͍ͬͯΔ͜ͱ ͜ͷεϥΠυޙγΣΞ͠·͢ɻ 137݄11༵
σβΠφʔͱͯ͠ίʔσΟϯά Λ֮͑ͨྲྀΕ AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 1 AWDD #4
1.σβΠφʔͱͯ͠ίʔσΟϯάΛ֮͑ͨྲྀΕ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 AWDD #4 1.σβΠφʔͱͯ͠ίʔσΟϯάΛ֮͑ͨྲྀΕ 20 100
over 3 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 20 100 over 3
AWDD #4 1.σβΠφʔͱͯ͠ίʔσΟϯάΛ֮͑ͨྲྀΕ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 )5.-ϝʔϧͷ੍࡞Ͱ UBCMFίʔσΟϯάΛ֮͑ͨ AWDD #4 1.σβΠφʔͱͯ͠ίʔσΟϯάΛ֮͑ͨྲྀΕ
137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 UBCMFίʔσΟϯά <table border=4 width=250 align=center>
<tr bgcolor="#cccccc"> <th><br></th> <th>ྻ-A</th> <th>ྻ-B</th> <th>ྻ-C</th> </tr> <tr align=center> <td>ߦ-1</td> <td>A1</td> <td>B1</td> <td rowspan=2>C1-C2</td> </tr> <tr align=center> <td>ߦ-2</td> <td>A2</td> <td>B2</td> </tr> <tr align=center> <td>ߦ-3</td> <td>A3</td> <td colspan=2>B3-C3</td> </tr> </table> ྻʔA ྻʔB ྻʔC ߦ-1 A1 B1 C1-C2 ߦ-2 A2 B2 C1-C2 ߦ-3 A3 B3-C3 B3-C3 AWDD #4 1.σβΠφʔͱͯ͠ίʔσΟϯάΛ֮͑ͨྲྀΕ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 AWDD #4 1.σβΠφʔͱͯ͠ίʔσΟϯάΛ֮͑ͨྲྀΕ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 AWDD #4 1.σβΠφʔͱͯ͠ίʔσΟϯάΛ֮͑ͨྲྀΕ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 AWDD #4 1.σβΠφʔͱͯ͠ίʔσΟϯάΛ֮͑ͨྲྀΕ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 AWDD #4 1.σβΠφʔͱͯ͠ίʔσΟϯάΛ֮͑ͨྲྀΕ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 ͜ͷϧʔϓΛ܁Γฦ͢͜ͱͰ ͷαΠΫϧ͕Ͱ͖Δɻ AWDD #4 1.σβΠφʔͱͯ͠ίʔσΟϯάΛ֮͑ͨྲྀΕ
137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 ͜ͷࠒʹͳΔͱ9)5.- $44Ͱ ίʔσΟϯάΛ͢ΔΑ͏ʹͳΔ AWDD #4
1.σβΠφʔͱͯ͠ίʔσΟϯάΛ֮͑ͨྲྀΕ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 9)5.-ɿจॻߏ $44ɿ০ AWDD #4 1.σβΠφʔͱͯ͠ίʔσΟϯάΛ֮͑ͨྲྀΕ
137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 Ұ௨Γͷ͜ͱ ग़དྷΔΑ͏ʹͳ͖ͬͯͨɻ ͔͠͠ AWDD #4
1.σβΠφʔͱͯ͠ίʔσΟϯάΛ֮͑ͨྲྀΕ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 AWDD #4 1.σβΠφʔͱͯ͠ίʔσΟϯάΛ֮͑ͨྲྀΕ ͕ࣗͲΕ͘Β͍Ͱ͖Δͷ͔ Α͔͘Βͳ͍ʁ
137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 ηϛφʔʹߦ͘Α͏ʹͳΔɻ AWDD #4 1.σβΠφʔͱͯ͠ίʔσΟϯάΛ֮͑ͨྲྀΕ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 ࣗ ʮશવग़དྷͯͳ͍͡ΌΜʂʯ AWDD #4 1.σβΠφʔͱͯ͠ίʔσΟϯάΛ֮͑ͨྲྀΕ
137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 ొஃऀΛ5XJUUFSͰϑΥϩʔͯ͠ɺ ใΛಘΔɻ AWDD #4 1.σβΠφʔͱͯ͠ίʔσΟϯάΛ֮͑ͨྲྀΕ
137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 ͞ΒʹɺηϛφʔͰΓ߹ͬͨਓͨͪʹ ࣭͢ΔΑ͏ʹͳͬͨɻ AWDD #4 1.σβΠφʔͱͯ͠ίʔσΟϯάΛ֮͑ͨྲྀΕ
137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 ͜͜·ͰΛ·ͱΊΔͱ AWDD #4 1.σβΠφʔͱͯ͠ίʔσΟϯάΛ֮͑ͨྲྀΕ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 ࣄͱͯ͠ ʮΒͳ͚ΕͳΒͳ͍ঢ়گʯ ͜Ε͕Ұ൪ͷۙಓʂ AWDD #4
1.σβΠφʔͱͯ͠ίʔσΟϯάΛ֮͑ͨྲྀΕ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 ʮָ͍͠ʯ ͱࢥ͑Δ͜ͱ AWDD #4 1.σβΠφʔͱͯ͠ίʔσΟϯάΛ֮͑ͨྲྀΕ
137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 20 100 over 3
AWDD #4 1.σβΠφʔͱͯ͠ίʔσΟϯάΛ֮͑ͨྲྀΕ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 ϥϯσΟϯάϖʔδͷ੍࡞Λ ͍ͯ͠·ͨ͠ɻ AWDD #4 1.σβΠφʔͱͯ͠ίʔσΟϯάΛ֮͑ͨྲྀΕ
137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 σΟϨΫλʔ͕͍ͳ͍ͷͰɺɺɺ AWDD #4 1.σβΠφʔͱͯ͠ίʔσΟϯάΛ֮͑ͨྲྀΕ 137݄11༵
Coding AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 Direction Design AWDD #4
1.σβΠφʔͱͯ͠ίʔσΟϯάΛ֮͑ͨྲྀΕ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 Ұ؏੍ͨ͠࡞Λߦ͑ΔͷͰɺ ϫϯετοϓͰࣄ͕ߦ͑ͨɻ AWDD #4 1.σβΠφʔͱͯ͠ίʔσΟϯάΛ֮͑ͨྲྀΕ
137݄11༵
ίʔσΟϯάͷϝϦοτͱ εΩϧηοτ 2 AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 AWDD #4
2.ίʔσΟϯάͷϝϦοτͱεΩϧηοτ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 ϝϦοτͬͯͳʹʁ AWDD #4 2.ίʔσΟϯάͷϝϦοτͱεΩϧηοτ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 ίʔσΟϯά͕Θ͔Δ͜ͱͰ ߏతͳσβΠϯ͕ߦ͑Δ AWDD #4 2.ίʔσΟϯάͷϝϦοτͱεΩϧηοτ
137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 KTDTTͰදݱ͞ΕΔ ಈ͖ͷ͋ΔσβΠϯ͕ఏҊͰ͖Δɻ AWDD #4 2.ίʔσΟϯάͷϝϦοτͱεΩϧηοτ
137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 ؙ֯ɺάϥσʔγϣϯɺ ಁաɺυϩοϓγϟυͳͲͷ දݱͷબ͕Ͱ͖Δɻ AWDD #4
2.ίʔσΟϯάͷϝϦοτͱεΩϧηοτ AWDD#4 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 ٯʹ σϝϦοτʁ AWDD #4 2.ίʔσΟϯάͷϝϦοτͱεΩϧηοτ
137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 ίʔσΟϯά͕Ͱ͖ΔͷͰɺ γϯϓϧͳߏʹͳΔΑ͏ʹ σβΠϯ͕ͪ͠ɻ ݸਓࠩ͋Γ AWDD
#4 2.ίʔσΟϯάͷϝϦοτͱεΩϧηοτ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 ͔͠͠ ٯʹݴ͑ίʔσΟϯά͕ Θ͔Δ͜ͱͰ AWDD #4
2.ίʔσΟϯάͷϝϦοτͱεΩϧηοτ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 ίʔμʔͱ ʮڞ௨ݴޠʯ ͰͤΔɻ AWDD #4
2.ίʔσΟϯάͷϝϦοτͱεΩϧηοτ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 ίʔμʔʹίʔσΟϯάͷઆ໌͕ ͪΌΜͱͰ͖Δɻ AWDD #4 2.ίʔσΟϯάͷϝϦοτͱεΩϧηοτ
137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 ͡Ό͋ɺ εΩϧηοτͬͯͲ͏ͳΔͷʁ AWDD #4 2.ίʔσΟϯάͷϝϦοτͱεΩϧηοτ
137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 Design WebDesign Coding Direction Programming
Marketing Planning AWDD #4 2.ίʔσΟϯάͷϝϦοτͱεΩϧηοτ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 Design ? ? ͍ۙ ԕ͍
ԕ͍ AWDD #4 2.ίʔσΟϯάͷϝϦοτͱεΩϧηοτ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 Design Coding UI/UX ͍ۙ ԕ͍
ԕ͍ AWDD #4 2.ίʔσΟϯάͷϝϦοτͱεΩϧηοτ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 AWDD #4 2.ίʔσΟϯάͷϝϦοτͱεΩϧηοτ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 ·ʙ ʮίʔσΟϯάͯ͠ΈΑ͏ͥʂʯ AWDD #4 2.ίʔσΟϯάͷϝϦοτͱεΩϧηοτ
137݄11༵
ϞχϓϥͰߦͳ͍ͬͯΔ͜ͱ 3 AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 AWDD #4 3.ϞχϓϥͰ͓͜ͳ͍ͬͯΔ͜ͱ
137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 20 100 over 3
AWDD #4 3.ϞχϓϥͰ͓͜ͳ͍ͬͯΔ͜ͱ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 AWDD #4 3.ϞχϓϥͰ͓͜ͳ͍ͬͯΔ͜ͱ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 AWDD #4 3.ϞχϓϥͰ͓͜ͳ͍ͬͯΔ͜ͱ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 Ϟχϓϥ'*/% AWDD #4 3.ϞχϓϥͰ͓͜ͳ͍ͬͯΔ͜ͱ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 AWDD #4 3.ϞχϓϥͰ͓͜ͳ͍ͬͯΔ͜ͱ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 ৽نϢʔβʔ͕ҎલΑΓ ഒ ʹͳΓ·ͨ͠ɻ AWDD #4
3.ϞχϓϥͰ͓͜ͳ͍ͬͯΔ͜ͱ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 ϥϯσΟϯάϖʔδͷ੍࡞ AWDD #4 3.ϞχϓϥͰ͓͜ͳ͍ͬͯΔ͜ͱ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 AWDD #4 3.ϞχϓϥͰ͓͜ͳ͍ͬͯΔ͜ͱ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 AWDD #4 3.ϞχϓϥͰ͓͜ͳ͍ͬͯΔ͜ͱ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 AWDD #4 ࣄͱͯ͠ ͜Ε͕Ұ൪ͷۙಓʂ ·ʙ
ʮίʔσΟϯάͯ͠ΈΑ͏ͥʂʯ ʮָ͍͠ʯ ͱࢥ͑Δ͜ͱ ʮΒͳ͚ΕͳΒͳ͍ঢ়گʯ 137݄11༵
AWDD #4 ग़དྷΔͱخ͍͠ WebσβΠφʔͷίʔσΟϯά 2013.7.10 AWDD #4 ͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ɻ 137݄11༵