基本概念
基本要素：ページ、ファイル、そしてそれらの集まり
関係性の記述：コネクターと矢印
すべてを一度に：並列セット
一時中断：連続ポイント
共通要素：エリアと反復エリア
再利用可能な要素：フローエリアと参照
条件要素の基本概念
選択せよ：意志決定点
探検者(パスの誘導)：条件的なコネクターと矢印
複数の選択：条件的な分岐
一つか複数か：条件的な選択肢
一つの決定、複数のパス：クラスター
制約条件あり：条件的なエリア
結論
ダウンロード可能なパーツライブラリ

--------------------------------------------------------------------------------

サマリー
ダイアグラムはウェブ開発チーム内で情報アーキテクチャやインタラクションデザインについて話をする際に必須のツールである。 このドキュメントでは、それらのダイアグラム生成の理由について議論を行い、情報アーキテクチャやインタラクションデザインコンセプト作図のための基本的記号体系、そしてそれらの要素を使うためのガイドラインについて述べる。

「直感的理解のために、情報は如何なるかたちを取り得るか」が基本的なテーマです。人間がどのように実世界と情報世界を理解しているのか、認知の仕組みにアプローチしながらデザイン要素と伝わる意味の関係を考察しています。急速に変化していくデジタルメディアの領域においても普遍性を持つ、むしろ逆に強調されて浮かび上がってくるその原理と方法について、理論、制作、教育の三方向から研究に取り組んでいます。

■現在の関心領域

1：認知言語学を援用した視覚言語の構造分析、およびそれを応用したデザイン手法について

2：HII（Human Information Interaction)　より自然な情報環境と人間の対話のためのデザインについて

3：思考プロセスを重視した情報メディア教育について

■ 過去の発表等

「+pluslist:ショップ間を跨いだ買い物支援クリッピングツールの試作」
大谷/向田/森嶋/加藤/横瀬/水谷/上平（ポスター発表　インタラクション2008 2008.3）
「デジタルコンテンツと連動する実世界構造モデル制作で学ぶ情報デザイン－意味とかたちの対応付けに着目して－」
上平崇仁（ポスター発表　日本認知科学会 第23回大会 2006.8）
「ヒューマン・インターフェイスにおける認知的基盤」
上平崇仁（解説論文　専修ネットワーク＆インフォメーション第8号 2005.12）
「Webデザインにおける制作プロセスの変容と創造性の行方」
-ソフトウェアによる支援と代行の狭間で「つくること」はどうかわるのか？-
上平崇仁（解説論文　芸術科学会論文誌Vol4.No3 2005.9）
「Recollection:色で記憶を繋ぐ探索型デジタルアルバム」
前川洋二・上平崇仁（ポスター発表　インタラクション2005 2005.2）
「ヴィジュアルコミュニケーションの学びを通したメタ認知支援に関する考察」
-情報メディア教育における基礎の視点から-
上平崇仁（論文　芸術世界　東京工芸大学芸術学部紀要, 2004.4）
「オムニバス映像制作における多様な関係性を考慮した学びの設計」
上平崇仁（論文　芸術世界　東京工芸大学芸術学部紀要,2003.4）
「A Step inside WebWorld -Webワールドのすべて-」
Chapter6 : コミュニケーションツールとしてのWeb
佐藤嗣、上平崇仁他　（共著　株式会社クレオ，2003.1）
「キャラクターステッカーで交流を広げる絵本作りワークショップ」
上平崇仁・笠尾敦司（口頭発表　日本デザイン学会2001）
「学外とのコミュニケーションを主眼においた情報デザイン演習の試み」
上平崇仁・笠尾敦司（ポスター発表　日本デザイン学会2000）
■ 学内研究所発表

「教育成果公開に向けた展示会プランニング」
上平崇仁、香山瑞恵、小林隆、綿貫理明（報告資料　専修大学情報科学研究所所報　 2007.3）
「情報メディアにおけるもう一つの双方向性　－人とコンピュータの境界線の葛藤－」
上平崇仁（口頭発表　専修大学情報科学研究所研究会　2006.6）
「産学連携によるICタグを用いた教材開発と演習実践」
上平崇仁 、香山瑞恵、江原淳 （報告資料　専修大学情報科学研究所所報　 2006.3）
「情報メディアの進化とコミュニケーションデザイン」
上平崇仁（口頭発表　専修大学情報科学研究所研究会　2004.11）
■ 共同研究

