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
let product = [designer, engineer].reduce(0) { ...
Search
koutalou
August 02, 2016
0
380
let product = [designer, engineer].reduce(0) { $0 + $1.skill * $1.vision }
2016/07/28(木) デザイナー×エンジニアLT&交流会(マネーフォワード×ママリ×みんなのウェディング)で登壇した内容です。
koutalou
August 02, 2016
Tweet
Share
More Decks by koutalou
See All by koutalou
マネーフォワードの設計へのアプローチ
koutalou
4
3.5k
実際Xamarinってどうなの?
koutalou
3
2k
iOS Clean Architecture のすすめ
koutalou
26
23k
tvOS tips
koutalou
1
1.8k
Featured
See All Featured
Faster Mobile Websites
deanohume
304
30k
Building a Modern Day E-commerce SEO Strategy
aleyda
36
6.8k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
25
3.9k
Into the Great Unknown - MozCon
thekraken
29
1.4k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
502
140k
Designing the Hi-DPI Web
ddemaree
278
34k
Unsuck your backbone
ammeep
667
57k
Six Lessons from altMBA
skipperchong
26
3.4k
The Cult of Friendly URLs
andyhume
76
6k
Clear Off the Table
cherdarchuk
91
320k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
157
15k
Design by the Numbers
sachag
277
19k
Transcript
let product = [designer, engineer].reduce(0) { $0 + $1.skill *
$1.vision } 2016/07/28 גࣜձࣾϚωʔϑΥϫʔυ ࣇۄଠ
ࣗಈՈܭαʔϏεʰϚωʔϑΥϫʔυʱ iOS.AndroidΞϓϦ։ൃΛ୲͍ͯ͠·͢ ࣇۄଠ!LPVUBMPV ΤϯδχΞ ࣗݾհ
औΓΈ 1 νʔϜͰͷ։ൃޮͷ্ 2 ૬ޓͷาΈدΓ 3 7JTJPOͷڞ༗
औΓΈ 1 νʔϜͰͷ։ൃޮͷ্ 2 ૬ޓͷาΈدΓ 3 7JTJPOͷڞ༗ 2 3
ηΫγϣφϦζϜͷ اըɺσβΠϯɺ։ൃͷϑϩʔΛׂ͝ͱʹ͚ͯ͠·͏ͱ खΓ͕ଟ͘ޮతͳ։ൃ͕Ͱ͖ͳ͍ ΤϯδχΞ σβΠφʔ σΟϨΫλʔ Ռ͕ࢥͬͨͷͱҧ͏ اըʹҰ؏ੑ͕ͳ͍ͳ͋ σβΠϯ௨Γ͡Όͳ͍ͧ ԿͩΖ͏͜ͷ༷
͜ͷ࣮Ͱ͍͍͔ͳ
νʔϜϨϏϡʔମ੍ ֤ϑΣʔζʹΦʔφʔ͍Δ͕ɺ શһ͕ͯ͢ͷϑΣʔζʹؔΘΓखΓΛ͙ ༷ܾΊ σβΠϯϨϏϡʔ ϓϩμΫτϨϏϡʔ
νʔϜϨϏϡʔମ੍ ֤ϑΣʔζʹΦʔφʔ͍Δ͕ɺ શһ͕ͯ͢ͷϑΣʔζʹؔΘΓखΓΛ͙ ༷ܾΊ σβΠϯϨϏϡʔ ϓϩμΫτϨϏϡʔ
ϓϩμΫτϨϏϡʔͷৄࡉ ։ൃ࣌ΤϯδχΞ͚ͩͰͳ͘ɺ શһ͕ϨϏϡʔΛߦ͑Δঢ়ଶʹ͢Δ ։ൃ HJUIVCϨϏϡʔ ࢼ৯ϨϏϡʔ
HJUIVCϨϏϡʔ *TTVFBOE1VMM3FRVFTUUFNQMBUFTΛ͔ͬͯΓ͘͢ɺ εΫϦʔϯγϣοτνϟοτͷ༰ΛషͬͯϨϏϡʔͷෑډΛԼ͛Δ
ࢼ৯ϨϏϡʔ 4MBDLͰࢦࣔΛग़͢ͱࣗಈͰΞϓϦΛ%FQMPZ ৗʹ։ൃதͷΞϓϦͷಈ࡞Λ֬ೝͰ͖ΔΑ͏ʹ͢Δ
ϨϏϡʔͷಋೖ ։ൃதʹ༷ʑͳࢹͰϨϏϡʔΛड͚Δ͜ͱͰ ޮతʹ։ൃ͕Ͱ͖Δ ։ൃ HJUIVCϨϏϡʔ ࢼ৯ϨϏϡʔ
νʔϜ։ൃ ΞϓϦΤϯδχΞ σβΠφʔ σΟϨΫλʔ ΈΜͳͰαʔϏε։ൃ εϞʔϧνʔϜ͜ΕͰ্ख͍͍ͬͯ͘Δʂ όοΫΤϯυΤϯδχΞ
νʔϜؒͷใڞ༗ "νʔϜ #νʔϜ $νʔϜ νʔϜྑͯ͘ଞͷνʔϜͷঢ়گΛΒͳ͍ͱɺ ࿈ܞͰ͖ͳ͔ͬͨΓແବͳ͜ͱΛ͢Δ͜ͱ͋Δ
ใΛΦʔϓϯʹ͢Δ ίϛϡχέʔγϣϯৗʹΦʔϓϯʹͯ͠ɺ શһͰڞ༗͢Δ
औΓΈ νʔϜͰͷ։ൃޮͷ্ 2 ૬ޓͷาΈدΓ 7JTJPOͷڞ༗ 1 3
ͲΜͳऔΓΈΛ͍ͯ͠Δ͔ w ΤϯδχΞ͚4LFUDIϫʔΫγϣοϓ w σβΠφʔ͚"OESPJEษڧձ w ΈΜͳͰϏσΦΛݟΔձ w νϟοτͰͷใަͳͲ
σβΠϯˠ࣮ 4UZMF(VJEF Style Guide͕͋ΕUI࣮ͰࠔΔࣄ΄ͱΜͲͳ͍͕ɺ ΤϯδχΞ㲗σβΠφʔͷϑϩʔվળΛͬͱਐΊ͍ͨ
4UZMF(VJEF"QQ 4UZMF(VJEFͰఆٛ͞ΕͨͷΛ"QQͰ֬ೝͰ͖ΔΑ͏ʹ Money Forward App Style Guide App Style Framework
4UZMF(VJEF"QQ 'SBNFXPSLʹ͢Δ͜ͱͰڞ௨ԽͰ͖ .POFZ'PSXBSEΞϓϦʹͦͷ··͑Δ Money Forward App Style Guide App Style
Framework
4UZMF(VJEF"QQ Money Forward App Style Guide App Style Framework 'SBNFXPSLʹ͢Δ͜ͱͰڞ௨ԽͰ͖
.POFZ'PSXBSEΞϓϦʹͦͷ··͑Δ
σβΠφʔʹॻ͚Δఆٛ σβΠφʔStyleΛ͍ͭͰมߋͰ͖Δ
औΓΈ 3 7JTJPOͷڞ༗ νʔϜͰͷ։ൃޮͷ্ 1 2 ૬ޓͷาΈدΓ 2
ηΫγϣφϦζϜͷ νʔϜҰؙͱͳͬͯ։ൃ͍͕ͨ͠ɺ Ͳ͏ͬͨΒͦͷঢ়ଶʹͳΕΔͷ͔ ΤϯδχΞ σβΠφʔ σΟϨΫλʔ ࢲ͕ߟ͑ͨ࠷ߴͷUIʂ ݴΘΕ༷ͨΛ ࡞Ε͍͍ ͜ΕͳΒ্͕͕Δͣ
͜Ε࡞ͬͯʔʂ
7JTJPOʹೲಘײ͕ͳ͍ͱ ࣗͷׂ͔͜͠ͳ͞ͳ͘ͳͬͯ͠·͏ ηΫγϣφϦζϜͷ ΤϯδχΞ σβΠφʔ σΟϨΫλʔ ͜ΕͳΒ্͕͕Δͣ ͜Ε࡞ͬͯʔʂ ࢲ͕ߟ͑ͨ࠷ߴͷUIʂ ݴΘΕ༷ͨΛ
࡞Ε͍͍
7JTJPOͷڞ༗ ΤϯδχΞ σβΠφʔ σΟϨΫλʔ Vision͕ڞ༗Ͱ͖͍ͯΕɺ νʔϜVisionΛ࣮ݱ͢ΔؒͰ͋Δ
ྑ͍νʔϜͷঢ়ଶ 1. શһ͕اըΛ͢Δ͠ɺ༷ΛܾΊΔ 2. Visionʹج͍ͮͯஅ͕Ͱ͖Δ 3. αʔϏεʹؔΘΔͯ͢ͷϑΣʔζʹؔ༩͢Δ اըɺ༷ܾΊ அ ֤ϑΣʔζͷϨϏϡʔ
ྑ͍νʔϜͷঢ়ଶ ΤϯδχΞ σβΠφʔ σΟϨΫλʔ Vision͕ڞ༗Ͱ͖͍ͯΕɺ ։ൃϑϩʔͰΑΓີͳίϛϡχέʔγϣϯ͕औΕ νʔϜͷύϑΥʔϚϯε্͕͢Δ
·ͱΊ
·ͱΊ %FTJHOFS &OHJOFFS 7JTJPOΛڞ༗ͯ͠ ҰؙͱͳͬͯϓϩμΫτΛ࡞ͬͯߦ͜͏ʂ w νʔϜશһ͕શͯͷϑΣʔζʹؔΘΔ͜ͱͰޮԽ͢Δ w νʔϜ7JTJPOΛ࣮ݱ͢ΔؒͰ͋Γɺ͓ޓ͍ͷࣄΛཧղ ͠ใΛఏڙ͋ͬͯ͠ҰॹʹαʔϏεΛ։ൃ͍ͯ͘͠
͓ۚΛલɻਓੜΛͬͱલɻ զʑͷαʔϏεΛ௨ͯ͠ɺݸʑਓͷ͓ۚʹର͢ΔΈෆ͕҆ ܰݮ͠ɺʑͷΒ͠ͷվળເ͕࣮ݱ͢Δɻ ͦͯ͠ɺຊࠃͷʮ͓ۚͷྲྀΕʯ͕มΘΓɺ ΑΓੈͷத͕׆ੑԽ͠ɺ৽ͨͳνϟϨϯδΛੜΈग़͍͢͠ ڥ࡞Γʹߩݙ͢Δ͜ͱ͕ɺզʑ͕ࣄۀΛߦ͏࠷େͷతͰ͋Δɻ ϚωʔϑΥϫʔυ
Ұॹʹಇؒ͘ 7JTJPOΛ࣮ݱ͢Δ͘ Ұॹʹಇؒ͘Λืू͍ͯ͠·͢ʂ
5IBOLZPV