bookslope blog

Information Architect/User Experience Designer

Archive for the ‘event’ tag

サイトマップを描いてみよう (CSS Nite LP7 Redux 03)

with one comment

サイトマップを描こう

事前課題にあげた「サイトマップ」については、当日間近 (8/29) にあった第24回Websig24/7会議「100人で考える、理想的なサイトマップの形と標準書式」を参考にしてそこで得た知識をなるべく話そうとしました。

決して、「サイトマップ (ページ)」のことを指しているわけではありませんので、あえて「ページ」をつけています。

サイトマップとは
Webサイトに掲載する情報を組織化し、その論理的な構造をツリー図として表現した資
料。 画面遷移のフローチャートとして使用できるように情報が付加されることもある。

このブログのエントリーでも書きましたが、Websig24/7会議の模様は下記エントリーを参照してください。

ここでも提出させてもらったサンプルがあるのですが、等斜角を持ったアイソメ図からExcelで作成したツリー図・Visioで作成したダイヤグラムなど、さまざまなカタチがあります。これはもちろん異なるプロジェクトにおいての成果物サンプルなのですが、やはりそれぞれのプロジェクト体制やドキュメントの目的は異なります。

ビジュアルボキャボラリーを活用する

サイトマップの書式」という言い方をする場合がありますが、ドキュメントの書式というのとドキュメントで扱う情報の表現 (凡例) とは異なります。ここでは後者について概念的な理解として「ビジュアルボキャブラリー」を紹介しました。

Jesse James Garrett: Visual Vocabulary for Information Architecture

ジェシージェームスギャレット氏の「Visual Vocabulary for Information Architecture」をコンセントの長谷川さんが翻訳したサイト「jjg.net: a visual vocabulary(日本語版)」があります。

これは,インフォメーションアーキテクトあるいはインタラクションデザイナーが,
ウェブサイトにおけるストラクチャーあるいはユーザー経験のフロー,またはその両方
を抽象度の高いレベルで記述するためのものだ。

このビジュアルボキャブラリーをすべて覚えるのでもいいのですが、抽象的な情報の (サイトマップとしての) 表現方法を理解し、ふだん作成しているサイトマップ上での表現に活かしてほしいと思います。

gihyo.jpで連載していた「Web情報アーキテクチャ(IA)とツール」も参照のこと。

ふだん扱う情報の凡例としては次のようなものが考えられます。

凡例サンプル

  • 単一ページ
  • リンク
  • グループ
  • 別ウィンドウ
  • 複数ページ
  • 導線
  • 関連性 (関係線)

Websigでもあったのですが、この「」の扱いについて「導線」と「関連性 (関係線)」を同一と考えている傾向が多々あるようです。ホームページから全カテゴリートップページに矢印がついているサイトマップをよく見かけるのですが、これは不適切だといえます。

矢印はステップ (進み方) としても理解できるため、ホームページと全カテゴリートップページとを結ぶ線は必ずしもその順番で画面を遷移しないといけないわけではありません。したがって、表現する場合は矢印ではなくコネクタとして (ただの線で) 表現するほうが好ましいでしょう。

最低限必要なサイトの情報

サイトマップを描こう

また、サイトマップには最終的に物理的 (ページ) にするための情報も含まれるため、以下のような最低限必要なページ (情報) も含めておくといいでしょう。

サイト情報/Site Information

  • サイトマップ
  • サイトの利用規約
  • プライバシーポリシー

機能/Function

  • サイト内検索
  • RSS配信
  • 文字サイズ変更
  • 印刷

Flickrのほうにあげていただいたサンプルについてもいくつかコメントさせていただきましたが、こちらは別途細かく見ていくとしていくつか注意点があげられます。

  • 関係性を矢印で表現しない
  • 階層はわかりやすく構造化する
  • 画面エリアで整理しない (見た目で分類しない)
  • 導線にあたる線は矢印にする

潜在意識にあるサイトマップを描いて共通認識を探る

ワークとして、「企業情報」配下のツリー図を描いてみることをしました。これは潜在的に自分の中にある (ある意味) 基本的な情報構造を表現したみた場合に、他人とは違う点、また、とらえ方にも個人差があり共通項を見つけることが難しい点を体感してほしかったことが理由です。

たとえば、「プレスリリース」と言ったときにはどうでしょうか。2009年の情報をプレスリリース (インデックス) ページに含めるのか含めないのかでも書き方は変わってきます。リダイレクトするなどの情報をどう表現すれば伝わりやすくなるのか考えてほしかったわけです。

事前改題の回答例

サイトマップを描こう