Jリーグチームにおける経営戦略としての映像利用の可能性
丸井/上平/飯田 　日本フットボール学会4th Congress（2008.3）
ユビキタス環境技術を用いた超越体験メディアの開発
村上/黒川/井村/植原/上平 他　2007年度第2期未踏ソフトウェア開発事業（2007.8～2008.2）
高等学校情報科における科学的ミニマムエッセンシャルズのための教育プログラムの開発
加納/川村/山口/香山/上平 他　文部科学省委託事業　（2007.3）
子どもの安全に関する情報の効果的な共有システムの調査研究
香山/佐藤/飯田/二上/上平 　科研費基盤B（2007.4~）
ウェブマガジンにおける過去記事のファインダビリティを高めるためのユーザ・インタフェースの検討
専修大学上平研究室＋アイティメディア（2007.6~8）
テーブル型ディスプレイシステムを介したインタラクション・デザインに関する基礎的研究
専修大学上平研究室＋株式会社内田洋行（2006.4～2006.8）

「コンセントラボ」はコンセントの研究、開発、その他の情報を蓄積し、公開するための場です。

IA Summit 08 報告会 発表資料
2008年6月13日に開催されたIA Summit 2008報告会の報告資料です。

佐藤大輔（ソニー株式会社）【PDF】
圓城寺人史【PDF】
長谷川敦士【PDF】
IAAJ エントリへ
IAI Creative Brief（クリエイティブブリーフ）
プロジェクトがスタートする前に、ユーザー要件、ビジネス要件をまとめるための資料です。
米IA Instituteが提供しているものをコンセントで翻訳、カスタマイズしています。

IA Institute: Creative Brief Template（日本語版）【MS Word】
IA Institute: Creative Brief Template（IA Instituteへのリンク）
Visual Vocabulary
インタラクション、画面フローを記述するためのルールです。
OmniGraffle等のソフトに標準ステンシルとして用意されています。
Jesse James Gareteが作成したものを、コンセントで翻訳しました。

jjg.net: a visual vocabulary（日本語版）
jjg.net: a visual vocabulary（オリジナル版）
サイトストラクチャブレストツール
サイトストラクチャ、ユーザー経験フローを検討するためにつかう、テンプレートです。活用マニュアルとセットで使ってください。

Comming Soon（お問い合わせください）
７つのナビゲーション
一般的なウェブサイト内のナビゲーションを７つに類型化しました。
これらのナビゲーションの役目をそれぞれ定義することで、サイトの中で一貫性があるナビゲーションルールを定義することができます。
この内容は2006年のIAサミット、2002年のヒューマンインターフェイス学会で紹介されました。

The 7 Navigation Types of Web Site(英語）
ターゲットにするユーザーのまとめから、要求事項を明示化するためのワーキングテンプレートです。

Comming Soon（お問い合わせください）
ユーザーモデル分析ツール
ターゲットにするユーザーのまとめから、要求事項を明示化するためのワーキングテンプレートです。

Comming Soon（お問い合わせください）
Seattle Public Library Research Report
武蔵野プロジェクト（武蔵野市の図書館設立プロジェクト)のために行った、シアトル中央図書館の調査レポートです。

Seattle Public Library Research Report（日本語版）【PDF】
IAAJ: 情報アーキテクチャアソシエーションジャパン
IAAJは日本の情報アーキテクトや情報アーキテクチャ設計に携わる人たちの情報交換や研究の場です。定期的に開催されるワークショップやメーリングリストなどで情報アーキテクチャとはなにかについて考えていきます。

IAAJ: 情報アーキテクチャアソシエーションジャパン（Information Architecture Association Japan）
Yahoo!グループ：情報アーキテクチャアソシエーションジャパン

サイトを作ったら試してみたいのがFive Second Testだ。

このサイトではあなたが作ったサイトのスクリーンショットをアップするだけで、簡単なUIに関するテストを作ることができる。

テストを受ける人はアップされた画像を5秒間だけ見せられて、そのあとに何を覚えていたかを書かされる、という仕組みだ。

このテストを実施することで、あなたのデザインで何が印象に残るか、もしくは残らないかを知ることができるのだ。

自分が意図したとおりにユーザーに情報が伝わっているか、きちんと確かめるのは大事だ。こうしたテストはお手軽でいいかもしれないですな。

