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
サービス作りのためにチームで取り組んだ5つの事
Search
Ohashi
August 10, 2016
Design
1
5.4k
サービス作りのためにチームで取り組んだ5つの事
Ohashi
August 10, 2016
Tweet
Share
More Decks by Ohashi
See All by Ohashi
デザイナーが知っておくべき iOS開発のあれこれ
ohanamizuki
2
7.5k
"お金"のデザインの壁と打ち手
ohanamizuki
4
6k
メディアリニューアルまでのあしあと
ohanamizuki
2
110
Other Decks in Design
See All in Design
デザインから開発まで一貫したデザインシステムを構築するベストプラクティス / Best Practices for Building a Consistent Design System from Design to Development
lycorptech_jp
PRO
0
520
21 Ways to Call American Airlines Customer Care Full Guide USA
americanhub
0
200
保育AIプロダクトの UXデザインで考えてきたこと / hoiku-ai-ux-design
hiro93n
0
130
Hatena Engineer Seminar #33 チームと開発するためのモック
takuwolog
0
430
8_8_リサーチカンファレンスプレイベント.pdf
muture
PRO
2
340
地理院地図をもっと楽しく!れきちず新機能のご紹介
hjmkth
1
130
“ブロック”で作る、WordPress制作フロー変革のすすめ
koots2021
4
1.9k
プロジェクト内でデザイナーができること 日経電子版アプリ機能開発「For You」#nikkei_tech_talk
nikkei_engineer_recruiting
8
4.5k
第4回関東Kaggler会LT HCD-Net人間中心設計スペシャリストが語るNotebookメダルの取り方
utm529f
0
1k
デザイナーのAI活用とチームへの浸透戦略
ukaoli
0
110
読書シェア会 vol.5 / Yumemi.grow 20250526
rakus_dev
0
1.8k
Yumika Yamada Portfolio
yumii
0
1.4k
Featured
See All Featured
How to train your dragon (web standard)
notwaldorf
96
6.2k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
49
3k
jQuery: Nuts, Bolts and Bling
dougneiner
64
7.9k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
50k
Building Adaptive Systems
keathley
43
2.7k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
8
520
BBQ
matthewcrist
89
9.8k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
234
17k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
126
53k
How GitHub (no longer) Works
holman
315
140k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
285
13k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
16k
Transcript
αʔϏε࡞ΓͷͨΊʹ νʔϜͰऔΓΜͩ5ͭͷࣄ 2016/07/28 גࣜձࣾϚωʔϑΥϫʔυ େڮ ਸ਼ੜ
201410݄͔ΒϚωʔϑΥϫʔυʹδϣΠϯ ࣗಈՈܭαʔϏεʰϚωʔϑΥϫʔυʱͷσβΠϯΛ୲͍ͯ͠·͢ େڮ ਸ਼ੜ(͓͓͠ Έ͖ͣ) Designer ࣗݾհ
ձࣾհ
͓ۚΛલɻਓੜΛͬͱલɻ ݸਓاۀɺ͓ۚʹؔ͢Δ՝Έࢁੵ͍ͯ͠Δɻ αʔϏεΛ௨ͯ͠ɺ͓ۚͷ՝Λղܾ͠ ϢʔβʔͷਓੜΛϙδςΟϒͳͷɺલ͖ͳͷʹ͍ͯ͘͠ɻ ϛογϣϯ
Ոܭࢿ࢈ͳͲͷ ݸਓͷ͓ۚʹؔ͢Δݱঢ়՝Λ ϦΞϧλΠϜʹՄࢹԽ͢Δɻ ࣗಈՈܭɾࢿ࢈ཧαʔϏε
ձࣾͷձܭͳͲʹؔ͢Δݱঢ়՝Λ ϦΞϧλΠϜʹՄࢹԽ͢Δɻ
νʔϜͰऔΓΜͩ5ͭͷࣄ
՝ 1 ίϛϡχέʔγϣϯ͕ԁʹਐ·ͳ͍ 2 νʔϜϝϯόʔͷೝ͕ࣝͦΖΘͳ͍ νʔϜͰͷ։ൃޮ্͕͕Βͳ͍
1. ϧʔϧ࡞Γ
6*Λ࣮͢Δ࣌ʹΉ Before σβΠϯσʔλͱ ࣮ζϨͯΔɻɻɻ ϧʔϧ͕໌֬Ͱͳ͍͔Β໎͏ ίϛϡχέʔγϣϯίετ͕͔͔Δ ΤϯδχΞ σβΠφʔ
Style Guide࡞ͬͨΑ ͏৭ϑΥϯταΠζ͕໌֬ʹͳͬͨ͜ͱͰ໎Θͳ͍
͍ͬͯΔπʔϧɹͦͷ̍ Zeplin SketchͷศརϏϡʔΞʔ݉ΤΫεϙʔτϔϧύʔ
͍ͬͯΔπʔϧɹͦͷ̍ Zeplin SketchͷศརϏϡʔΞʔ݉ΤΫεϙʔτϔϧύʔ for ΤϯδχΞ
͍ͬͯΔπʔϧɹͦͷ̎ CRAFT LIBRARY Sketch symbol ΨΠυϥΠϯڞ௨ύʔπΛνʔϜͰڞ༗
͍ͬͯΔπʔϧɹͦͷ̎ CRAFT LIBRARY Sketch symbol ΨΠυϥΠϯڞ௨ύʔπΛνʔϜͰڞ༗ for σβΠφʔ
͞ΒͳΔࢼΈ Style GuideΛ֬ೝͰ͖ΔΞϓϦΛ࡞Ζ͏ʂ Style Guide App্ͰUIͱ͔τϥϯδγϣϯ͕֬ೝͰ͖Δͷ ςϯϓϨΛमਖ਼͢Εɺͯ͢Δ
͞ΒͳΔࢼΈ Style GuideΛ֬ೝͰ͖ΔΞϓϦΛ࡞Ζ͏ʂ Style Guide App্ͰUIͱ͔τϥϯδγϣϯ͕֬ೝͰ͖Δͷ ςϯϓϨΛमਖ਼͢Εɺͯ͢Δ ৄ͘͠ ͜ͷ͋ͱʂ
2. ։ൃϑϩʔͷݟ͠
Before اը༷ݕ౼࣌ʹΤϯδχΞࢹ͕ൈ͚͕ͪͩͬͨ ΤϯδχΞ σβΠφʔ σΟϨΫλʔ ༷ܾΊ ΤϯδχΞࢹ͕ೖΒͳ͍ ×
ϑϩʔͷݟ͠ ΞϓϦΤϯδχΞ σβΠφʔ σΟϨΫλʔ ΈΜͳͰ༷ܾΊ ༷ʑͳ৬छͷࢹΛೖΕͯ ૣ͍ஈ֊Ͱݒ೦ͷચ͍ग़͕͠Ͱ͖ΔΑ͏ʹ όοΫΤϯυΤϯδχΞ
3. ΤϯδχΞͱσβΠφʔ ͬͱ͔Γ߹͓͏ͥͷձ
ͲΜͳऔΓΈΛ͍ͯ͠Δ͔ • ΤϯδχΞ͚SketchϫʔΫγϣοϓ • σβΠφʔ͚Androidษڧձ • ΈΜͳͰϏσΦΛݟΔձ • νϟοτͰͷใަͳͲ ͓ޓ͍ΛΔ͜ͱɾϦεϖΫτ͢Δ͜ͱͰ
αʔϏε։ൃ͕ԁʹͳΔ
ͲΜͳऔΓΈΛ͍ͯ͠Δ͔ • ΤϯδχΞ͚SketchϫʔΫγϣοϓ • σβΠφʔ͚Androidษڧձ • ΈΜͳͰϏσΦΛݟΔձ • νϟοτͰͷใަͳͲ ͓ޓ͍ΛΔ͜ͱɾϦεϖΫτ͢Δ͜ͱͰ
αʔϏε։ൃ͕ԁʹͳΔ
ΤϯδχΞ͚SketchϫʔΫγϣοϓ ࣮ࡍʹ࡞ͬͯΈΔͰ ͲͷΑ͏ʹ࡞ΒΕ͍ͯΔ͔Δ͜ͱ͕Ͱ͖Δ ͡ΊͯͰେৎʂΈΜͳͰSketchͰԿ͔࡞ͬͯΈΑ͏
4. ؾܰʹ૬ஊ͕Ͱ͖Δ ϑϦʔΞυϨε੮
ϑϦʔΞυϨε੮ ۙ͘Ͱ࡞ۀ͢ΔࣄͰࠔͬͨ࣌ʹ͙͢ฉ͚Δ ͔ͩΒɺ͙͢ʹରԠͰ͖ͯ࡞ۀޮ্
5. αʔϏείϯηϓτ ͷՄࢹԽ
Before ͕࣠ͳ͍͔ΒνʔϜͷํੑ֤ਓͷࢥ͍ඳ͍ͯΔ αʔϏε૾͕όϥόϥ αʔϏεͷະདྷ૾͕ෆ໌֬ αʔϏεͷڧΈ࣠Կ͔ ?
ՄࢹԽͱڞ༗ ՄࢹԽ͠ڞ༗ͨ͠ࣄʹΑΓ அ࣠ͷϒϨ͕ɺͳ͘ͳͬͨ
·ͱΊ
՝ 1 ίϛϡχέʔγϣϯ͕ԁʹਐ·ͳ͍ 2 νʔϜϝϯόʔͷೝ͕ࣝͦΖΘͳ͍ νʔϜͰͷ։ൃޮ্͕͕Βͳ͍
·ͱΊ %FTJHOFS &OHJOFFS ͓ޓ͍ͷࣄΛཧղ͠ɺ࠷࠷ߴͷ։ൃΛ͍͖ͯ͠·͠ΐ͏ αʔϏεͷՁϢʔβʔମݧͷ্ σβΠφʔ͚ͩͷͷͰͳ͘ɺνʔϜશମͷͷɻ
5IBOLZPV