会場:パソナグループ 本部 8F イベントホール
関連:Find your Ability ! forクリエイター #6 プロのWebサイト・アプリ設計を学ぶ、駆け出しWebクリエイターのためのIA勉強会
書きかけのまま放置して忘れていたので、少し書き足してこっそり公開。。。。。
感想など
IAっていう言葉は聞いたことある気がして、なんか気になったので参加しました。このテーマの人気が高いのか、「Webクリエイター」向けだったのか、参加者数が多かったです。
そして女性の割合も多かった気がします。
情報アーキテクチャについて、なんとなく理解できて大変よかったです。
ただ、スライドの内容が濃くて、発表スピードも早かったので、メモを取ることが大変でしたが。。。。。
自分ができそうなことは、まずは、いくつかのサイトの構造図を作成してみることか。
- 本編
- スライド
- 情報アーキテクチャとは?
- インフォメーションアーキテクトの役割
- IAのプロセス
- IAの主な成果物
- IAに求められるコアスキル
- Webデザインとスマホ向けデザインの違い
- 参考書
- 質疑応答
- キャリアビジョン
本編
スライド
情報アーキテクチャとは?
1.情報を理解する- リチャード・ソール・ワーマン『Information Architects』
- パターンをまとめる
- 情報の構造を示す地図
- 理解しやすいように
2.情報を整理して、法則を作ること
- 『Web情報アーキテクチャ』
- 図書館情報学
- サーチエンジンがなかったときの情報への道すじ
3.問題を解決する
- ヤコブ・ニールセン『Webユーザビリティ』
- ユーザの視点を反映
- 問題なく目的を達成
4.機能を計画し、経験を設計する
- リリアン・スペック
- 潜在的なシステムを表現する計画
- ユーザーの経験を構築する
→ 複雑な情報をシンプルにする
使いにくいコーヒーベンダー
使いボタン等の配置が、実際の操作の動線に合っていない。
① コインを入れる
→ 右上の方
② 砂糖などを選ぶ
→ 中央のあたり
③ 味を選ぶ
→ 中央上のあたり
④ カップを取り出す
→ 右下端の方
⑤ カップを置く
→ 中央下のあたり
⑥ コーヒーが注がれる
→ 実際に観察する
インフォメーションアーキテクトの役割
使いやすい経験を計画し、設計する人- ユーザーの代表としての意識を持ち
- 必要な情報を整理し必要な機能を明確
- ユーザー中心のデザイン開発
- 推進する
情報を整理する ≠ 情報を整える
→ 情報を理解し、全体を把握し、全体を掌握する
例:書店。全体を把握している?でも把握している店員はいる。尋ねると本の場所を教えてくれる。
目に見えない使い勝手(利便性や機能)を設計する
IAのプロセス
1.要らないものをつくらない!2.無駄をなくす!
①目的の設計 > ②ユーザーの設計 > ③機能の設計 > ④サイトの構造の設計 > ⑤ページの構造の設計
①目的の設計
- ビジネスの目的やユーザーゴールの設計
- 情報を分解
- 成果物
- 競合調査
- ユーザー調査
- ゴール定義
②ユーザーの設計
- ユーザー像/ターゲット層の設計
- 情報の分析
- 成果物
- ペルソナ
- ユーザーシナリオ
- ユーザー用件定義
③機能
- フィーチャーと機能の設定
- どういう機能があるのか?
- 情報の分類
- 成果物
- 機能リスト
- 機能仕様
- 用件定義
④サイトの構造
- 情報の再構成
- 成果物
- コンセプトモデル
- サイトマップ
- フロー図
- 画面遷移図
⑤ページの構造
- 情報の再設計
- 成果物
- ワイヤーフレーム
- ページレイアウト
- 画面設計
IAの主な成果物
ペルソナ- 実在するサイト使用者を想定
- 1~2年のプロジェクトで一貫性を保つ
- 途中でわすれてしまわないように
- 仮説で決めてはいけない!
ハイレベルサイトマップ
- 既存サイトを確認する場合
- 構造を頭に入れる!
- アプリで自動化せずに、手を動かす
- 新しい構造の提案
ワイヤーフレーム
- 共通要素の整理
- 破綻や矛盾を発見
詳細サイトマップ
- 全体設計
IAに求められるコアスキル
- デザイン力とデザインマネージメント能力- リーダーシップとプロジェクトマネージメント能力
- 議論できちんと結果を導く
- ユーザー調査の設計と実行力
- 外注することが多い
- 外注先がきちんとできるように、望む成果物を得るために必要
- 調整力
- どうしょうもない状態をなんとかする
Webデザインとスマホ向けデザインの違い
Web- モニタサイズに影響
スマホ
- 端末の液晶に影響
- 手に持って移動する
例:Amazonのサイト
参考書
『IA100 ユーザーエクスペリエンスデザインのための情報アーキテクチャ設計』『IAシンキング Web制作者・担当者のためのIA思考術』
『Webサイト設計のためのデザイン&プランニング』
『Webデザイナーのための情報アーキテクチャ入門』
質疑応答
- 学ぶために何をやるとよいのか?体験できる講座などはあるのか?- 座学より手を動かす。
- A3の紙に、すきなサイトのリンクをクリックして、構造図をかきおこす
- 様々なサイトの構造図をかくと、サイトの構造が頭にはいる。パターンもわかってくる。
- クライアント側が、依頼する場合の注意点は?
- ドキュメントを残すように指示する
- どのように考えて設計した情報が必要
- ビジュアルデザインはかわる
- クライアント側が、事前になにをすれば、仕事がやりやすいのか?
- 現状のサイトマップとコンテンツ
- サイトマップに必要な情報・不要な情報にチェックをいれておく
- ユーザ調査をしておく
- ユーザー調査を学ぶには?
- 外注する調査会社と一緒にやる
- 本を読む
- 実際に関係のない人に使ってもらい、その様子を観察する
- 会社の前で通行人をつかまえる
- 予想外の行動をする
キャリアビジョン
常に何をやりたいか考えていた→ 何が足りないのかを考える
先を考える
→ やれる環境をつくる
魅力を感じるものをリストアップ
→ 周辺のことを観察する
人が何してるのか観察する
0 件のコメント:
コメントを投稿