WebSig24/7公式ブログあなたと社会とWebのためのオープンなコミュニティ

WebSig24/7(ウェブシグ・トゥウェンティーフォー・セブン)は、ウェブサイトに関連するマーケットの健全な発展を促し、
人々の生活を豊かにすることを目的とした任意団体です。

第24回WebSig会議「100人で考える、理想的なサイトマップの形と標準書式」 グループワークで作成したサイトマップ公開

  • posted on 2009.09.05 23:34
  • 0 trackbacks

代表の和田です。

お待たせしました。
グループワークで皆さんに作成頂いたサイトマップを公開です。

第1部資料とグループワークで利用した課題はこちら
第24回WebSig会議「100人で考える、理想的なサイトマップの形と標準書式」 終了いたしました

■チーム1
○課題1
01-1.gif

○課題2
01-2.gif

01-3.gif

○PDF
チーム1PDF

課題1では、東京ナイロンガールがライターという複数の方々が記事を書くと言うところに着目し、ライターアイコンが出てきているところが特徴的ですね。

課題2では、「地図ポイントクリック」というアクションが記されています。※での注意書きも付記されています。


■チーム2
○課題1
02-2.gif

○課題2
02-3.gif

○PDF
チーム2PDF

課題1では、付箋を用いて色分けしています。実際でも色分けという情報分類表記は一つの手段ではありますね。INDEXという所では、ページ構造にも繋がるようなところが表現されています。

課題2では、ジャンル、季節毎に記事属性を列挙してくくることでファセット分類を表現しています。操作ガイドは、全ページ共通という表記で抜き出して表現しています。

■チーム3
○課題1
03-1.gif

○課題2
03-2.gif

○PDF
チーム3PDF

課題1では、ヘッダーとフッターの表記が特徴的です。各コンテンツ内の横矢印で更に導線と階層を表現しています。特徴的であるが故にもう少し凡例も欲しいところでしょうか。

課題2では、マルチという表現でファセットを表現しています。記事はデータベース的な表現でしょうか。

■チーム4
○課題1
04-2.gif

○課題2
04-3.gif

○PDF
チーム4PDF

課題1では、グローバルナビやフッターナビ項目を囲みで表現しつつ各ページにはファイルパスも表記されています。更新頻度も表記されています。検索部分もありますね。

課題2では、凡例に工夫が見られます。会議ではステンシルという表現をしましたが、ビジュアルボキャブラリー(注)ともいうようです。(知りませんでした)ここは標準化の意義がありそうなところです。
トップページはワイヤーフレーム的な表現になっていますね。ファセットに関してはジャンルに寄せて表記しています。

(注)jjg.net: a visual vocabulary(日本語版)
http://www.concentinc.jp/ia/visvocab/


■チーム5
○課題1
05-2.gif

○PDF
チーム5PDF

比較的スタンダードな形でしょうか。メイン、サブ、フォームを色分けしつつ、重要なリンクを表現しています。

■チーム6
○ステンシル
06-2.gif

○課題1
06-3.gif

○課題2
06-1.gif

○PDF
チーム6PDF

チーム6はデジタルデータで作って頂きました。ステンシルをまとめてからの作業というのは書式の課題に取り組む上で効果的だったと思います。メモに残して頂いた方針も興味深いです。
「注目すべき動線情報のみ矢印で別に表現」というのは、なんでも表現したくなる欲求を抑えつつ、ファイルリストとの区別を付ける指針としてもよいポイントだと思います。

課題1では、読み物、解説系、お問い合わせという3つの情報分類に分けています。コンテンツ分類を俯瞰的にみるには効果的そうです。ファイルリストやワイヤーフレームと引き継ぐページIDも重要ですね。

課題2では、「RIAも静的サイトの表現とできるだけ似せた方が良い」という方針のもと展開していっています。ファセット部分はジャンルと季節で別に表現しています。間では条件抽出機能という機能表現もされています。

■チーム7
○課題1
07-3.gif

07-2.gif

○課題2
07-1.gif

○PDF
チーム7PDF

課題1では、細かな凡例を書いてもらっています。クライアント、開発陣で共通理解に出来そうです。凡例はチーム4のコメントでも書きましたが、ビジュアルボキャブラリーなど、業界で標準化していきたいですね。サイト内付加機能があるのが特徴的でしょうか。

課題2では、システム設計のイメージに近い図になっています。DB的に表現されているモノからページが生成されているようなイメージでしょうか。

■チーム8
○要素
08-2.gif

○課題1
08-3.gif

○補足条件・印刷
08-1.gif

○PDF
チーム8PDF

チーム8は、課題としてあげた、何を表現すべきか?ということをまずまとめてもらいました。
・全ページを網羅する
・ページタイトル
・ファイル名
・テンプレートID
・階層
・凡例
-動的/静的
-リーフ(記事)
-メインコンテンツ/サブコンテンツ
・カテゴリごとに区分ける(色などで)
・タイプ(HTML/PDF/なし)
ちょっと、方針も入っていますが、仮説ではありますが、誰に何をどうやって伝えるかを想像しやすくなります。

課題1では、上記を途中までですが、展開していく例が見て取れます。だいぶ情報量的には増えて来ますね。補足条件でまとめて頂いたように、ドキュメントの目的を明確にしつつ、1つのドキュメントだけで解決しようとしないのも重要ですね。一方、ここはサイト規模や管理の問題がディスカッションでも盛り上がったようにポイントとなり、バランスの取りどころだと思います。
ハイレベルサイトマップを用意するのは印刷の一助にもなりますね。

■チーム9
○課題1
09-2.gif

