Prott user meetup 16 にて発表した資料。 prottを用いたアプリを効率よく、品質良く育てるコツ。

1. ～Google Play ベストオブ2016特集～
効率よく、
品質よく、
アプリを育てよう。
Prott User Meetup Vol.16
2017.1.18
株式会社ネクスト
小林武蔵

2. Out Line
• 自己紹介
• サービスの紹介
• なぜベストに選ばれたのか
• Prott を活用した事例
• Prott のこんな使い方
• テーマについて考える

3. 自己紹介

4. こばやし むさし
小林 武蔵
デザイナー
Android UI/UX
東京都出身
犬、写真

5. サービスの紹介

6. HOME’Sのビジョン
より良い住生活のために優れた情報を提供し、
「最高のマッチング」を永続的に支援する。

7. HOME’S Android App の変遷
Ver.1 Ver.2 Ver.4~5
マテリアル対応
ベストアプリ
2010.xx 2010.05 2014.09 2016.11
Ver.3
リニューアル

9. なぜ、ベストに選ばれたのか

10. 実際はわからないので、
Androidアプリ開発メンバーの想像です。
• ユーザーの声に応える（レビューへの対応など）
• テストの徹底とクラッシュログ管理
• マテリアルデザインガイドラインの徹底
• 新しい技術に取り組み続けること（Android Wear・Firebase）
• スピードを持って対応する（更新性の高さ）
• ビジョンを掲げ、邁進している
• APIのマイクロサービス化で開発効率UP
• etc

11. テストの徹底、クラッシュ管理、
ビジョンを掲げ邁進する、挑戦するなど
効率よく
ユーザーとのコミュニケーション、
ガイドライン徹底、スピード対応など
品質よく

12. Prott を活用した事例

13. デザインチェック出しの工数削減
繰り返す作業をぐっと圧縮

14. デザインチェック出しの工数削減
繰り返す作業をぐっと圧縮
プロトタイピングツールを
使うまでは、HTML化して
実機で確認していたので
チェックを準備する工数が
恐ろしく掛かっていた…
1m
20m
2m
1m
画像書き出し
HTML化
サーバーにアップ
認証をつけて展開
Prott導入前

15. デザインチェック出しの工数削減
繰り返す作業をぐっと圧縮
Prott導入後
画像書き出し
Prott にアップ
遷移を追加
認証をつけて展開
1m
30s
2m
1m
劇的に削減!
精神衛生上、効果スゴイ！

16. マテリアルデザインに便利
企画・制作・技術で共通認識を持つ

17. マテリアルデザインに便利
企画・制作・技術で共通認識を持つ
オーバーレイで表示されるよ！とか
アニメーションやタップ領域などの挙動もマテリアルデザインにおいてはとても重要
それを合わせてチェックし、伝えながら共有認識を持つのにも役立つ

18. このエリアをスワイプで表示されるよ！とか
アニメーションやタップ領域などの挙動もマテリアルデザインにおいてはとても重要
それを合わせてチェックし、伝えながら共有認識を持つのにも役立つ
マテリアルデザインに便利
企画・制作・技術で共通認識を持つ

19. 上スクロール時は
ここで固定！だよ
下スクロール時は
ここで固定！だよ
アニメーションやタップ領域などの挙動もマテリアルデザインにおいてはとても重要
それを合わせてチェックし、伝えながら共有認識を持つのにも役立つ
マテリアルデザインに便利
企画・制作・技術で共通認識を持つ

20. スピード
ホットモックより早く、パターン出しとプラッシュアップ

21. 施策内容の共有
仕様の読み込み
キックオフ
デザイン開始
施策開始の流れ
スピード
ホットモックより早く、パターン出しとプラッシュアップ
ホットモック
Prott モック
仮実装済
施策内容の共有の
タイミングで
作っちゃう
こんなこと考えてる！やりたいね！の段階で
作っちゃうことも。

22. Prott のこんな使い方

23. 遷移図を印刷して俯瞰する
全画面（主要画面）入れて印刷
カラートーン、コンテンツが立っているかを見るのに便利

24. 仕様ページに埋め込みで一元化
仕様とモックを一緒に管理
属人化を減らし、次の施策に活かす

25. テーマについて考える
ユーザー視点でのUI・UX設計のために

26. ユーザー視点で
UI・UXを設計する方法

27. ユーザーになる

28. ユーザーになる
でも、これってスゴい難しい…

29. そのためにやる3つのこと

30. 作業画面上だけではなく、
実機で触れる（Prott）
ユーザーと同じ立場で
サービスに触れる

31. ユーザーニーズを
認識する
レビューやコメントから
改善箇所の源泉を探す

32. ユーザーから意見をもらう
価値はユーザーが決める
フィードバックをもらい
一緒に育てていく

33. ユーザーと一緒に作る
ユーザー視点でのUI・UX設計のために

34. ご静聴ありがとうございました
質疑応答お手柔らかに！
懇親会で気軽にお声がけください！