サイトマップは比較的抽象的で構いません。何度も言っていますが、事前課題の状況を踏まえた場合の詳細度でOKです。凡例としては大分類のグルーピングがされていればほかはとくに気にならないかと思います。

ポイントとしては、以下2点が表現されていることになるかと思います。

  • 「サービス・ソリューション」「施工実績」配下に共通にある「分野」などの情報分類と相互リンク (関係性) の表現。
  • 「お問い合わせ」および「サポート情報」への矢印 (つながりの) 表現。

さて、次は「ナビゲーションを考えてみよう」を振り返ってみます。

関連エントリー

Written by bookslope

9月 30th, 2009 at 8:12 am

Posted in Study

Tagged with , , ,

企業サイトにおける4+1のメニュー分解 (CSS Nite LP7 Redux 02)

with 4 comments

さて、「最適なメインメニューを考えてみよう」のつづきです。

企業サイトにおける4+1のメニュー分解 (スライド)
撮影: 飯田昌之

企業サイトの情報分類

ひとくちに「企業サイト」といっても昨今の企業サイトを見れば単純な会社情報だけを扱っていないことに気づきます。つまり「事業内容」が肥大化してサービス情報として大きく取り扱う傾向があります。

企業サイトと言われるほとんどが――

  • その企業の情報を扱う「会社情報系」
  • その企業の事業を象徴する「商品・サービス系」

とに大きく分類することができます。

例にならって課題サイトのメインメニューを「会社情報系」「商品・サービス系」に分類してみると、ほとんどの情報が収まることがわかります。

会社情報系と商品・サービス系

サイトマップページには「(実は) 提供側で見てほしい情報が隠されている場合がある」と書きましたが、やはりメインメニューにも提供側の意図が見え隠れしてきます。つまり、企業情報を主にしている場合には「会社情報系」を主軸に、サービス情報を主にしたければ「商品・サービス系」を主軸に分類していることがあります。

また、「企業情報サイト」「サービスサイト」というサイト単位で分けているケースもあります。ドメインから分ける場合や管轄部署を分ける場合など理由はさまざまありますが、その企業の事業範囲とサイトに掲載している情報の規模によりどこに主軸を置くかは検討が必要です。例として、ソフトバンクモバイル株式会社の企業情報サイトサービスサイトがあります。

企業サイトにおける4+1のメニュー分解

経験則ですが、企業サイトで扱うサービス情報には相対する「サポート情報」が含まれます。それは、そのサービス情報には「これから利用する人」「すでに利用している人」が想定できるからです。

  • 新規 (商品・サービス/Webサイト) 利用者向け
  • 既存 (商品・サービス/Webサイト) 利用者向け

多くの企業サイトで「お問い合わせ」が目立つ位置にあるのはこの情報群を取り出しているせいです。もちろんコンバージョンを意識した「アクション」として位置づけているケースもありますが、ここでは情報の種類で説明しています。したがって、企業サイトで扱う情報のほとんどがさきほどの2つ (会社情報系・サービス系) をこの4つにさらに分解することができます。

  1. サービス
  2. サポート
  3. 企業情報
  4. ニュース
  5. 独自

また、「独自」な情報群としてその企業の独自性 (アイデンティティ) を象徴するような情報があれば情報の粒 (粒度) が異なっても含めておくほうがいいでしょう。例では、「防災のトビシマ」を独自な情報群として説明しました。

企業サイトにおける4+1のメニュー分解

この「企業サイトにおける4+1のメニュー分解」に課題サイトのメインメニューを当てはめたものが下記です。

企業サイトにおける4+1のメニュー分解を適用

他社サイトの把握と業界標準

他社サイト

業界ごとにWebサイトを見ていくと、その業界・業態によりデファクトスタンダードが存在していることに気づきます。例では建設業界 (清水建設鹿島建設大成建設戸田建設) でしたが製薬業界や金融業界などやはり一定のメニューに集約されています。ここで取り上げた他社の企業サイトでも「会社情報系」と「商品・サービス系」とに分けてみると明確にその企業の意志が伝わってきます。

B2Bにける商品・サービス系には必ずと言っていいほど「事例」や「実績」が取り上げられます。例で取り上げた他社サイトも4サイトのうち2サイトが「実績」がメインメニューに含まれていました。

最適なメインメニューのまとめ

今回の課題では、以下の2点が考慮されていればメインメニューの最適化という課題に対しては妥当性のある回答と考えられます。

  • 商品・サービス系として「ソリューション」をまとめること
  • 「お問い合わせ」つまり「サポート情報」を加えること

