よもやま話β版

よもやま話を書きます

s-dev talks #5「プロトタイピング」 参加メモ

一般参加しました!

s-dev-talks.connpass.com

資料もアップされています: s-dev talks 〜サービス開発勉強会〜 #5 「プロトタイピング」 - 資料一覧 - connpass

実装より実践すべし、ということが詰まったお話をたくさん伺うことができました。 勢いで年末LTの申し込みをしてしまったのでネタを探したいと思います。

以下伺ったお話や会の感想メモです。

sdevtalks#5

  • おしゃれオフィスだ 会場: 株式会社クラウドワークスさん
  • エンジニアがいっぱいいる、みんなどこから湧いてきたんだ(普段ぼっちなので毎回びっくりする)
  • 最初からお酒やピザを提供していてカジュアルな雰囲気、硬くない、「乾杯から始まる勉強会」
  • 参加確認はconnpassの紙を印刷してあって来た人が丸をつける。わかりやすい。
  • ホワイトボードと付箋が準備してあって、参加者が会についての意見、感想、次回テーマのリクエストをできる。ものすごく良い。

sdevtalksとは?

  • 職種単位でなく「サービス開発者」単位のコミュニティ。なのでデザイナーさんやPMさんとかもたくさん参加している。めっちゃよいなぁ。
  • 今回のテーマは「プロトタイピング」

目的別プロト検証のススメ

  • https://tockpop.moneyforward.com/ のクーポン画面のデザインプロトタイプについて
  • ユーザへ良いものをできるだけ早く届ける、プロトタイプは無駄な議論や思い込みを回避できる
  • ふせん+ペン、Sketch + Invision
  • 要素の選定: どの要素が入っていると良いか
    • 順番をつけてください
    • 理由はなんですか
  • デザイン: どんな印象を与えたいか?
    • チェックしてほしい項目、違う項目を準備しておく
    • クーポンアプリにスマートさは求めてないとかの率直な意見が得られる
  • ユーザビリティ
    • 操作を完了できるか、感想を口に出しながらためしてもらう
    • 登録できるか、クーポンをつかえるのか、退会できるか
    • 画面遷移ができる状態になっている ->ロゴが押せないとかの意見が得られた
  • 自分のテンション上がるダミー画像を使ったりする
  • 長方形の付箋がスマホサイズにぴったり
  • Q: デザインの検証項目はどういった基準で決めたのでしょうか?
    • 感じてほしいキーワードをチームで出して決定している スマートよりはポップ、親しみやすい など -「女らしい/男らしい」 -> どっちでもないからわかんないです という答えが狙い通りだったりする
  • Q: プロトタイプの調査の対象となるユーザは誰?
    • 本当はユーザになる人が直接つれてくればいいけど、社内で条件に当てはまるひとを何回か決めていた。
    • 実家に住んでいたので家族に聞いたりとか。
  • Q: SketchとInvision 、Invisionの検証でできなかったこととかは?
    • 基本的にはカバーできた。タブのスワイプは厳しかった。
    • 連続でアップロードすることでスワイプっぽさを再現できた
  • Q: アンケートばらつきすぎたらどうする?
    • だいたいは意見まとまってくる。その中で共通項を見つけて検証をすすめる。

~ エンジニアがユーザーテストをやってみた ~ 高齢者UIプロトタイプ検証の学び

  • 最初のプロトタイプは何故ダメだったのか? -> 合意のためのプロトタイプだったから
  • ちゃんとターゲット層に当たって実際に観察 -> 問題点の発見
  • 高齢者の知り合いの確保: 公園にいる人
  • 都会の高齢者、ITリテラシーが高い
  • インタビューする人と観察する人を分ける
  • 標準UI(select)でなく数字直接入力 -> ATMからヒントを得た
  • あいうえお表配列にした -> カラオケのデンモク
  • フラットデザイン的トレンドよりも見やすい色・文字を重視。ぐっと押し込む人がおおい。
  • ちゃんと使ってもらえるようになったとのこと、すごい...。
  • 課題発見のためのプロトタイプ 。「こういう動きをしてください」と言って観察する
  • Q: どうすればいいの?って言われたときにどう切り返したんですか?
    • 受付ですという設定をちゃんとしておく。僕は教えれませんと断ると、自走してくれる。
    • それでも聞いてくる人はいるけど、教えないのを徹底する。
  • Q: 高齢者以外は考慮されていたのですか?
    • 検討していない。若い人は勝手に自走してくれていたので、そこは無視した。
    • 受付の人の業務負荷を減らすことを重要視した
  • Q: 最初の時点で高齢者の方に聞いてみるという選択肢はなかったのか?
    • 設立前の話。ビジネスモデルを探っているフェーズ、かつ、メンバーにデザイナーもいなかった、知り合いに高齢者もいなかったので、決裁者のニーズを優先した。