私は1ヶ月前に引越しをしたのですが、引越しをするといろいろと手続きが必要になります。
証券会社に口座を開いて取引をしているならば、住所変更の手続きもしないとなりません。私みたいに11社(下の表にある10社+野村證券)にも口座開いてると大変です！
まあ情報収集などの為などの口座開設で、実際に取引をおこなっていない所は住所変更しなくても困んないじゃないかなとも思いましたが、せっかくなんで全部いっぺんに住所変更の手続きをしてサービスを比較してみました。
(以下の内容は、引越しする人、する可能性の有る人向きの記事なので、関係ない人は読み飛ばしてください。)

比較の前に、住所変更について
まず常識的な事ですが、引越しをする際は郵便局に郵便物の転居届けを出しましょう。そうする事で1年間は、旧住所宛てに送られた郵便物は転送されて新住所に送られてきます。
証券会社からの郵便物、株を保有している企業からの決算報告書や配当金の郵便為替などの郵便物も、新しい住所に転送してくれます。なので引越しで忙しければ郵便局の転居届けだけは出しとけば、証券会社への手続きは後回しでもなんとかなります。

また、株を保有している企業への住所変更についてですが。基本的に権利落ちの時に証券会社に届けている住所のデータが、企業にいくようです。(←ほふりの場合。ネット証券を利用の場合は通常ほふりだと思います)

ですので、権利落ち前に証券会社への住所変更手続きを済ませておけばOKです。
もうすでに権利落ちしている分、権利落ちまでに住所変更の手続きが間に合わない場合は、旧住所へ決算報告書や配当金の郵便為替などの郵便物が送られるかたちになります。郵便局へ転居届けをだしていれば、新住所へ転送されてきます。

。

jQueryでかっこいいUIを実装したい。

そんなときにおすすめなのが、『10 useful jQuery plugins』。jQueryの便利なプラグイン10選だ。

以下にご紹介。

・jQuery UI
Webアプリをデスクトップアプリのように動作させる。タブメニューやスプリットペイン、ドラッグできるフォトマネジャーなど

・Mark-It-Up
テキストエリアをマークアップエディタに変えてくれる

・jQuery cookie plugin
クッキーを簡単にセット、削除できる

・lightbox for jQuery
jQuery用のlightbox

・jQuery Corner Plugin
jQueryで角丸を作成

・jTip
クールなツールチッププラグイン

・LavaLamp
CSSメニューにスムーズなスライドエフェクトを追加

・Superfish
jQueryのアニメーションを使ったアクセシビリティの高いメニュー

・jQuery easing plugin
jQueryによるアニメーションのイージング

・jCarousel
jQueryによるcarousel（スライドする画像ギャラリー）

それぞれデモがついていてわかりやすい。

デモは↓から。

» 10 useful jQuery plugins

jQueryの便利なプラグイン、チェックしてぜひ使ってみてはいかがだろうか

これはデザイナーのみならず導入必須のソフトウェアと言えそうだ。

Webサイトを作る際には、モックアップが必要になる。それをベースにして「ここをこうしよう」「次はどこに遷移させよう」といった議論が可能になる。頭の中だけではイメージがはっきりせず、意見も出しづらい。

ドラッグアンドドロップでモックアップを作成できる

そんなモックアップを作成しようと思ったら、紙やHTMLオーソライズソフトウェア、画像編集ソフトウェアを使うことが多かった。だが画像編集ソフトウェアではチェックボックスやテキストボックスが作りづらい、HTMLオーソライズソフトウェアではデザインの微調整が面倒、紙では重ね書きしづらい…とそれぞれに欠点があった。そこでこれを導入してみよう。

今回紹介するオープンソース・ソフトウェアはPencil、Firefoxアドオンとして動作するモックアップ作成ソフトウェアだ。

個人的にはモックアップの作成にBalsamiq Mockupsを使っている。これは手書き風のポップな画面を作るのにはぴったりだ。そしてPencilはちょっと正確な画面を作るのに適している。何よりオープンソースであり、無償だ（Balsamiq Mockupsは有償）。

電脳狂想曲　レイアウトの小技
戻る
レイアウトの小技　Ver2.0
横幅：
縦幅：

白銀比 黄金比 白金比・第二黄金比について 横幅を元に計算する（縦幅無視）
縦幅を元に計算する（横幅無視）
縦幅と横幅を元に計算する
（縦幅、横幅はそれぞれ指定比率で分割されるが、
分割された四角形の縦と横の比率は計算した比率にならない）
図形を表示 再分割を表示

Web サイトのレイアウトを考えたり写真や画像をトリミングする時、意識して縦横比を統一すると全体のバランスがよくなります。そんな時に、覚えておくとちょっと便利なバランスのよい「縦横比」と「国際標準バナーサイズ」を紹介します。