いかがでしたでしょうか。スライドでは、以下の情報群でまとめました。

最適なメインメニューを考えてみよう (回答例)

  • 技術・ソリューション: 商品・サービス系 (※1) としてまとめる
  • 施工実績: B2B特有の情報として※1から取り出す
  • お客様サポート: 「お問い合わせ」を含む情報として加える
  • 企業情報: 採用情報を含む会社情報系 (※2) の根幹
  • 株主・投資家情報: 上場企業としての重要な情報配信を※2から取り出す
  • ニュース: 広報としての情報配信として※2から取り出す

最適なメインメニューの最適化として、さいごにまとめたのが下記3点です。

  • 情報の共通項を見つける: グルーピングから情報整理ははじまる
  • 他社との共通項を見つける: 業界標準を意識する
  • 重視する方向性を決める: 企業情報にはその企業の意図が含まれている

ということで、「最適なメインメニューを考えてみよう」だけで2エントリーになってしまったのですが、週1くらいで振り返っていこうと思います。

関連エントリー

Written by bookslope

9月 20th, 2009 at 11:37 am

Posted in Study

Tagged with , , ,

最適なメインメニューを考えてみよう (CSS Nite LP7 Redux 01)

with 2 comments

先週開催された「CSS Nite DISK, LP 7」のワークショップを解説含めて振り返りをしてみたいと思います。

IAスペシャルでのワークショップ
撮影: 飯田昌之

当日のスライドはSlideshareにもアップしています。「IAスペシャルでのワークショップ (CSS Nite LP, DISK 7)」もご覧ください。

事前課題

事前課題を出したのは、当日までに気分を盛り上げる作用もありますが、どちらかというと参加者が期待されている「IA」をワークを入れて全体像をつかむには1時間内ではどうしても時間が足りなかったせいです。

これまで参加したことのあるワークショップでは、前提となる参加者の状況や役割により意見が分かれて論点がブレてしまう傾向があると感じたため、状況を決めてしまうところから考え始めました。

事前課題 (CSS Nite DISK, LP 7)

  • 自分は30代のWebディレクターである
  • 勤務先の制作会社では、内部にデザイナーやコーダーがいる
  • 来週顧客に説明に持っていく資料
  • その資料は、要点が書かれていればよい
  • 上司 (営業) もいっしょに同行する

この状況ですと、「サイトマップ」と言ったときに想像するものは詳細なサイトマップである必要はありませんし、デザイナーではないのでデザイン的に作り込む必要もありません。時間的にもそれほどあるわけではありませんので、時間をかけて課題に取り組む必要もないことになります。

対象サイトの選定

飛島建設

飛島建設」さんのウェブサイトを対象にしたのは以下3つの理由です。

  • 今どき珍しいレガシーなつくりだった
  • ざっと見た程度でも改善点が見つけやすかった
  • 建設業界という大きな業界のため類似サイトが多く見つけやすかった

最適なメインメニューを考えてみよう

あえて「メニュー」という言葉を使ったのは「ナビゲーション」という言葉の持つ意味と分けて考えたかったからで決して言葉の定義が揺らいでいるわけではありません。また、「7つのナビゲーション」を出したのは、前のセッションの振り返りの意味があります。

まず、サイト全体を把握することからはじめると思いますが、その際には――

  • メインメニュー (ナビゲーション類) を見る
  • サイトマップページを見る
  • 一定時間いろいろ触ってみる

をしていくことになると思います。ヒューリスティック分析ユーザビリティ調査をしたことのある方にとってみれば、もう少し細かい作業をするかも知れませんが。もちろん個別の情報を得るにはアクセス分析ツールを見ることや、プリフェッチャソフトなどでファイルを取得して物理的な情報を見るというのもあります。

さて、その中でサイトマップページには2つの側面があります。

サイトマップ

  1. そのサイトで扱う情報 (ページ) の大分類がわかる (反対に上位階層だけの場合がある)
  2. (実は) 提供側で見てほしい情報が隠されている場合がある (階層で割り切れない場合がある)

とくに2は経験がある方も多いと思います。

課題サイトでは、メインメニューで扱っている分類とサイトマップページで扱っている大分類とでやはり違いが見つけられます。これが2にあたる部分だと推測できるのですが、この段階でメインメニューの分類とサイトマップページの分類に違いがある点を見つけられればOKです。

実体をもたない情報分類