スマートスピーカー(R&D)のプロトタイピングについて

  • R&Dチーム: ZOZOさんの研究開発部門、ちょっと未来の生活者が使うプロダクトを発明する
  • 新技術の検証: 爆発的に普及したときにどうなるのか?ユースケース
  • ユーザ価値の検証: 仮説>似たユーザにインタビュー>ペルソナ化
  • 緑のパンツにあう服は?
    • 最初はコードは書かずに仮のロールプレイ環境を準備して触ってもらう感じ
    • 検証ができたら作ってみる
  • 検証結果をプール: 社内に公開して定量、定性 的データを貯める
    • 社内会でリリース告知
  • データをストックするチームが社内にあるのすごい、ZOZOさん強い...
  • Q: 服以外の領域にも広げられると思うが検証領域のやるやらないはどう決めるのか?
    • ファッションという軸に絞っている。あとはミッションに沿うと絞られていく。
  • Q: スマートスピーカーってどこにあるという想定でやったのか?どこでもある?
    • リビングのテレビ台の横か、洗面台か、キッチンか、くらいの想定をした。
    • 後はスマホとか証明とかどこにインプットがあるか分からないので色々想定している。
  • Q: チームで未来はこうなるはずだというディスカッションをしたのか?チーム内でどうやってコンテキストを揃えたのか、その工夫は?
    • スマートスピーカーのチームは2人ですぐ隣にいるので、議論がしやすい。
    • 社内ドキュメントを常に何の議論が起こったのかを記録に残している。
    • プレゼンのタイミングで資料を作りながら振り返り、地盤をかためて進める。
  • Q: プロトタイプ、シーンを絞っているがどんなフィードバックを得られたか?
    • 夕方みんなつかっている。みんな朝余裕なくて使えない。
    • 土日の前に事前に考えておくタイプ。前から悩んでたことを相談するタイプ。
    • 服選びの課題にいろんなアイテムを聞かれると思ったが、同じアイテムについてばかり聞かれる。
  • Q: R&Dは周りを巻き込む意識のたかい組織。こういうやり方ならみんな参加してくれているのはどうやっている?
    • 新しいことやってるって楽しそうだよね、いいよねというところで巻き込みやすい

