選択されているタグ : コワーキング

タグを絞り込む : ablogcms Apps CPI Google イベント ベースキャンプ名古屋 勉強会

長谷川恭久さんの「プロトタイピングから始めよう」ワークショップに参加しました

2012年9月21日(金)にベースキャンプ名古屋で開催された長谷川恭久さんの「プロトタイピングから始めよう」ワークショップに参加しました。(今回受付をしながらだった為、内容を記録・理解しきれていない箇所があります。)

プロトタイプとは

プロトタイピングから始めよう / 長谷川恭久さん

パソコン向けにだけ Web サイトを作っていた頃はあまり必要性を感じられなかったプロトタイピングも、Webへアクセスする方法が増えてきたころから、その必要性も高まりつつあります。パソコン向けに絞ったとしても複雑なインタラクションを絵だけで共有するのが難しくなってきました。余計な書類を減らし、課題が具体的に見えてくるプロトタイプの魅力と活用を紹介。今回はプロトタイプの中でもペーパープロトタイピングにスポットを当てて、メリット・デメリットを解説します。また、今回はミニワークショップを行い、プロトタイピングと批評を行います。

今回のテーマである「プロトタイピング」「ペーパープロトタイピング」。私はまずこの言葉を使った事がありませんでした。ウィキペディアで調べると、

プロトタイピング(Prototyping)とは、実働するモデル(プロトタイプ)を早期に製作する手法およびその過程を意味する。その目的は、設計を様々な観点から検証するためだったり、機能やアイデアを形にすることでユーザーから早めにフィードバックを得るためだったり様々である。プロトタイピングはシステム設計工程の一部として組み込まれることも多く、それによってプロジェクトのリスクと費用を低減させると考えられている。反復型開発では1つ以上のプロトタイプが作られ、欠陥や問題が徐々に解決されていく。プロトタイプの改善が十分なされ、機能/堅牢性/製造の容易さといった設計目標に達したとき、製品としての製造が可能となる。

とあります。ペーパープロトタイピングは、Webデザインをする時にfireworksなどで作るワイヤーフレームを、紙とペンで設計していく手法ということでしょうか。

今回のお話を聞いている中でウェブデザインレシピさんの高橋のりさんもスケッチブックに手書きで書いてるって記事があったのを思い出したので参考に。これもペーパープロトタイピングになるのかな。
Webデザイナー(私)によるWeb制作のときに気をつけてることや制作フローとかいろいろ

勉強会の流れ

話を戻しまして、今回の流れは

プロトタイピングとは

  1. プロトタイピング、ペーパープロトタイピングとは
  2. パソコンで行うプロトタイプのメリット・デメリット
  3. ペーパープロトタイピングを行うメリットデメリット

ワークショップ 

ベースキャンプ名古屋のサイトをスマホのアプリにしてみよう。

  1. Amazonを参考にPCサイトをスマートフォンサイトにする時の考え方
  2. 利用者像を把握
  3. ユーザーシナリオを作成
  4. シナリオを基にプロトタイプ。ワイヤーフレームを描く
  5. プレゼン
  6. 恭久さんの講評

まとめ

ペーパープロトタイピングのまとめ

ペーパープロトタイプを行うメリット

誰でもどこでも紙とペンがあればできる。パソコンで制作したものは心情として捨てにくく、少ないパターンの中でこだわって、アイディアが固まりがちになる。それを紙に書く事で、さくさくと複数のパターンを出す事、捨てる事が容易になる。

そもそも、現在さまざまなデバイスがある中で、全て従来の方法でデザインカンプを作って表現するのは難しい。静的で点になりがちな為、アプリのデザインなどには向かないのではないか。そこでペーパープロトタイプを使う事で、細かな表現をクライアントに伝えやすくなり、その場で書き込みながら作り上げる事ができる。(受付しながら聞いた事を要約してるので、間違ってるかも...)

捨てる力が大事

アマゾンを例にとって、PCサイトからどのようにスマホサイトに作りかえるを解説。取捨選択が必要になる。見た目のきれいとかかっこいいではなく、全体の流れが分かりやすいか、使いやすいかが大事。捨てる力が大事。

  1. 優先順位を決める(例:今すぐ購入できるように1clickボタンを大きく設置)
  2. タスクを補助する要素を残す(例:カスタムレビューなど)
  3. 利用シナリオを想定
  4. 見た目じゃなく使いやすさ、分かりやすさ

ワークショップのまとめ

利用者像を決めて、ベースキャンプ名古屋のユーザーシナリオを描く。
私が考えたユーザーシナリオは、「ベースキャンプの今が分かるアプリ」

  1. カフェで一人仕事をしているAさん。作業に没頭して煮詰まる。気分転換したい。誰かに相談したい。
  2. そんな時、アプリを立ち上げれば、
  3. ベースキャンプの現在がライブ配信されている(顔にはぼかしが入る高機能なカメラを使用)
  4. 利用者のチェックイン状態が見えるので今だれがいるかわかる
  5. 席の空き状況もわかる
  6. それを見て、Bさんがいるから相談しに行こう!となる
  7. おわり

私のアイディアはたいしたことないけど、参加者の方々の発表を聞いて参考になりました。例えば、

  • 私のアイディアと同様、チェックイン状態が見え、さらにそこで連絡をとれる機能がついてる。
  • 会員アプリになっており、スタンプが貯められたり、デジタルチケットとして利用ができる など。

その後、実際どんなUIにするかを書き、発表。

恭久さんの心配りについて

とても分かりやすく、引き込まれるお話をされる方だなぁと思いました。固くなりすぎないよう、みんなを和ませる会話や休憩を挟んだり、休憩中にはみんなが書いたプリントを表向きのまま置いておくように指示をしたのは、なるほどーと思いました。他の人の書いたものを見れるように配慮してくれるのは、ありがたいなーと。

恭久さんのファンになったので今後はポッドキャストを聞いてみようかな。
http://www.yasuhisa.com/inflame/


タグ(この記事に関連するキーワード)

プロフィール

  • Twitter
  • はてブ

日比野(ひびの)ななえ

Googleアナリティクスの使い方やアクセス解析について書いてます。

エントリーリスト

カテゴリーリスト

オススメの記事

タグ