課題サイトのサイトマップページ左上には「トップページ〜」という3つの分類があります。これも前述の2にあたる部分ではありますが、どうしても画面要素で分類しがちな点は必ずつきまといます。これら3つの分類は、実体をもたない集合体でいわゆるショートカットリンク集にあたります。つまり、実体はほかの分類として分けられているのに、画面要素での分類でも見せたいという意図 (前述の2) が理由としては考えられます。

当日は3つとも対象外として説明しましたが、実は3つめの「トップページ下部メニュー」というのは無視してはいけません。「サイトの利用規約」や「プライバシーポリシー」はサイトに必要な情報群としてまとめるケースがあります (例: サイト情報)。当日は論点をメインメニューにしたかったのでここの説明は省きました。

トップページ下部メニュー

共通項目をまとめてグルーピングしてみよう

KJ法」や「カードソーティング」という言葉で聞くように、情報に分類にはいろいろな方法があります。課題サイトで扱うメインメニューを考える際に、そのサイトで扱う情報構造の最上位を自分の視点でグルーピングしてみるところから考えてみました。

当日も話しましたが、事前課題で取り組まれた参加者のほとんどが画面要素に分解して考えていたこと (つまりワイヤーフレームで考えていたこと) には驚きました。あえて「メニュー」と表現したの真意は、まずは情報の分類を純粋なリストで考えてみてほしかったからです。

課題サイトを改めて見た場合、ホームページと下位階層ページのナビゲーションが違っていることに気づきます。ここで、下位階層ページのナビゲーションを、ある視点で分類 (グルーピング) したものがホームページでのナビゲーションになると思ってしまうとNGです。

例として線を引いたものがありますが、さきほどのサイトマップページの分類とホームページのメニューとで突き合わせた場合に、結局まとめきれずに「防災のトビシマ」と「Bespokeサービスソリューション」が余ってしまうことになります。したがって、この2つをグルーピングしなければ、サイトの情報分類の最上位を整理できたことにはなません。例では「サービス・ソリューション」という分類を追加しています。

共通項目をまとめてグルーピングしてみよう

共通項をグルーピングしてみよう

少し長くなってしまったので、ここでいったん区切ります。

関連エントリー

Written by bookslope

9月 20th, 2009 at 10:49 am

Posted in Study

Tagged with , , ,

IAスペシャルでのワークショップ (CSS Nite LP, DISK 7)

with 4 comments

CSS Nite LP, Disk 7「IAスペシャル」(2009年9月12日開催)

先日 (9/12) 行われた「CSS Nite LP, DISK 7」は、300人を越す参加者となり予想以上に大人数かつ大きな部屋に大きなスクリーンで、これまでにはないシチュエーションでした。

前半のセッションではどちらかというと参加者が聴く姿勢になるので、わたしのセッションではできるだけ手や頭を動かせるワークショップ形式にさせていただきました。300人強でワークショップ (?!) というのははじめてで大きなチャレンジでしたのではじめはどうなることかと思っていたのですが、みなさんの協力あってカタチにすることができました。

当初、もう少し参加者と近い距離を想定していたため、その場で課題に対する質疑応答なども考えていたのですが、想定以上に部屋が大きかったこともあり (参加者が多いということもあり) かなり小刻みにタンタンと進めるような格好になりました。

CSS Nite DISK, LP 7
撮影: 飯田昌之

結果としては、事前課題に取り組めた方と取り組めなかった方とで大きく反応が分かれましたが、伝えたかったこと (感じてほしかったこと) は、十分に伝えることができたと思っています。

ワークについては、課題の出し方・取り組み方がうまく伝え切れずに消化不良にさせてしまった点がありました。ただ、このテーマを考える上で重要な点は伝え切れたと思います。あの場で理解できなくてもあとあと「こういうことを言わんとしていたのか」と思う場面が必ず出てくると思うので、そういった場面で活かせられれば幸いです。

別途、課題についてのエントリーも書こうと思います。

ちなみに今回「IAスペシャル」だったのですが、「IA」を専門職の領域だとかある意味遠くて現実的ではないと思われてしまうことを嫌って、このセッションでは「IA」という言葉を一回も使わずに進行してみました。また、テーマに「LPO」とあるのですが、こちらもあえて「LPO」「ランディング」という言葉はいっさい使わずに、考え方や手を動かすことで中身を伝えるようにしました。

というのも、参加者が自分たちの関わっている業務に直接関係している範囲で考えてほしかったのと専門用語を使うことで「知っている」というふうに安直にとらえてほしくなかったことが理由です。手を動かすことで「知っている」のではなく「理解できている」ということを自身で感じてほしかったことが一番の理由です。

Workshop
撮影: 飯田昌之