クックパッドマート立ち上げにおけるプロトタイピング

  • クックパッドマート: https://cookpad-mart.com/ 食材を注文して近所で受け取れる、エリア限定でサービス開始中
  • 現実世界を巻き込むプラットフォーム: とにかくキャストが多くて複雑,各関係者の気持ちにたって考える
  • オペレーションミスが起きづらい仕組みづくり、生鮮食品の扱いが難しい、現場の制限
  • サービスにたどり着くまでの紆余曲折
  • 買物代行で料理は楽しくなるのか? の検証: to 社内スタッフ
  • アンケートではふわっとした答えしか得られない
  • 制約: スタッフであってもお金を払うこと、それによって真剣度が変わる
  • 注文をスタッフから受付、自分たちて買い物、届けるというフローをやってみて検証から。
  • 既存のありものでフローを再現する。SpreadsheetをRDBっぽくして運用。メールとslackで注文通知、決裁はSquare。
  • 普段買わないものが喜ばれる、社内から自発的な料理投稿がされるなど、フロー再現から学びが多く、そこから価値がありそうというところに早くたどり着ける。
  • 接点のあまりないユーザ... 販売者/生産者のテストは?-> デザインスプリント(3日バージョン)、生産者に価値を感じてもらえるのか?
  • プロトタイプ... アプリでなくてよい。内容を理解した上でどう思うか?が大事
  • サービス説明しちゃう。注文からのオペレーションイメージやロールプレイを実際にやってイメージしてもらう。その後インタビュー。
  • スタッフが実際に配送員になりきってやってくるなどで実際のイメージを生産者に強く持ってもらう。
  • ネガティブ,ポジティブ意見別で付箋の色を変える。
  • ユーザの調理例が生産者にすごく喜ばれるのがわかった。
  • 保冷剤の量の話が引き出せる。課題がインタビュー者から提示してもらえる。
  • アプリ化しなくていい。
  • Q: ビジネスモデル的な試算はどのタイミングで?
    • デザインスプリントとは別にやっている。
  • Q: 仮説検証の3人は普段なにやっているひと?検証前につくりたい気持ちをこらえた?
    • 3人は立ち上げ時のみ、いまは3人ではない。
    • エンジニア、エンジニア兼デザイナー、事業部長(PM)の3人
    • 前者2名はすぐ作りたがる派ではなかったので、すぐ作りたいという気持ちはなかった。

LT: プロトタイピングとユーザーインタビューについて

  • figmaでプレゼン資料作った
  • ユーザの求めているものでない必須案件が降ってきた、とにかく大変
  • Prott or Figma で 1on1、3週*3人、自由に触ってもらう
  • ユーザのセグメントを切る。初心者/ときどき/ヘビー
  • カスタマーサポートのメンバーをサービスユーザから確保している。なので、ユーザインタビュー対象もカスタマーサポートのメンバーでいい。ユーザの意見を一番知っていて、リアルなユーザーとしての意見を聞ける
  • 意見: クリティカル/want に分けて対応していく
  • flamingoさん法人プランできたよ! フラミンゴ ふらっとみんなで語学

LT: デザインスプリントで機能がすっきりした話

  • 本の管理アプリを作ろうと思った。
  • もりもりの機能を入れようとおもったらエンジニアにこんなに機能いるの?といわれてしまった
  • デザインスプリントを省略パターンで実施。
  • プロトタイプから方向性などが見えてきた。デザインスプリントの before / after でかなりUIが違ったものとなった。

LT: 進捗ノート

  • ずっと右上にTwitterアカウントを出しておくスタイル!うまい
  • 頑張っていることを進捗報告したらコメントやメンションをもらえる
  • 進捗ノートを使うと共有なのでモチベが維持でき、共有範囲も選択できる
  • 個人開発はみんなこれを使ってくれるのか...?という不安が開発中止につながる
  • いいねを1投稿にたいして1日1回つけられるようにすることで、継続的に応援してくれる人がいると嬉しくなる
  • まだ開発中でも進捗を共有すればフィードバックをさっともらえる
  • 進捗ノートへの投稿をTwitterに投げるかどうか使い分けて発信頻度をコントロールできる
  • 自分で作っているサービス自体で自分のモチベを保つの強い...!

LT: Supernova Studio 使い始めてみたら割と良さそう

  • プロトタイピング後の実装に繋がる話
  • プロトタイプを見せうると「できてるやん!」という人がいる 。できてない!
  • プロトタイプ -> 実装を早くしたい。SupernovaStudioというのがあるらしい
  • Sketchファイルからネイティブを出力できる。すごい。
  • viewの開発工数が削減、デザインミス指摘が減る
  • 実戦投入開始。結果は将来
  • コードがおかしいところもあるけどクセをおさえれば大丈夫
  • Sketchの元の画像ファイルの加工とかで出力後の調整工数が変わったりする様子?

スポンサーLT: forkwellさん

  • エンジニアファースト、エンジニア支援
  • スポンサー総額 900万円(!)
  • オープンポートフォリオ
  • ロボットがGitHubを分析して紹介してくれる、面白そう

次回予告

12月大忘年LT大会: s-dev talks 〜サービス開発勉強会〜 大忘年LT大会 - connpass いきたいです!!(ぽちー