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
5.9k
メディアリニューアルまでのあしあと
ohanamizuki
2
110
Other Decks in Design
See All in Design
#yumemi_grow 読書シェア会 vol.1 - スコット・バークン著『デザインはどのように世界をつくるのか』
kaitou
1
170
Building foundations 堅牢なデザイントークンの設計
hilokifigma
2
3.4k
Goodpatch Tour💙 / We are hiring!
goodpatch
31
850k
A brief & incomplete history of UX Design for the World Wide Web: 1989–2019
jct
1
200
20250129_DAST28_実空間にデジタル資源の接点をデザインする
majimasachi
0
410
Marp + TailWind CSS でスライドをきれいにする
maea2
0
210
ビジネス成果を最大限に発揮するPORTFOLIO
ataxi1003
0
160
「描く」という衝動に立ち返る〜Figma Drawがひらく思考のかたち〜
transit_kix
1
830
Design Studio Deck | インクルーシブデザインスタジオCULUUM
culumu
2
710
Tools for Design Engineers other than LLM in the LLM era
takanorip
1
110
LLMによるRAG評価用合成テストデータの生成
licux
6
1.1k
なぜプレイドにデザインエンジニアが必要だったのか?
t32k
0
480
Featured
See All Featured
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
106
19k
RailsConf 2023
tenderlove
30
1.1k
Intergalactic Javascript Robots from Outer Space
tanoku
271
27k
[RailsConf 2023] Rails as a piece of cake
palkan
55
5.6k
The Power of CSS Pseudo Elements
geoffreycrofte
77
5.8k
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
Bootstrapping a Software Product
garrettdimon
PRO
307
110k
The Cult of Friendly URLs
andyhume
79
6.4k
Scaling GitHub
holman
459
140k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
357
30k
Producing Creativity
orderedlist
PRO
346
40k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
35
2.3k
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