「emosi」の開発フローを通して、チームでデザインすることの重要性や仕組みづくりのポイントについてお話します。

1. 「個」から「集」の
デザインへ
2014/11/11(Tsu)
NANAPI STUDY 01
nanapi@木村真理

2. 自己紹介
木村 真理 mari kimura
株式会社 nanapi デザイナー
• Web制作会社5年ちょい
• 2011年10月nanapi入社

3. emosi
emosi
2014年10月リリース
ポジティブ
コミュニケーション
アプリ

4. 今日のお話
「emosi」の開発フローを通して、
チームでデザインすることの重要性や
仕組みづくりのポイントについて
お話します

5. 一般的なWebサービスの開発フローと
emosiの開発フロー

6. よくあるフロー
D
戦略・要件定義
De
UI・ビジュアル
ESS EFE
実装

7. よくあるフロー
デザイナーDe
サービスの見た目を専門で
担当するスタッフ
D EFE ESS デザインフェーズに携わらない

8. よくあるフロー
ポイント
• 分業制（考える人/作る人）
• やることが決まっていれば
合理的でスピーディー
• 方向転換・出戻りに弱い

9. emosiチーム
De ESS EFE
戦略・要件定義・UI
ビジュアル実装

10. emosiチーム
デザイナー
チームの中でたまたまデザ• • • •
インが一番得意なスタッフ
De
EFE ESS 全員でデザイン！

11. emosiチーム
ポイント
• 全員が考える人
デザイナー×3!!!
• プロトタイプを大量に試せる
• アンチパターンをみつけやすい
方向転換・出戻りに強い

12. 「個」から「集」のデザイン

13. 「個」から「集」のデザイン
チームでデザイン
• ペーパープロトタイプは全員で
• UI改善も全員で
• 自走すべきところは任せる

14. ペーパープロトタイプは全員で

15. ペーパープロトタイプは全員で
emosiではエンジニアも
ペーパープロトタイプに参加
• 誰がやってもあまり差がでない

16. ペーパープロトタイプは全員で
Q.どれがデザイナーのプロトタイプ？

17. ペーパープロトタイプは全員で
Q.どれがデザイナーのプロトタイプ？

18. emosiチームのポイント
メリット
• 活発な意見が飛び交う
デザイナーに遠慮なくUIの話ができる
De
• 早い段階でアンチパターンをつぶせる
ESS
アイコンこんなに一度に
読み込んだらクソ重いですよ!!!
Oh...

19. UI改善も全員で

20. UI改善も全員で
ex.初回チュートリアル達成率向上施策
全員でファンネル分析・仮説検証

21. UI改善も全員で
メリット
• 検討すべき有用なアイデアの総数が増える
• 数値に基づいた仮説の上でUIの話ができる
・問題点をだれでも見つけられる
・「なんとなく」を排除できる
・効果検証しやすい

22. 自走すべきところは任せる

23. 自走すべきところは任せる
チーム全員の確認取っていたのでは、
なにをするにも時間がかかりすぎる。
方向性だけすりあわせたら、自走すべき
専門性の高いところは個々人に任せる。

24. 自走すべきところは任せる
たとえば…
• ビジュアルデザイン
• フィードバックアニメーション
• モックアップツールの導入
• 開発環境の自動化

25. 自走すべきところは任せる
メリット
• 開発スピードとクオリティの担保
コミュニケーションコストの軽減
• 最終アウトプットがブレない

26. まとめ

27. まとめ
emosiでは、それぞれの職能を持った
上で、全員がデザインに携わっています。
サービス・チームにマッチした、より
ベターな開発フローを模索して、ユーザー
によりよいサービスを届けましょう！

28. ありがとうございました！