Upgrade to Pro — share decks privately, control downloads, hide ads and more …

サインアップフロー改修のデザインプロセス

Avatar for Ryo Sakaguchi Ryo Sakaguchi
March 28, 2018
Design
3
460

 サインアップフロー改修のデザインプロセス

Androidエンジニアデザイン部 #1

Avatar for Ryo Sakaguchi

Ryo Sakaguchi

March 28, 2018
Tweet

More Decks by Ryo Sakaguchi

See All by Ryo Sakaguchi
Android Architecture Componentsを使って、改善・効率化するAndroidアプリ開発
Avatar for Ryo Sakaguchi wakwak3125
0
1.3k
Test multiple APKs 
with Robolectric
Avatar for Ryo Sakaguchi wakwak3125
0
760
Clip, Elevation and 
ViewOutlineProvider
Avatar for Ryo Sakaguchi wakwak3125
1
1.2k
WebView as 
Fancy and effective 
View
Avatar for Ryo Sakaguchi wakwak3125
1
1.5k
ViewPager2をちょっとさわってみよう
Avatar for Ryo Sakaguchi wakwak3125
0
1.6k
年末だし、振り返るKotlin
Avatar for Ryo Sakaguchi wakwak3125
1
1.1k
社内ライブラリのアップデートフロー
Avatar for Ryo Sakaguchi wakwak3125
4
3.7k
Wantedly Peopleのリリースフロー
Avatar for Ryo Sakaguchi wakwak3125
1
4.6k
KOINかわいいよ、KOIN
Avatar for Ryo Sakaguchi wakwak3125
0
930

Other Decks in Design

See All in Design
そのUIコンポーネント、これから先も使えますか？―Headless UI,Open UI,グローバルデザインシステム
Avatar for sakito sakito
2
1.9k
企画を動かすデザイナーの思考！「広げて絞る」アプローチ。
Avatar for Hikida Kan hikidakan
0
180
FigmaのFigmaファイルから学ぶTips & Tricks
Avatar for Hiroki Tani hilokifigma
0
690
事例で学ぶ！今日から使えるWebサービスUI改善ポイント
Avatar for NCDC ncdc
0
280
組織で取り組むアクセシビリティのはじめ方
Avatar for cawpea masakiohsumi
0
180
CMS管理画面のアクセシビリティ
Avatar for Rikiya Ihara / magi magi1125
8
2.5k
21 Ways to Call American Airlines Customer Care Full Guide USA
Avatar for Sonny americanhub
0
210
株式会社ログラス - 会社説明資料【デザイナー】/ Loglass Designer
Avatar for 株式会社ログラス loglass2019
1
2.6k
読書シェア会 vol.5 / Yumemi.grow 20250526
Avatar for Rakus_Dev rakus_dev
0
1.8k
サービスリブランディングにおけるイラストレーションシステムの構築と活用事例 / Building and Utilizing an Illustration System in Service Rebranding
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
0
620
地理院地図をもっと楽しく！れきちず新機能のご紹介
Avatar for Hajime Kato hjmkth
1
160
Design Studio Deck | インクルーシブデザインスタジオCULUUM
Avatar for インクルーシブデザインスタジオCULUMU culumu
3
4.2k

Featured

See All Featured
How to train your dragon (web standard)
Avatar for Monica Dinculescu notwaldorf
96
6.3k
The Success of Rails: Ensuring Growth for the Next 100 Years
Avatar for Eileen M. Uchitelle eileencodes
46
7.6k
Performance Is Good for Brains [We Love Speed 2024]
Avatar for Tammy Everts tammyeverts
12
1.2k
The Cost Of JavaScript in 2023
Avatar for Addy Osmani addyosmani
53
9k
Visualization
Avatar for Eitan Lees eitanlees
148
16k
Into the Great Unknown - MozCon
Avatar for Noah Learner thekraken
40
2.1k
The Straight Up "How To Draw Better" Workshop
Avatar for Dennis Kardys denniskardys
237
140k
Art, The Web, and Tiny UX
Avatar for Lynn Fisher lynnandtonic
303
21k
Building an army of robots
Avatar for Kyle Neath kneath
306
46k
The MySQL Ecosystem @ GitHub 2015
Avatar for Sam Lambert samlambert
251
13k
Fantastic passwords and where to find them - at NoRuKo
Avatar for Phil Nash philnash
52
3.4k
Making the Leap to Tech Lead
Avatar for Ryan Cromwell cromwellryan
135
9.5k