懇親会の場で安藤さんと建設業界におけるウェブでのソリューション訴求は実際にはあまり意味がないので、現実味が薄かったとご指摘もいただきました。建設会社さんを題材にした理由は、たまたま見つけたレガシーなつくりだったことと間違い探しをしていく上で説明がしやすかったのが理由で、それ以外にはありません。

反省点

アンケートのほうで皆さんからご指摘いただけことも、自戒を込めて今後の活動に活していくようしたいと思います。

  • 事前課題を取り組んでもらうような促し方ができなかった。
  • 課題の取り組み方とアウトプットイメージを伝えきれなかった。
  • 所々早口になってしまった。
  • スライドの文字が小さい部分があり遠くの方から見えにくかった。
  • グループディスカッションに時間をあまり割けられなかった。
  • 時間を延長してしまった。

今後の取り組み

最後にご紹介したデジタルスケープのワークショップは、下記からご覧いただけます。

今回の反省点を活かして、さらにパワーアップしてお届けしていきます。

関連エントリー

Written by bookslope

9月 14th, 2009 at 1:47 am

Posted in Study

Tagged with , , ,

理想的なサイトマップの形と標準書式

with one comment

第24回WebSig会議「100人で考える、理想的なサイトマップの形と標準書式」に参加してきました。
当時の模様は、公式サイトのエントリーでご覧いただけますしTwitterでも中継 (?) されていたようで「buzztter」で見ることができます。ミクシィでも感想トピックスが立ち上がっているようです。

また、当日のスライドもSlideshareで公開されています。

第24回WebSig会議「100人で考える、理想的なサイトマップの形と標準書式」

View more presentations from websig.

この中での課題定義については、以前gihyo.jpで書いていたエントリー「サイトマップと情報の構造化」も参考にしていただけたようで、以下のように定義付けをされていました。

サイトマップとは
Webサイトに掲載する情報を組織化し、その論理的な構造をツリー図として表現した資料。 画面遷移のフローチャートとして使用できるように情報が付加されることもある。

ワイヤーフレームとは
画面に表示する要素とその配置を簡潔にまとめた資料。 ユーザーの操作に対するシステムの反応やインターフェースの振る舞いも定義する場合がある。

ファイルリストとは
Webサイトを構成するファイルの一覧。 列記する項目としては最低限、画面名(または識別子)、ディレクトリパスとファイル名(物理的な構造)、URLを含む。

今回の課題は「サイトマップ」だったのですが、やはりウェブサイト構築をする上ではそれだけで完結するものでもなく、ファイルリストなども十分に関係してきます。ここでも「ワイヤーフレームコミュニケーション研究会」のエントリーでも書いたように「前提を揃える」ことが大切になってきます。そういう意味では前提としていくつか条件があったので取り組みやすかったと思います。

提出した課題

  1. ボキャブラリーの標準が浸透していないため表記がバラバラ
  2. 論理構造なのか物理構造なのかが混在してしまうケースがある
  3. システムフローと同等の成果物と思われることがある
  4. すべてを網羅しようとするとA3におさまらない
  5. 運用上の更新はすべきか、誰がすべきか
  6. 後工程でどう使うかがわからないとどこまで必要かがわからない
  7. 結局お客さんはサイトマップを見てもわからない
  8. 画面IDと連動するシステムがない (ソフトではあるものもあるが)
  9. コンテンツ管理と連動しようとするとCMSが必要になる
  10. アセット管理や素材管理と連動したくなる

参加したグループでは以下のようなことをまとめていたと思うので思い出しながら書いておきます。

課題1 (比較的静的なウェブサイト) について

必要な情報

主によく検討する情報としては以下のようなものが必要になるかと思います。

  • 識別子 (枝番IDやラベリング)
  • 単一ページ/複数ページ
  • 物理的/概念的・論理的 (ファイルがあるのかないのか)
  • 静的/動的 (HTMLかそれ以外か)
  • 関係線/導線
  • 同画面遷移/別画面遷移
  • 本サイト/外部サイト

必要な表現

ビジュアルボキャブラリーを決めておく。

ビジュアルボキャブラリーについては、Jesse James Garrett氏の「A visual vocabulary
for describing information architecture and interaction design
」をコンセント長谷川敦士さんが翻訳された「情報アーキテクチャ、インタラクションデザイン記述のためのビジュアルボキャブラリー」を参照のこと。

印刷対応

全部を1枚に収めるのは不可能なので説明したい箇所だけを切り出す。

課題2 (RIAのウェブサイト) について

ファセットの表現

