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サイトをデザインする技術.pdf
Search
keita
December 22, 2019
Design
1
380
WEBサイトをデザインする技術.pdf
keita
December 22, 2019
Tweet
Share
More Decks by keita
See All by keita
富山デザイン勉強会_デザイン経営.pdf
keita_yoshikawa
0
23
アップロード-職業訓練_ワンランク上に見せるデザインのコツ.pdf
keita_yoshikawa
0
49
富山デザイン勉強会_デザイントレンド2025.pdf
keita_yoshikawa
0
170
アップロード職業訓練-デザインで使える写真撮影と画像補正.pdf
keita_yoshikawa
0
47
アップロード職業訓練-誰でも使える写真撮影テクニックのコピー.pdf
keita_yoshikawa
0
25
富山デザイン勉強会_私がデザインのために考えていること.pdf
keita_yoshikawa
0
56
富山デザイン勉強会10-読む人を動かす_効果的な文章の書き方.pdf
keita_yoshikawa
2
87
富山デザイン勉強会_ワンランク上に見せるデザインのコツ.pdf
keita_yoshikawa
0
160
富山デザイン勉強会_デザイナー経験ゼロからデザイン職に就く方法.pdf
keita_yoshikawa
0
84
Other Decks in Design
See All in Design
成長する組織のナレッジベースのつくりかた_知識基盤のデザインとメタデザイン
gaussbeam
0
900
Hybrid NW Infra Design Review: Classic Pattern including Outposts & Route 53 Profile
ichichi
2
400
Generating Momentum | Yasuhiro Yokota
yasuhiroyokota
1
250
最速[要出典]アクセシビリティチェック
magi1125
2
220
Personal Story Sequence - Vendetta(WIP)
elrns88
0
420
250131_product meetup
motokoishida
0
120
ZKK_001.pdf
nicholaspegu
0
1.5k
How to go from research data to insights?
mastervicedesign
0
230
藤本佳子・ポートフォリオ・2025/01
yoshi_designer
0
3.7k
デザインシステムの力 Webデザイナーとエンジニアのための実践ガイド / The Power of Design System
spindle
9
5k
株式会社デイトラ様│コーポレートサイト│コンセプトシート
haruka_capeo
0
510
私たちは、世界とデザインの〝次の一歩〟を、どこへ向けるか。
tkhr_kws
2
290
Featured
See All Featured
Unsuck your backbone
ammeep
669
57k
Building a Modern Day E-commerce SEO Strategy
aleyda
38
7.1k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
160
15k
How to Ace a Technical Interview
jacobian
276
23k
GraphQLの誤解/rethinking-graphql
sonatard
68
10k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
Building Adaptive Systems
keathley
40
2.4k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
49
2.3k
RailsConf 2023
tenderlove
29
1k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
656
59k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
175
52k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
10
1.3k
Transcript
01 ϯ σ β Π ษ ڧ ձ ذ ͗
ෞ ; Ҋ ਤ E FTJHO ʰ8&#αΠτΛσβΠϯ͢Δٕज़ʱ スライド数 62 ページ DERA-design
σ ಈ 02 8&#αΠ τͷ σβΠ ϯΛ͢Δʹ ෯͍ٕज़͕ඞཁ DERA-design
σβΠϯ ϓϩάϥ ࣸਅ ը 03 ίʔσΟϯά ઃܭ σβΠϯ ίʔσΟϯά ϓϩάϥϜ
4&0 ࣸਅ Πϥετ ઃܭ ಈը DERA-design
ϥϜ 04 ଟ͘ ͷࣄΛߟ͑ͯ σβΠ ϯΛ͠ͳ͚Ε ͳΒͳ͍ DERA-design
05 8&#αΠ τͷ ߟ͑ͳͯ͘ͳΒͳ͍͜ͱ $"15&3 DERA-design
06 $"15&38&#αΠτͷߟ͑ͳͯ͘ͳΒͳ͍͜ͱ ੍࡞ϑϩʔ ΞδϟΠϧ Υʔλʔϑ Υʔϧ ։ൃ ϦϦʔε ։ൃ
ϦϦʔε ઃܭ ઃܭ ߏங ߏங ઃܭ ઃܭ ߏங ߏங ઃ ܭ ઃ ܭ σ β Π ϯ σ β Π ϯ ϓ ϩ ά ϥ Ϝ ϓ ϩ ά ϥ Ϝ ς ε τ ς ε τ Ϧ Ϧ ồ ε Ϧ Ϧ ồ ε ఆ ٛ ఆ ٛ DERA-design
4 07 $"15&38&#αΠτͷߟ͑ͳͯ͘ͳΒͳ͍͜ͱ $.4 DERA-design
4&0 Πϥετ 08 $"15&38&#αΠτͷߟ͑ͳͯ͘ͳΒͳ͍͜ͱ 8&#αΠτͷ෯ 8&# αΠτͷσβΠϯ ʹը໘αΠζ͕Өڹ͠ ·͢ɻ ݱࡏͷը໘αΠζ
ͷγΣΞΛ͓ͬͯ͘ඞ ཁ͕͋Γ·͢ DERA-design
09 $"15&38&#αΠτͷߟ͑ͳͯ͘ͳΒͳ͍͜ͱ ΧϥϜ DERA-design
10 $"15&38&#αΠτͷߟ͑ͳͯ͘ͳΒͳ͍͜ͱ ϨεϙϯγϒσβΠϯ શͯͷը໘αΠζͰਖ਼͘͠ද ࣔ͞ΕΔΑ͏ʹઃܭΛ͢Δඞ ཁ͕͋Γ·͢ɻ ࠷ۙͰ 4&0 ʹӨڹΛ͠·͢ɻ DERA-design
11 $"15&38&#αΠτͷߟ͑ͳͯ͘ͳΒͳ͍͜ͱ ϒϨΠΫϙΠϯτ ը໘αΠζͷͲ͜ͰସΔ͔ΛܾΊΔ DERA-design
12 $"15&38&#αΠτͷߟ͑ͳͯ͘ͳΒͳ͍͜ͱ 4&0 8&#αΠτͷσβΠϯͰ 4&0Γͤ·ͤΜɻ গͳ͔ΒͣݟͨʹӨ ڹ͕͋Γ·͢ɻ DERA-design
13 $"15&38&#αΠτͷߟ͑ͳͯ͘ͳΒͳ͍͜ͱ දࣔεϐʔυ දࣔεϐʔυͷߴԽ շదʹӾཡͯ͠Β͏ͨ ΊʹඞਢͰ͢ɻ4&0ʹ ӨڹΛٴ΅͠·͢ɻ DERA-design
14 $"15&38&#αΠτͷߟ͑ͳͯ͘ͳΒͳ͍͜ͱ 3FUJOBσΟεϓϨΠ J.BDJ1IPOFͳͲʹ࠾༻ ͞Ε͍ͯΔ 3FUJOB σΟε ϓϨΠɺ ը૾ͷղ૾Λ େ͖͘͠ͳ͚ΕͳΓ·
ͤΜɻ DERA-design
15 $"15&38&#αΠτͷߟ͑ͳͯ͘ͳΒͳ͍͜ͱ ֦ுੑ 8&# αΠτ࡞ͬͯऴΘ ΓͰ͋Γ·ͤΜɻ ֦ு ΛͰ͖ΔΑ͏ʹߟ͓͑ͯ ͔ͳ͚Ε͍͚·ͤΜɻ DERA-design
16 $"15&38&#αΠτͷߟ͑ͳͯ͘ͳΒͳ͍͜ͱ ΞΫηγϏϦςΟ 8&# αΠτΛࢹ֮ͷऑ͍ํ ͕ݟΔ߹͋Γ·͢ɻ ߹ ʹΑͬͯΞΫηγϏϦςΟ ߟ͑ͳ͚Ε͍͚·ͤΜɻ DERA-design
17 8&#σβΠϯͷ ϙΠϯτ $"15&3 DERA-design
18 $"15&38&#αΠτͷϙΠϯτ ϑΝʔετϏϡʔ 8&#αΠτΛݟΔͱ͖ϢʔβʔඵͰஅ͢Δ DERA-design
19 $"15&38&#αΠτͷϙΠϯτ ϢʔβϏϦςΟɾಋઢ ΫϦοΫͰ͖ΔϘλϯʹϧʔϧΛܾΊΔ ओཁͳΞΫγϣϯͰͳ͍ͱ͖ɺ ωΨςΟϒͳΞΫγϣϯʹ ߇͑Ίͳ৭͍Λ͠Α͏ɻ HOME Works Accsess
Media Submit Cancel DERA-design
20 $"15&38&#αΠτͷϙΠϯτ ΠϯλʔϑΣΠε ΫΠοΫݕࡧ " # $
% 4VO .PO 5VF 8FE 5IV 'SJ 4BU DERA-design
21 $"15&38&#αΠτͷϙΠϯτ ݟग़͠σβΠϯ ڞ௨͢Δ෦ͷΫΦϦςΟΛ্͛Δ DERA-design
22 $"15&38&#αΠτͷϙΠϯτ όφʔ 8&#αΠ τʹΑ͘͜ͷΑ ͏ͳόφʔ͕͋Γ·͢ɻ ૉૣ͖͘Ε͍ʹ࡞ΕΔͱ ࣄ͕͔ͲΓ·͢ɻ DERA-design
23 $"15&38&#αΠτͷϙΠϯτ ྻ ςΩετਤͷ಄ޙΖΛɺ ͖Ε͍ʹͦΖ͑ΔͷجຊͰ͢ɻ DERA-design
24 $"15&38&#αΠτͷϙΠϯτ ༨നͷϧʔϧ ༨നؔ࿈ੑͷڧ͍ͷ΄Ͳখ͞ ͘ͳΓ·͢ɻ ֎ଆ͔Βଆ༨ന ͕খ͘͞ͳ͍ͬͯ͘Α͏ʹ͠· ͠ΐ͏ɻ DERA-design
25 $"15&38&#αΠτͷϙΠϯτ ϥΠςΟϯά จষΛॻ͘͜ͱඞཁ ʹͳ͖ͬͯ·͢ɻ ݪߘ ͕ແ͍߹Α͘ͳ͍ ߹ϥΠςΟϯά͠ ·͢ɻ DERA-design
26 8&#σβΠϯͷ ςΫχ ο Ϋ ͱίπ $"15&3 DERA-design
27 $"15&38&#σβΠϯͷςΫχοΫͱίπ ͋͑ͯϋϛग़͢ ྻ͍ͯ͠Δதʹ͋͑ͯϋϛग़ ͢͜ͱͰڧௐ͠·͢ɻ େͳϨΠΞτΠϯύΫ τͷ ͋ΔσβΠϯΛ࡞Ε·͢ɻ DERA-design
28 $"15&38&#σβΠϯͷςΫχοΫͱίπ ཁૉΛॏͶΔ ཁૉΛॏͶΔ͜ͱͰσβΠϯʹมԽΛ ͚ͭΔ͜ͱ͕Ͱ͖·͢ɻ ද่͕ࣔΕͳ͍ Α͏ʹҙ͠·͠ΐ͏ɻ DERA-design
29 $"15&38&#σβΠϯͷςΫχοΫͱίπ ಈ͖Λ͚ͭΔ దʹΞχϝʔγϣϯΛ ͚ͭΔ͜ͱɺϦονͳ σβΠϯΛ࡞Δํ๏ͷҰ ͭͰ͢ɻ DERA-design
30 $"15&38&#σβΠϯͷςΫχοΫͱίπ ಈը എܠಈը࠷ۙͷྲྀߦͰ ͢ɻ ද͕ࣔ͘ͳΔ͜ͱ ʹҙΛ͠·͠ΐ͏ɻ DERA-design
31 $"15&38&#σβΠϯͷςΫχοΫͱίπ ࣼΊʹ͢Δ ཁૉʹ͖Λ͚ͭΔ͜ͱͰΛ Ҿ͖·͢ɻ σβΠϯͷ෯Λ͛Δ ͜ͱʹͳΓ·͢ɻ ɻ IUUQXXXUCXBIBLVIPEPDPKQ DERA-design
32 $"15&38&#σβΠϯͷςΫχοΫͱίπ ڧऑΛେ͖͘͢Δ ΦʔόʔαΠζͷࣸਅΛ ͏͜ͱͰɺμΠφϛο ΫͰΠϯύΫτͷ͋Δ 8&# αΠτ͕Ͱ͖·͢ɻ DERA-design
$"15&38&#σβΠϯͷςΫχοΫͱίπ CMFOENPEF ը૾ʹ৭ΛॏͶΔ͜ͱ͕Մೳɻ *&Ͱ͑ͳ͍ͷ͕ɻ 33 DERA-design
34 $"15&38&#σβΠϯͷςΫχοΫͱίπ খٕ͍Ζ͍Ζ ホーム Home おしらせ News 採用情報 Recruit ホーム
おしらせ 採用情報 ホーム おしらせ 採用情報 ˔ӳޠදهΛՃ͑Δ ˔ܩઢΛ͚ͭΔ ˔ΞΠίϯΛ͚ͭΔ DERA-design
35 8&#αΠ τͷ ࡞Γํϝι ο υ $"15&3 DERA-design
$"15&38&#αΠτͷ࡞Γํϝιου λϒϨοτϑΝʔετ 36 IUUQTXQZBUOFUDPN Q DERA-design
$"15&38&#αΠτͷ࡞Γํϝιου λϒϨοτϑΝʔετ 1$λϒϨοτͷ֦ு͞Ε ͨͷɺ εϚʔτϑΥϯλ ϒϨο τΛॖখͨ͠ͷͱ ߟ͑ͯλϒϨο τͷσβΠϯ ΛઌʹܾΊΔɻ
37 DERA-design
$"15&38&#αΠτͷ࡞Γํϝιου σβΠϯίʔσΟϯά %&4*(/ $0%*/( 38 DERA-design
$"15&38&#αΠτͷ࡞Γํϝιου σβΠϯίʔσΟϯά ίʔσΟϯά͠ͳ͕ΒσβΠϯ มԽ͢Δɻ ͘͠ίʔσΟϯά ͠ͳ͕ΒσβΠϯ࡞Δɻ શମ૾ΛΠϝʔδ͢Δ͜ͱͱɺࡉ ෦Λత֬ʹஅ͢Δ͜ͱ͕ॏཁɻ 39 DERA-design
40 8&#αΠ τͷ ੍࡞ྫ $"15&3 DERA-design
41 $"15&38&#αΠτͷ੍࡞ྫ λχΧిث IUUQTUBOJDBKQ DERA-design
42 $"15&38&#αΠτͷ੍࡞ྫ ٢ཆܲ IUUQTZPTIJLBXBZPVLFJDPN IUUQTZPTIJLBXBZPVLFJDPN DERA-design
43 $"15&38&#αΠτͷ੍࡞ྫ λχΧిث ʢञʣ IUUQTTVCBSVZBDPNBNB[BLF DERA-design
44 $"15&38&#αΠτͷ੍࡞ྫ ϤʔάϧςΟΞ130 IUUQTUBOJDBKQZPHVSUJBQSP DERA-design
45 $"15&38&#αΠτͷ੍࡞ྫ ൘ଂ IUUQTJUBLVSBXPPEDPN DERA-design
46 $"15&38&#αΠτͷ੍࡞ྫ ൘ଂ ʢϥϯσΟϯάϖʔδʣ IUUQTJUBLVSBXPPEDPNJUBLVSBTQ DERA-design
47 $"15&38&#αΠτͷ੍࡞ྫ ൘ଂϑΝΫτϦʔ IUUQTJUBLVSBGBDUPSZDPN DERA-design
48 $"15&38&#αΠτͷ੍࡞ྫ ຊ৺ଁ݂֎Պֶձ IUUQTQMB[BVNJOBDKQdKTDWT IUUQTUBOJDBKQ DERA-design
49 $"15&3ΠϯϑΥάϥϑΟ οΫͷ੍࡞ྫ ͗;ͷωοτ IUUQTHJGVOPLJOFUDPVODJM DERA-design
50 8&#αΠ τ ҭ͍ͯͯ͘ͷ $"15&3 DERA-design
51 $"15&38&#αΠτҭ͍ͯͯ͘ͷ 1%$" ʮ1MBOʹܭ ըʯ ʮ%Pʹ࣮ ߦʯ ʮ$IFDLʹධՁʯ ʮ"DUJPOʹվ ળʯσβΠϯվળ͍ͯ͘͠
ඞཁ͕͋Γ·͢ɻ DERA-design
52 ϒϩάΛॻ͍ͯΞΫηε Λ͋ͭΊ·͢ɻ σβΠϯͷ ςϯϓϨʔτΛ࡞͓ͬͯ ͖·͠ΐ͏ɻ $"15&38&#αΠτҭ͍ͯͯ͘ͷ ίϯςϯπϚʔέςΟϯά DERA-design
53 $"15&38&#αΠτҭ͍ͯͯ͘ͷ ΞΫηεղੳ ΞΫηεΛղੳ͢Δ͜ͱͰɺ ͕Θ͔ΓσβΠϯΛ มߋ͢Δ͜ͱ͋Γ·͢ɻ DERA-design
54 ͦͷଞͷٕज़ $"15&3 DERA-design
55 $"15&3ͦͷଞͷٕज़ ϥϑΧϯϓͷׂ ϥϑΧϯϓͷׂ σβΠϯͷ֬ೝ͚ͩͰ ͳ͘ɺ ΫϥΠΞϯτͷ৺ ʹՐΛ͚ͭΔ͜ͱͰ͢ɻ DERA-design
αʔϏεΛσβΠϯ͢Δ 56 $"15&3ͦͷଞͷٕज़ 8&#αΠτͷσβΠϯΛվળͯ͠ˋͷ্ঢ͕ݶք DERA-design
57 $"15&3ͦͷଞͷٕज़ ίʔσΟϯάͷࢦࣔ σβΠϯͱίʔσΟ ϯάΛ ۀ͢Δ߹ɺࢥͬͨͱ ͓Γʹ্͕Βͳ͍͜ͱ ͕͋Γ·͢ɻ DERA-design
58 ·ͱΊ DERA-design
59 ˔8&#αΠτͷσβΠϯٕज़ෳ߹త ˔ߟ͑Δ͜ͱ͕ͨ͘͞Μ͋ͬͯେม ˔ࣗͳΓͷ࡞ΓํΛݟ͚͍ͭͯ͘ ˔8&#αΠτҭ͍ͯͯ͘ͷͰ͋Δ ·ͱΊ DERA-design
60 ࢀߟհ DERA-design
61 ˔ΈΜͳͰߟ͑ɺΧΠθϯ͢Δɻ6*σβΠϯ ˔͔ͩΒɺͦͷσβΠϯμϝͳΜͩɻ ˔8&#σβΠϯجૅೖ ࢀߟհ DERA-design
62 Ҏ্ɺ ͝ਗ਼ௌ ͋Γ͕ͱ͏ ͍͟͝·ͨ͠ DERA-design