○課題2
09-1.gif

○PDF
チーム9PDF

チーム9も表現すべき要素を箇条書きに残して頂きました。
・ID、枝番
・静的、動的要素
・別ウィンドウ表現要素
・グルーピング要素
・単一、複数要素
・主要導線(LPO)
・ナビ画面
・INPUT/OUTPUT要素
・エラー処理系画面
・ファイル名

また、追加検討要素として、
・RSS
・広告ページ
・サイト内検索
・サーバーエラー
・管理画面
もあげてもらっています。

事前に配った資料に「加えて」ということで考えてもらいました。
凡例も参考になるのではないでしょうか。

印刷対策では、説明する部分(詳細要素)を切り出し別紙にまとめるという意見をもらいました。
手間にはなるかもしれませんが、目的を考えると理にかなっているところですね。

課題2では、記事がもっているデータを整理してカテゴリは別に表現しています。今回は、サイトで予め決められた属性でカテゴライズされていましたが、ユーザーが自由にタグ付け出来る場合などは、この方法に近い形になるのかもしれません。

第1部でも少しお話し頂いた坂本さんが感想と有益な情報を掲載してくれているので是非あわせてご覧ください。
理想的なサイトマップの形と標準書式 at bookslope blog
http://www.bookslope.jp/blog/2009/09/websig20090829.html

また、今回は前提でしか扱わなかったワイヤーフレームについても興味深いエントリーがあるのであわせてご覧頂くと洞察が深まると思います。
ワイヤーフレームコミュニケーション研究会 at bookslope blog
http://www.bookslope.jp/blog/2009/09/wireframecomwg.html

是非皆さんもコメント、トラックバックお待ちしています!
ビジュアルボキャブラリーをまとめてみるなんていうのも有益だと思うのですがどうでしょう?

  • category: WebSig会議, 第24回

コメント

トラックバック

トラックバックURL: http://websig247.jp/mt/mt-tb.cgi/153

最近のエントリー

  • 3月3日 第29回WebSig会議『効率化だけではない!中小~中堅ECサイトの成果を上げる「メディア編集力」とは』受付開始!
  • 第28回WebSig会議「2012年に向けたWeb受託企業の戦略」が盛況の後終了しました
  • 12月3日(土)開催 第28回WebSig会議「2012年に向けたWeb受託企業の戦略」受け付け開始
  • 2011年WebSig忘年会・交流会(交流会から参加OK)
  • WebSig1日学校2011 本サイトリリース、9月10日(土)開校

過去のエントリー

【PR】WebSig24/7の本

インターネット&Webの必須常識100の書影

WebSig24/7とは?

  • WebSig24/7 設立趣意
  • 運営スタッフ(モデレーター)紹介
  • よく寄せられるご質問と回答
  • お問い合せ先
  • WebSig24/7リンク用バナーキット
  • 協賛企業

WebSigイベント最新情報

【申し込み受付中】
第29回WebSig会議『効率化だけではない!中小~中堅ECサイトの成果を上げる「メディア編集力」とは』は3月3日(土)開催です。

お申込サイトへ

WebSig24/7メルマガ

イベントアップデート情報、WebSig24/7の活動情報をメールにてご連絡いたしております。

メールアドレス
お名前

メールアドレス変更、登録解除はこちらからお願いします。

ソーシャルメディア

  • WebSig24/7 Facebooページ
    ページ下部にいいね!ボタンもあります。
  • WebSig1日学校 Facebooページ
    年に1度のスペシャルイベントです。
  • Twitter
    ハッシュタグは#websigです。
  • slideshare
    過去の資料をUPしています。
  • YouTube
    WebSig会議の動画を公開しています。
  • mixiコミュニティ
    6,000人以上にご参加頂いています。
WebSig1日学校2011:WebSig24/7のサーバサイドエンジニア、フロントエンドエンジニア、デザイナー、ディレクター/プロデューサー、Web担当者向け1日学校(セミナー)

WebSig1日学校2011は終了いたしました。
沢山のご来場ありがとうござました。

WebSigイベントバックナンバー

  • 第27回「来るべきスマホ時代のコミュニケーションデザイン~技術とコミュニケーションデザインの両側面から」
  • 【スペシャルイベント】WebSig1日学校2011
  • 第26回「ワールドバー」
  • 第25回「エコだけじゃない!『ネットを使って社会をよくする』新潮流とWeb屋の関係」
  • 第24回「100人で考える、理想的なサイトマップの形と標準書式」
  • 第23回「ストレスフリーのWebプロジェクト ~Web担当者に出来ること、制作会社に望むこと~」
  • 第22回「Survive! 不況に流されないWeb屋の生き残り方~真似できない個性と付加価値を作り出す」
  • 第21回「Web業界の2008年の振り返り、2009年を考える」
  • 全て

カテゴリー

  • B2Bサイト研究会
  • WebSig24/7 NEWS
  • WebSig24/7について
  • WebSig会議
  • Webライティング・エディトリアル勉強会
  • アクセシビリティJIS:2010を1000人で読もう
  • サイトマップ標準化プロジェクト
  • サイトマップ+ワイヤフレーム標準化プロジェクト
  • パーティ・イベント
  • プレスリリース
  • メディア掲載実績
  • リアルWebSig塾
  • 分科会
  • 大阪イベント

イベントカレンダー

カレンダーを表示(XML / iCal)

イベント開催情報をメールでお送りします。

WebSig24/7 分科会

ecopi-banner.gif

クリエイティブ・コモンズ・ライセンス

© WebSig24/7

Powered by Movable Type