「どんな情報に整理でき、どんな情報を扱うのか」に着目しました。
画面上にある情報をフラットに並べて再整理をし、カテゴリの整理と出力されている情報の整理をしました。タグのようなものをサイトマップで示そうとすると (ドキュメントとして) 破綻してしまうので、説明する内容を制限し、わかりやすいものに仕上げました。

感想

ないものを作り出すための作業ではなく、すでにあるものからサイトマップを作成するため、どうしてもウェブサイトを見ての判断になり画面の要素に偏ってしまうことです。したがって、サイトマップを作成する作業にも関わらず画面仕様書に近いものを作成しているグループがあったように思います。

もちろん結論として (というか実際の現場だと) わかりやすいものであればなんでもいいのですが、サイトマップを作成するという課題に対して「結果として画面仕様書になりました」だとちょっと違うかなと思いました。

実際にサイトマップを作成する (作成するというより再整理するという表現のほうが適切だと思いますが) 状況の多くが、すでにあるものを参考にすると思うので、そういう意味では近い状況にはできたかと思いますが、であれば、課題1のサイトマップ (あらかじめ印刷されたもの) はいらなかったと思います。結果的にそれにどういう情報を付け加えれば理想のサイトマップになるのかにボクがいたグループは意見を集約できたのでよかったのですが、ほかのグループの結果を見るとあらかじめ用意されたものをなくしてゼロから書き上げていたので、論点が幅広くなってしまった印象がありました。

課題としてあがっていた「理想的なサイトマップの形と標準書式」については以下のようにまとめることができると思います。

  • サイトマップの理想のカタチはワイヤーフレームと同様、自分の状況や後工程に依存する
  • サイトマップの標準書式はビジュアルボキャブラリーを揃えることで標準化できる

この「自分の状況」や「後工程」にどれだけのパターンがあるのかはイシューだと思いますが、そうしたことを意識しながら日々取り組んで行くことで業界全体としても理想のカタチになっていくような気がします。

少なくても「サイトマップ」という言葉で、しかも「IA」という言葉を使わずに、これだけの参加者が集まれることや、そのことにこれだけ関心を持つ人がいること自体にパワーを感じました。

Written by bookslope

9月 5th, 2009 at 7:24 pm

Posted in Study

Tagged with , ,

第4回アックゼロヨン・アワードの審査員と表彰式

without comments

第4回 アックゼロヨン・アワード

アックゼロヨン・アワード

日本ウェブ協会 (W2C)」の活動として、今年も第4回となる「アックゼロヨン・アワード」の表彰式が行われます。わたしの所属している会社はW2Cの会員ではあるのですが、なかなかこれまで直接的に協力させていただくことができなかったこともあり、今回は審査員としてご協力させていただくことになりました。

見てわかるとおり、ウェブ業界といいますかウェブ界隈では著名な方ばかりです。その名前や顔写真は一度は目にしたことがあるんじゃないでしょうか。そんな中に加えてもらうことができて、とても光栄であると同時に恐縮してしまうのは言うまでもありません。実際の審査方法はシンプルではあるのですが、全部で145作品もあるため、なかなか難しいものでもありました。エントリー作品の概要が書かれたレジュメを見て、実際のサイトを見て、いくつか操作をして、繰り返しは貴重な経験にもなりました。

審査の評価軸

  • デザイン表現
  • 情報構造
  • 技術
  • ユーザビリティ
  • アクセシビリティ
  • アイディア

さて、来週の火曜日 (9/8) に「表彰式」が行われますが、入賞作品について少しずつコメントをさせていただけるということで、もう一度見直しているところです。

2004年にアックゼロヨン・アワードが開催されてからもう5年経ちます。ということで、今年含む過去のグランプリ作品をリストアップしてみます。

第4回グランプリ作品 (2009年)

第3回グランプリ作品 (2007年)

第2回グランプリ作品 (2006年)

第1回大臣賞作品「総務大臣賞」ほか3賞 (2005年)

もう「みずほ証券」はリニューアルされていますね。こうして日々進化しているのもウェブという媒体の特長と言えます。「過去の栄光は消え去るのみ」という感じで (なぞ)。

2006年に「アクセシビリティ・アワード」から「アックゼロヨン・アワード」に名称を変更しているようで、そもそも「アックゼロヨン」という名前の由来を調べてみると以下のような造語のようです。

アックゼロヨンという名前の由来

アックゼロヨンという名前の由来は、アクセシビリティとクリエイティビティ(Accessibility +Creativity)から作った造語『AcC』をアックと呼びました。そして財団法人日本規格協会から公示された、「高齢者・障害者等配慮設計指針− 情報通信における機器、ソフトウェア及びサービス−第三部:ウェブコンテンツ」(JIS X8341-3:2004 通称WebJIS)の公示年が2004年であったことからゼロヨンという名前を貰いました。