Transcript

  1. 2018.3.28 | ©2018 wakwak3125 αΠϯΞοϓϑϩʔվमͷ σβΠϯϓϩηε σβΠφʔͱ΍͍ͬͯ͘΍Γ͔ͨ AndroidΤϯδχΞσβΠϯ෦ #1 @wakwak3125

    from Wantedly People

  2. 2018.3.28 | ©2018 wakwak3125 2 About me Ryo Sakaguchi @wakwak3125

    • Wantedly, Inc (2017/2~) • Wantedly People͍ͬͯ͏ΞϓϦ࡞ͬͯ·͢ • Kotlin޷͖ • Kotlin޷͖ • UI/UXߟ͑Δͷ޷͖(ಘҙͩͱ͸ݴ͍ͬͯͳ͍) • ௼ΓͱΪλʔͱεϊʔϘʔυ͕޷͖

  3. 2018.3.28 | ©2018 wakwak3125 3 Wantedly People? ໊ࢗΛ؅ཧ͢ΔΞϓϦ ਓ຺Λϙʔλϒϧʹ࣋ͪา͜͏ •

    ͺͺͬͱෳ਺ຕҰׅऔΓࠐΈ • ͙͢ʹσʔλԽ͞ΕΔ • ಡΈऔ໊ͬͨࢗʹؔ࿈͢Δ࿩୊͕Έ͔ͭΔ • WantedlyϢʔβʔͷ໊ࢗΛऔΓࠐΜͩΒͦͷ৘ใ ΋෇༩͞ΕΔ • OCR + Machine Learning

  4. 2018.3.28 | ©2018 wakwak3125 4 αΠϯΞοϓϑϩʔվमͷσβΠϯϓϩηε ࠓ೔࿩͢͜ͱ ΞϓϦͷαΠϯΞοϓϑϩʔվमͷϓϩηε͕ϝΠϯ • վળϓϩηε

    • ͏·͍ͬͨ͘ࢪࡦ • ͏·͍͔͘ͳ͔ͬͨࢪࡦ • ·ͱΊ

  5. 2018.3.28 | ©2018 wakwak3125 5 վળϓϩηε

  6. 2018.3.28 | ©2018 wakwak3125 6 վળϓϩηε ମݧΛߟ͑Δ σβΠϯ ࣮૷ ݕূ

    ؆ུԽͨ͠΋ͷ

  7. 2018.3.28 | ©2018 wakwak3125 7 ମݧΛߟ͑Δ σβΠϯ ࣮૷ ݕূ վળϓϩηε

    ࣗ෼ʢΤϯδχΞʣͷ୲౰ྖҬ

  8. 2018.3.28 | ©2018 wakwak3125 8 վળϓϩηε ମݧΛߟ͑Δ σβΠϯ ࣮૷ ݕূ

    σβΠφʔͷ୲౰ྖҬ

  9. 2018.3.28 | ©2018 wakwak3125 9 վળϓϩηε جຊతʹίΞͳ෦෼Ҏ֎͸ڞ௨ྖҬ

  10. 2018.3.28 | ©2018 wakwak3125 10 վળϓϩηε HOW?

  11. 2018.3.28 | ©2018 wakwak3125 11 վળϓϩηε ମݧΛߟ͑Δ ڞ௨ʹཧղͰ͖Δ΋ͷͱͯ͠ɺUIFlowΛ࡞Δ • ςΩετϕʔεͷUIFlow͕͋Ε͹ίϛϡχέʔ

    γϣϯ͠΍͍͢ • ࣗ෼͸guiflowͱ͍͏πʔϧΛ࢖ͬͨ • ৄࡉ·Ͱ݁ߏ٧ΊΔ • Τϥʔൃੜ࣌ͷڍಈ΍ϑΥʔϧόοΫઌؚΉ • ͦΕΛݩʹɺσβΠφʔ͕ϥϑͳϓϩτλΠϓΛ ࡞Δ • νʔϜʹڞ༗ͯ͠ݕূ • Αͦ͞͏ͳΒσβΠϯϓϩηεʹਐΉ HOW?

  12. 2018.3.28 | ©2018 wakwak3125 12 վળϓϩηε σβΠϯ σβΠφʔ͕ΧοίΠΠཧ૝Λ࡞ͬͯ͘ΕΔ • ·ͣ͸׬શʹཧ૝ϕʔεͰ࠷ߴʹΧοίΠΠ΋ͷ

    Λ࡞ͬͯ΋Β͏ • Sketch -> Zeplin • ͔ͦ͜Βௐ੔͍ͯ͘͠ • ͜Ε͸ͻͱͦΕͧΕ΍Γํ͕͋Δ͔΋͠Εͳ͍ • ઐ໳ྖҬͰ͸ͳ͍ͷͰ͝ΊΜͳ͍͞ HOW?

  13. 2018.3.28 | ©2018 wakwak3125 13 վળϓϩηε ࣮૷ มߋʹ଱͑͏Δ͍͍ײ͡ͷઃܭͰ΍ͬͨ • ৽نొ࿥ͷը໘ભҠ͸ΦʔτϚτϯΛ׆༻͍ͯ͠

    ͍ײ͡ʹͨ͠ɻ • มߋͱςετ͕͠қ͍ͷͰ࢓༷มߋʹ଱͑ΕΔ • A/Bςετ΋΍ͬͨ • ϓογϡ௨஌ͷࢪࡦ΋ಉ࣌ʹߦͬͨͷͰɺαʔόʔ αΠυͷ؆୯ͳ࣮૷΋ߦͬͨɻ • ظ೔ͱ͔Ͱݫͦ͠͏ͳͱ͜Ζʹؔͯ͠͸దٓ૬ஊ ͯ͠࡟ͬͨΓ HOW?

  14. 2018.3.28 | ©2018 wakwak3125 14 վળϓϩηε ݕূ σβΠφʔ΋ࢀՃ͠΍͘͢ɺՄࢹԽΛॏࢹ • Wantedly͸͍Ζ͍ΖͳϩάΛBigQueryʹͨΊ͍ͯ

    Δ • ͦͷϩάΛDOMOͱ͍͏BIπʔϧͰՄࢹԽ͢Δ • ࠓճ͸αΠϯΞοϓϑϩʔͷϑΝωϧΛࣗલͰ ΫΤϦॻ͍ͯɺDOMOʹ൓өͨ͠ • جຊతʹσβΠϯ͸ఆੑతͳ΋ͷͱଊ͑ΒΕ͍ͯ ΔͷͰɺΤϯδχΞ͕͖ͪΜͱ਺஋Խͯ͠ՄࢹԽ ͢Δ͜ͱͰɺఆྔతʹଊ͑Δ͜ͱ͕Ͱ͖Δɻ • ͜͜Ͱྑ͘ͳ͍ݸॴΛݟ͚ͭͯ࣍ʹ׆͔͢ HOW? ʴ

  15. 2018.3.28 | ©2018 wakwak3125 15 վળϓϩηε ͱ͍͏ϓϩηεΛ͙Δ͙Δճ͢

  16. 2018.3.28 | ©2018 wakwak3125 16 ͏·͍ͬͨ͘ࢪࡦ

  17. 2018.3.28 | ©2018 wakwak3125 17 ͏·͍ͬͨ͘ࢪࡦ ը໘਺͸ۃྗݮΒ͢ 1ը໘ຖʹ20%͸཭୤

  18. 2018.3.28 | ©2018 wakwak3125 18 αΠϯΞοϓΛඞਢʹ͠ͳ͍ αʔϏεʹΑΔ
 ࣗ෼ͷαʔϏε͸Ͳ͏͔ͰܾΊͯ΄͍͠ ͏·͍ͬͨ͘ࢪࡦ

  19. 2018.3.28 | ©2018 wakwak3125 19 ίΞͳମݧΛؚΊΔ Wantedly People͸໊ࢗࡱӨମݧ͕Ұ൪ڻ͖ͱײಈ Λ༩͑ΒΕΔͷͰɺ໊ࢗࡱӨ͚ͩͰ৽نొ࿥Ͱ͖ ΔΑ͏ʹͨ͠

    ͏·͍ͬͨ͘ࢪࡦ

  20. 2018.3.28 | ©2018 wakwak3125 20 ͏·͍͔͘ͳ͔ͬͨࢪࡦ

  21. 2018.3.28 | ©2018 wakwak3125 21 ͏·͍͔͘ͳ͔ͬͨࢪࡦ ௕Ίͷ΢ΥʔΫεϧʔ LottieΛ࢖͔͍͍ͬͯͬ͜΍ͭΛ࡞͚ͬͨͲ ͦ͜Ͱ͏·͘ັྗΛ఻͑ΒΕͳ͔ͬͨɻ ମݧͯ͠΋ΒΘͳ͍ͱܧଓ཰΋ొ࿥཰΋ѱ͍

  22. 2018.3.28 | ©2018 wakwak3125 22 ͏·͍͔͘ͳ͔ͬͨࢪࡦ ೖྗ߲໨Λࡉ͔͘ը໘ʹ෼͚ͨ ը໘਺ͷ૿ՃʹΑΓɺ཭୤͕ଟ͘ͳͬͯ͠·ͬͨ

  23. 2018.3.28 | ©2018 wakwak3125 23 ͏·͍͔͘ͳ͔ͬͨࢪࡦ αΠϯΞοϓํ๏Λબ͹ͤͨ Facebook/Wantedly/Email ͜ΕΛબ୒͢Δஈ֊ͰϢʔβʔ͸཭୤

  24. 2018.3.28 | ©2018 wakwak3125 24 αΠϯΞοϓϑϩʔվमͷσβΠϯϓϩηε ·ͱΊ • ମݧΛ࡞Δɾߟ͑Δͷ͸σΟϨΫλʔ΍σβΠφʔ ͚ͩͷ࢓ࣄ͡Όͳ͍

    • ͦͷ্ͰΤϯδχΞͱͯ͠ͷڧΈΛ׆͔ͯ͠ڞಉ ࡞ۀ͍͖͍ͯͨ͠ • αΠϯΞοϓʹؔͯ͠͸αʔϏε͝ͱʹཁ͕݅͋ Δͱ͜ΖͳͷͰɺ࣌ؒΛ͔͚ͯͬ͘͡Γվળͯ͠ ͍͘ͷ͕๬·͍͠