$30 off During Our Annual Pro Sale. View Details »

ユーザー中心設計を取り入れたアプリの開発

 ユーザー中心設計を取り入れたアプリの開発

Sakamoto Keisuke

May 01, 2015
Tweet

More Decks by Sakamoto Keisuke

Other Decks in Design

Transcript

  1. ユーザー中心設計を取り入れた
    アプリの開発ディレクション
    ナイル株式会社
    坂本 圭佑

    View Slide

  2. 社名の由来
    「Near Your Life」という言葉の頭文字と最後の文字
    人々のそばに当たり前にあるようなサービスを作り続ける会社にしていきたい。
    ロゴの意味
    古来より人々の「そばにあった」ものである「自然」、とくに人々の生活を彩ってきた「花」を
    メインイメージに、上下を違う青色で色分けすることで「空」と「海」もモチーフとしています。
    「空」と「海」はボーダレスに広がるものとしての無境界性も表現しており、ナイルが「グローバルな
    世界企業になる」という宣言を表しています。

    View Slide

  3. 坂本 圭佑
    ■ディレクター
    ・Appliv アプリ版の開発ディレクションを担当
    ■主な業務内容
    ①ユーザー調査、分析、評価
     ・ユーザーテスト、アクセス解析 etc.
    ②ディレクション
     ・要件定義、進捗管理、品質管理 etc.

    View Slide

  4. Appliv アプリ版
    サービスコンセプト
    アプリのおすすめコメントを主役とした
    ユーザー参加型のアプリレコメンドサービス

    View Slide

  5. 今日はユーザー中心設計というものを取り入れつつ、
    どのようにアプリの制作ディレクションを
    回しているかをお話しします。
    サービス立ち上げのときの話を知りたい方は、こちらの記事を読んでみてください。
    プロトタイプから100%を目指す~3カ月で100万DL突破の『Appliv』に学ぶ、効率的なUIデザインの3ステップ
    http://engineer.typemag.jp/article/appliv-ui

    View Slide

  6. ユーザー中心設計とは
    ユーザー中心設計(UCD:User Centered Design)
    別名:人間中心設計( HCD:Human Centered Design)とも呼ばれる。
    ユーザー中心設計とは設計思想です。
    ユーザー中心設計を実施する上で、
    人や会社によって具体的に使用するプロセスは様々です。
    ただし、骨格となるパターンがあります。
    参考:ユーザビリティエンジニアリング第
    2版 p18

    View Slide

  7. ユーザー中心設計のプロセス
    人間中心設計プロセスの計画
    利用状況の把握と明示
    ユーザーの要求事項の明示
    ユーザーの要求を満たす
    解決策の作成
    要求に対する設計の評価
    システムがユーザーの
    要求事項を満足する
    参考:ユーザビリティエンジニアリング第
    2版 p22 「人間中心設計活動の相互依存性の図」

    View Slide

  8. ユーザー調査
    →アクセス解析
    →ユーザーテスト(観察&インタビュー)
    ・ユーザーシナリオ&ニーズの検証
    ・ユーザビリティの検証
     →重要度と頻度で評価
    デザイン案の作成
    デザイン案の
    ユーザビリティの検証
    →簡易ユーザーテスト
    ニーズに沿った施策を
    ユーザビリティを担保した
    状態でリリース
    ①責任者会議で方針決定
    ②全体会議で施策決定
    ディレクターが主導
    (ユーザーテストデイ)
    Appliv アプリ版開発フロー
    シニアデザイナーによる
    デザインチェック
    プロデューサー
    チェック
    Zenhubによるタ
    スク管理

    View Slide

  9. ユーザー調査
    ①ユーザーの利用状況についてインタビューする
    ②状況とタスクを設定し実際にサービスを使ってもらい、思考を口に出してもらう。
    ③タスクがひと段落したら、行動と心理について質問する。
    【準備編】ユーザーテストで課題を発見するための基本的な考え方と
    5つの準備プロセス http://uideal.net/basic/588

    View Slide

  10. ユーザー調査
    →アクセス解析
    →ユーザーテスト(観察&インタビュー)
    ・ユーザーシナリオ&ニーズの検証
    ・ユーザビリティの検証
     →重要度と頻度で評価
    デザイン案の作成
    デザイン案の
    ユーザビリティの検証
    →簡易ユーザーテスト
    ニーズに沿った施策を
    ユーザビリティを担保した
    状態でリリース
    ①責任者会議で方針決定
    ②全体会議で施策決定
    ディレクターが主導
    (ユーザーテストデイ)
    Appliv アプリ版開発フロー
    シニアデザイナーによる
    デザインチェック
    プロデューサー
    チェック
    Zenhubによるタ
    スク管理

    View Slide

  11. ユーザーシナリオ&ニーズの検証
    ターゲット
    ユーザー
    状況と行動 発話 ニーズ 解決策
    暇つぶしでアプリを
    探すユーザー
    電車の中で、Applivの
    ゲームチャンネルからア
    プリを探すとき
    「出先ではアプリを見るだけ、ダウンロード
    しない」
    「アプリをダウンロードしていて、通信制限
    に引っかかったことがあるので、アプリを見
    つけてもすぐにダウンロードしたくない」
    欲しいアプリを記録してお
    き、WIFIがある環境で、後
    からダウンロードしたい
    あとでリスト機能をつけ
    てはどうか?
    ※注意:
    ユーザーに解決策を聞くのではなく、開発チームが解決策を考える

    View Slide

  12. ユーザーシナリオ&ニーズの検証
    参考:2時間で作るカスタマージャーニーマップ
    ――実例とともに考える新しい「おもてなし」のカタチ
    http://web-tan.forum.impressrd.jp/e/2013/11/27/16409

    View Slide

  13. デザイン案の作成
    ①ユーザーシナリオ(ToBe)を考える
    ②ユーザーシナリオ(ToBe)に沿ってデザイン案を作成
     ・点ではなく線で考える
      ページ単体で見るとユーザーの行動や心理状態といった文脈に、
      そぐわないUIやコンテンツになってしまう。
    ※①②を並行して実践することが多い

    View Slide

  14. ユーザー調査
    →アクセス解析
    →ユーザーテスト(観察&インタビュー)
    ・ユーザーシナリオ&ニーズの検証
    ・ユーザビリティの検証
     →重要度と頻度で評価
    デザイン案の作成
    デザイン案の
    ユーザビリティの検証
    →簡易ユーザーテスト
    ニーズに沿った施策を
    ユーザビリティを担保した
    状態でリリース
    ①責任者会議で方針決定
    ②全体会議で施策決定
    ディレクターが主導
    (ユーザーテストデイ)
    Appliv アプリ版開発フロー
    シニアデザイナーによる
    デザインチェック
    プロデューサー
    チェック
    Zenhubによるタ
    スク管理

    View Slide

  15. ユーザビリティの検証
    ユーザビリティとは
    特定のコンテキストにおいて、特定のユーザによって、ある製品が、
    特定の目標を達成するために用いられる際の、
    効果、効率、ユーザの満足度の度合い
    ※国際規格ISO9241による定義
    引用:ユーザビリティエンジニアリング 第2版 p4

    View Slide

  16. 満足度
    効率
    効果
    効果:ユーザが目標を達成できるかどうか
    効率:なるべく最短経路で目標を達成できるかどうか
    満足度:ユーザーに不愉快な思いをさせていないかどうか
    重要度:高
    重要度:低

    View Slide

  17. ユーザビリティを重要度と頻度で評価
    対応
    判断
    重要度 頻度 問題点 画面 行動 発話
    ◯ 高 鈴木さん
    佐藤さん
    田中さん
    すすめるボタンの機能
    を、FBやtwitterでAppliv
    アプリ自体をシェアする
    機能と間違って認識
    フィード ヘッダーのすすめるボタンを押
    した
    「あ、ApplivをFBとかですすめ
    ることができるんですね」
    ◯ 高 鈴木さん
    田中さん
    フィードをスワイプする
    と、チャンネルが切り替
    えられることに気がつか
    ない
    フィード カテゴリチャンネルを移動する
    際に、チャンネルをタッチしてい

    こちらの質問に対し、
    「気づかなかった」
    ◯ 中 鈴木さん
    佐藤さん
    FB会員登録時に勝手に
    FBに投稿されるかもし
    れないという不安がある
    新規会員
    登録画面
    新規会員登録 「安心できるアプリなら連携す
    るけど、勝手に行動が公開さ
    れないか不安です」

    View Slide

  18. Zenhubにおけるタスク管理
    カラムを追加することができ、タスクの状態を管理できる
    Zenhub https://www.zenhub.io/

    View Slide

  19. Zenhubにおけるタスク管理
    Zenhub の issue に
    ・目的
    ・実装内容
    ・イベントの修正
    ・KPI
    を記述しておくことで、
    ①実装者が目的に沿ったより良い実装内容を提案してくれる土壌ができる
    ②イベントの修正の抜け漏れがなくなり、効果検証のPDCAを仕組み化できる

    View Slide

  20. 理想の開発ディレクションを目指して

    View Slide