ということで、来年も応募があると思いますので作品のエントリーはしていけるようにしていきたいものです。やはりエントリー数がそもそも多いと入賞する確立も必然的に高くなりますので。

表彰式、もしお時間ある方は覗きにきてもらえればと思います。

Written by bookslope

9月 5th, 2009 at 1:25 pm

Posted in Info

Tagged with , ,

IA Cocktail Hour Tokyo (UX Insenticve参加報告) のお知らせ

with one comment

IAAJでも公開しましたが、来る9月4日 (金) に、IAカクテルアワーを行いたいと思います。前回からかなり時間が空いてしまいました。前回までの活動風景はFlickrで「iaaj」タグで検索していただけるとご覧いただけます。

今回は、(株) ビジネス・アーキテクツの奥さんから6月に参加されたUX Insentive (サンフランシスコ) の参加報告をしていただけることになりました。
現地でのワークショップということですので、日頃の共有方法やブレストなどで参考になることが多いかと思います。興味ある方がぜひご参加ください。

【IA Cocktail Hour Tokyo】
内容: UX Insenticve参加報告
日時: 09/04 (金) 18:30~21:00
場所: (株) ビジネス・アーキテクツ 会議室
定員: 30名~40名程度
会費: 1,000円程度 (ドリンク代)
主催: IAAJ
協力: (株) ビジネス・アーキテクツ

人数制限としては、30名~40名程度とさせていただきたいと思います。
参加表明は、直接 <entry@iaaj.org> までメールをお送りください。氏名 (できれば読みがな)、所属先、メールアドレスを記載ください。

■補足

UX Intensive
2009年6月14日~17日にサンフランシスコにて開催。
プロダクトデザイン、UI、オンラインサービスのユーザーエクスペリエンス構築のステップアップを目指す、UXプロフェッショナル向けの4日間のワークショップ形式のセミナー。1日づつテーマを分けて実施。

  • 1日目: デザイン戦略
    デザインをビジネスへの関連性を明確にしていくために必要なツールを紹介。
  • 2日目: デザイン調査
    最も利用して欲しいユーザーの洞察を通してデザインに役立つ情報を収集するアプローチを紹介。
  • 3日目: 情報アーキテクチャ
    今回は通常のIAプロセスではなく、メタデータ、コンテンツ分析、検索、分類とサイト構成例についてのアプローチを紹介。
  • 4日目: インタラクション・デザイン
    モデル化やデザインコンセプトの制作から、クイックプロタイピングまでのアプローチをテスト課題に沿って実践。

Adaptive path Inc.
米国を代表する、ユーザーエクスペリエンスをテーマにプロダクツから、ウェブサービスのデザインコンサルティングを行う会社。
「Ajax」を命名した人物としても有名なジェシー・ジェームス・ギャレット氏は、「blog」の命名に貢献したといわれるピーター・メイホールズ氏と共に創設メンバーであり、共同経営者。

■関連URL

以上、よろしくお願いします。

Written by bookslope

8月 17th, 2009 at 8:38 am

Posted in Info,Study

Tagged with , ,

UX London

without comments

UX London

IA Summit 2009およびUIE Web app Summitに引き続いてまた海外でUX系のイベントです。

6月15日〜17日まで、カンバーランド (ロンドン) で「UX London」が開催されます。
IA Summit 2009で配られていたチラシでも見ていたので非常に気になってはいたのですが、すでに売り切れの模様……。

写真はFlickrで「uxlondon」で見れます。

それはそうと、海外でのイベントのスピーカーはどこに行ってもほとんど同じですね……。以下がUX Londonのスピーカーですが、やはりIA Summit 2009でも講演されていた方が多数います。個人的にはまだ聴けていないLuke Wroblewski氏の講演に一度参加したいと思ってはいるのですが、なかなかその機会がありませんね。

UX London

Speakers

それにしてもこのサイト非常にキレイですね。「Silverback」で有名になったClearleft社の協力のようです。Clearleft社ということはAndy氏が代表を務める会社ですが、この会社のサイトもやっぱりキレイです。

しかし、「UX」という冠がつくことがひっかかりますね。IA Summit 2009でJesse James Garrett氏が話された「The Memphis Plenary」の一文に影響を受けてのことですが、「UX」という冠にしてしまうとすべてが包含されてしまうので、これからはすべて「UX」がつくのかと考えさせられてしまいます。

Written by bookslope

5月 1st, 2009 at 1:46 am

Posted in Info

Tagged with ,

UIE Web App Summit 2009

without comments

UIE Web App Summit 2009

UIE Web App Summit 2009

iA SUMMIT 2008でKeynoteスピーチ「Journey to the Center of Design」をされ、IA SUMMIT 2009でも「Revealing Design Treasures from the Amazon」で講演されたJared M. Spool氏が務めるUIEが冠につく「UIE Web App Summit 2009」が、4/19〜4/22までニューポートビーチ (カリフォルニア) で開催されていました。

Jared M. Spool氏といえば、UserInterfaceEngineering社の社長としても有名ですが、一度は目にしたことのあるユーザビリティの良書「Webサイトユーザビリティ入門」の著者としても広く知られています。このSpool氏もPodcastをしているUIEの「SpoolCast」も著名な方との対談など不定期ですが更新されているので、興味ある方は一度聴いてみてはと思います。

UIE Web App Summit 2009についてもプレビュー (イントロダクション) が公開されていました。

さて、この「UIE Web App Summit 2009」ですが、ワークショップ形式による構成で以下のようなプログラム内容 (スピーカー) でした。IAサミット09のスピーカーとも被る方がいますね。

ちなみに、これらすべてのワークショップのPodcastが公開されている点はすごい。

ワークショップなので (それが理由かは知りませんが)、Slidashareにはあがっていませんでした。講演とは違いワークショップ形式の場合には実際の雰囲気や空気などが伝わるビデオや音声のほうがいいのかも知れませんね。Flickrでは「webappsummit」で見ることができました。

UIE Web App Summit 2009

Written by bookslope

4月 29th, 2009 at 11:10 am

Posted in Info

Tagged with , ,

loftwork college: プロジェクトデザインから見るIA

without comments

プロジェクトデザインから見るIA (坂本貴史)

少し前 (2/24) になりますが、ロフトワークの「loftwork college」でWebディレクションをされている方対象に、IAについてお話をさせていただきました。場所は「loftwork Ground」というスペースでした。

ロフトワークといえば、PMBOKをベースにした「Webプロジェクトマネジメント標準」の著書である林さんが社長をつとめている会社ですが、その林さんとその友人である浅野さんから今回の話をいただきました。話の内容は、それより前にSINAPさんでお話させていただいた、いわゆるWeb構築時におけるIA的視点のお話をしました。

いつも話のはじめに出すのは「The Elements of User Experience」と「The Nine Pollars」です。そして成果物の話に進める上で「IA One Sheetes」を引き合いに出します。

成果物については、主に下記3つを取り上げて、その作成における注意点や心得のようなものをお話ししました。

  • ワイヤーフレーム (レイアウトとパターン)
  • サイトストラクチャ (情報構造とフローの違い)
  • ユーザーエクスペリエンスフロー (メンタルモデルからサイト要件)

最後に、IAの定義とスキルについて参考文献を用いてお話ししました。
インフォメーションアーキテクトの定義としては、リチャード・ワーマン氏が1996年ごろにまとめた下記があります。

インフォメーションアーキテクツの定義

  • 複雑なデータの固有のパターンをまとめ、内容を明確にする人
  • 第三者が情報を得るための道筋を自分で見つけられるように、情報の構造を示す地図を作成する人
  • 誰でも理解しやすように情報を提供し、それらをまとめる人

また、コアスキルとしては、「Web検定本 デザイン編 (ワークスコーポレーション)」 にある下記を引用しました。

IAのコアスキル

  • デザイン実行力とデザインマネージメント力
  • リーダーシップとプロジェクトマネジメント力
  • ユーザー調査と分析力
  • 顧客とのコミュニケーション能力と調整力

参加者の多くはWebディレクションをされている方でした。とくに、自分でもワイヤーフレームを作成するといった設計パートを担当している方やビジュアルデザイン業務は外部のパートナーに指示するという役割をする方が多かったようです。

ベテラン層と若手が入り交じった参加者でしたので、どこまで期待に応えられたかはわかりませんが、その後の懇親会では、実際の業務を踏まえての具体的な勉強会や成果物を集めてディスカッションができれば、さらにIA的視点や論理的思考が身につく機会が得られるのではないかと、非常に前向きは意見をいただくことができました。

いわゆるWeb制作会社さんにおける勉強会のニーズまたはワークショップなどは今後も積極的に取り組んでいければと思います。

Written by bookslope

4月 21st, 2009 at 12:52 pm

Posted in Study

Tagged with ,