上手くいく！ みんなでつくるウェブサイト

経験からたどりついた「共創（Co-Creation）」というつくり方活動の中で、私たちが最も大切にしているのが「共創（Co-Creation）」のスタンスです。
単に「提案依頼書（Request for Proposal ＝ RFP）」を受けてのモノづくりではなく、発注以前のコンセプトに関わる部分で、共に課題を整理し、お客様自身が「本当につくりたいものは何か」を見つけるための「プロセス」の提供を行っています。
情報メディアを生み出す発注者と制作者の全てが納得し、できあがったメディアを使う一般のみなさんにも喜んでいただける、そんな理想のカタチを実現するにはどうしたら良いのでしょう。
「共創（Co-Creation）」のスタンスは、その問いに対して私たちが過去の経験からたどり着いた、ひとつの有こんにちは。

効な解なのです。

Co-Creation

アライアンス・ポートです
私たちは、東京を拠点に日本各地のお客様のウェブサイトや SNS、電子書籍、紙媒体など多様な情報メディアをデザインし、開発しています。これまでミュージア
ムを中心に、主に文化事業のための情報メディアづくりをお手伝いしてきました。
アライアンス・ポートの名は、世界をつなぐハブ空港や情報ネットワークのポートのように、人や情報が集いつながりあうところを目指したものです。柔軟なデザイン力と幅広い IT 技術力を自負するデザイナやエンジニアが共同作業をしながら、日々、様々なプロジェクトに取り組んでいます。

み ん な が 満 足 するつくり方のノウハウをご紹介します
この冊子は、私たちが「共創（Co-Creation）」のスタン「共創（Co-Creation）」のノウハウは、次のようなウェブサイトを運営するお客様に特におすすめです。

スで成果をあげた、つくり方のキーポイントをご紹介す2

3るものです。
情報メディアには様々な種類がありますが、●美術館、科学館、公共文化施設のサイト

今回は、特に規模が大きくプロセスが複雑になりやすい●コーポレートサイト「ウェブサイト」を例にあげます。

●ニュースサイト

関わる方全員が最後に笑顔になるウェブサイトづくりを●コミュニティサイト

目指して、みなさんの職場でも、この冊子をぜひお役立●公益事業、地域や文化振興事業のサイトてください。

●大学、教育機関、研究機関のサイト

コンセプトを共にデザインする。
その大切さに気づいたときから、新たなウェブづくりが始まりました

課題は専門性とコンセンサス個々人の中にある「カタチ」を表す工夫

的確な RFPがつくれない原因は、主に 2 つあると考えられます。

そこで私たちは、できあがった RFP をただ待つのではなく、ひとつは、ウェブサイトに関する専門性が不十分であること。

お客様がまとめきれない与件の整理をお手伝いすることを始めスマートフォンの普及や、Twitter、Facebook の人気などによました。しかし、私たちよそ者にできることは限られています。

り、個人のインターネット接続時間は以前より大幅に長くなり、そこで 3 つのことを実践しました。

ウェブサイトへの期待も増しました。ウェブサイトは企業や組

ひとつめは、お客様をよく知ること。組織の理念やミッション織の情報の発信拠点であり、顧客とのコンタクトポイントであを深く理解し一体になろうと努めます。ふたつめは、組織内でり、ブランドそのものでもあります。RFP の作成にあたってできるだけ多くの参加者を巻き込む「場」をつくること。共に「答は、まず、ウェブサイトで顧客や社会とどのようなコミュニケーえ」を見出すプロセスに少しでも多くの人に参加いただくことションを築くのかを考え、目的や目標を明確にし、さらに技術で、プロジェクトへの関心と当事者意識を持っていただくのでや環境の数年先を予測しながら提供する情報を整理し、ソーす。3 つめは、解決のアイデアを推進すること。解決の糸口はシャルメディアとの関係性や管理方法を考えてシステム要件化

必ずお客様の中に眠っています。そのきっかけをお客様自身がする必要があり、それは本当に難しいことです。

つかんだら、それを具現化するのに必要な情報は、プロの視点失敗から学んだこともうひとつの原因は、お客様の組織内部での相互理解が不十分から惜しみなく提供します。納期、予算、情報セキュリティとであること。世の中でウェブサイトの重要性が高まるにつれ、いったクリティカルな課題に対してもアドバイスをし、議論の「共創（Co-Creation）」のきっかけは、たくさんの失敗でした。

組織内のウェブに関わる部署は多様化しました。経営層から現ガードレールのような役割を果たします。

開発の現場で、RFP（提案依頼書）に沿って制作を始めたとた

場担当者まで多方面の意見を集約し、様々な要望に優先順位をん座礁してしまうケースを、たびたび経験したのです。RFPつけながら「組織の総意」をつくり、デジタルメディアの知識とは、一般的に、サイトの定義、目的、目標、ゴール、技術要件、とあわせて仕様書や RFP にまとめあげる作業は、容易ではあ業務範囲、納期などの事項がまとめられた、要件や条件の定義りません。そしてコンセンサスが不十分であるがゆえに、要件書です。しかし、どんなに咀嚼してもお客様の意図が読みとれ定義が曖昧になってしまう状況があるのです。

ないものがあるのです。例えば、「目的やゴール」が総花的で、すべてを実現しようとすると予算をはるかにオーバーしてしまお客様自身が冷静な目で「自分たちのウェブサイトはこれだ！」と確信が持てるまで、ファシリテーション的なアプローチで私たちはおつきあいをし、最後に全体をまとめ、RFP や提案書、マスタープランへと磨き上げます。もちろん、その後のデザインやシステム開発においても、常にお客様が主役です。
以上のような一連のプロセスを、私たちは「共創（Co-Creation）

うケース、「技術要件の管理システム」がどう動いてほしいのプログラム」と名づけ、この方法で日本各地の企業、公共施設、か曖昧なケース、「ソーシャルメディアの活用」とだけ掲げられ、美術館、博物館、大学・教育機関・研究機関のウェブサイトの利用目的や運用方針が見えないケースなど。その場合、制作者コンセプトデザインを手がけてきました。次頁からは、その体は困惑し、提案の精度を高めることができず、結果、お客様の験にもとづく実践的な方法をご紹介します。

イメージとズレたものができあがり、お叱りを受けることさえあります。

次ページから、「共創（Co-Creation）」の具体的なノウハウをご紹介しましょう。
方法は簡単。 3 つの問いに答え、まとめていくだけです4

5

共創（Co-Creation）のノウハウ 1「何を伝えたいのか」を整理する

STEP2

重複や類似する情報をまとめる
重複した意見は、多くの人の関心の表れ。しかし、たったひとつの意見にも、なにか大事な情報がひそんでいるのかも。

ウェブサイトは情報の固まりです。ウェブサイトを企画する際、ついつい「あの情報も、この情報も」と考えがちですが、発信者の思いが強すぎて情報が利用者にうまく届かないことも。

進め方

ここではいったん利用者の立場になって考えてみましょう。

1. 全員が眺められるようにポストイットの向きを整えましょう。

まずはこんな問いを立てて、考えてみましょう。

2. 神経衰弱やカルタの要領で、同じ答えを探し、重ねます。
3. 重複が多い情報と少ない情報について、みんなで話し合いましょう。

問１

ある人があなたの会社のウェブサイトを見ています。
何を見に来たのでしょうか？

大事なポイントが見えてきます。
意見が同じか違うか微妙なときは、どうするの？
例えば、「新着情報」と「お知らせ」は似て非なるもの。
同じかどうか迷ったときは、何を思って書いたのかを聞いてみると、判断しやすくなります。

従来型の少人数による会議形式ではなく、できるだけ大人数で、短時間で考えます。結論に向けた考えをひねり出すというより、頭に浮かぶものを素直に出すイメージで。プロセスを楽しみ、リラックスして行いましょう。

STEP3

3 分間で約 60 枚に絞りこまれました。

グループ化した情報にキーワードをつける
ウェブサイトを見に来た人の目的が、「キーワード」 となって見える化されます。

進め方
1. 進行役のひとりは、参加者に質問したりしながら、情報をグループSTEP1化していきます。

欲しい情報を見える化する

2. グループにつける名前（キーワード）を、全員で考えます。

みんなの頭の中の回答を、一気に見える化しましょう。とにかくたくさん！ 時間は 3 分！

3. もうひとりの進行役は、キーワードをポストイットに書いて、置いていきます。

用意するもの：いまいち参加者の筆が進まないときは、どうするの？

ポストイット／太めのサインペン（遠くからでも見やすい文字が書けます。また、細考えこんでしまう人は必ずいます。
「 ◯◯さんはどういうときにウェブを見ます

4. ひととおりグループ化できたら、全員で俯瞰してみましょう。

かく書けないので回答がシンプルになります）／ホワイトボード（あれば）か？」と、雑談に引き込むようにしてみましょう。

5. 各グループについて意見を出し合いましょう。利用者にとってのニーズの大小や、グループ同士の関係性が見えてきます。

進め方「伝えたいこと」をどんな言葉で表現するかは人それぞれ。
それらをグループに束ねるキーワードをつけましょう。

分類のし方について意見がまとまらないときは、どうするの？

1. ポストイットに答えを書いて、机の上に置きます。

無理にひとつの分類方法に絞らず、写真を撮って記録に残し、次に別の分類方法で

2. 答えは、ワンフレーズでシンプルに。できれば利用者の言葉で。例

グループ化を行ってみると良いでしょう。

えば、「交通アクセス」より、「最寄り駅は？」や「駐車場はある？」のほうが利用者に近い言葉といえます。
3. 考えすぎずに書きましょう。
「この表現は伝わらない？」「さっき書いたのと同じかも？」は禁物。頭の中で整理しなくても大丈夫。

まとめ

4. スピード重視でたくさん書きましょう。きたない字でも、漢字を忘

ウェブサイトに求められる情報や、情報同士の関係性、優先順位などが、れたらひらがなでも気にせずに。
5. 時間を測りましょう。
「時間が足りない！」と文句が出るくらいが良いでしょう。心残りがあっても、いったん打ち切りましょう。

目に見える「カタチ」になりました。コンテンツが含むべき情報の諸テーブルを囲むように座るとよいでしょう。

要素を、気がつけばみんなで共有し、確認することができたのです。
67

共創（Co-Creation）のノウハウ 2「誰に伝えたいのか」を整理する

STEP2

重複や類似する利用者像をまとめる
表現のし方は人によってそれぞれです。小さな違いを大切にしながら、まとめてください。

ウェブサイトは駅の券売機と同様、利用者がある目的を達成するためのシステムです。
利用者が一体どういう人で、どんな状況に置かれてウェブサイトを見ているのか、進め方

そのイメージが具体的であるほど、利用者に持ち帰ってほしい情報にしっかりと誘導する仕組みを考えることができます。

全員でポストイットを見ながら、重複する答えや、似ているものを見つけ出しましょう。

ここでは、みんなの頭の中の「利用者像」を、一気に見える化します。こんな問いを立てて、考えてみましょう。

微妙な違いに注目しながら、「これとこれは全く同じだね」と納得のいくものだけを重ねます。

問２

ある人があなたの会社のウェブサイトを見ています。
どんな人ですか？用件は？

判断に迷うときは、どうするの？
例えば「求職者」と「採用希望者」は、表現が違うだけで同じ立場の人とみなしても「製品を知りたい消費問題なさそうです。
では、例えばメーカーのウェブサイトで、者」と「購入したい人」の違いはどうでしょう。
あるいは、施設のウェブサイトで「来館者」と「リピーター」の違いは？このように、どうも少し異なりそうだと思える場
合は、「違い」に注目しながら、そばに並べて置いておきましょう。

やり方は問 1 のときと同じです。参加するメンバーの所属部署や普段の仕事内容によって、回答が大きく変わることが予想されます。できるだけ立場の異なる多くの方に声をかけ、参加してもらいましょう。短時間なら忙しい人も参加できますよね。

STEP3
STEP1

利用者像を見える化する

ウェブサイトに集まる人物像が、具体的に表れ始めました。

グループ化した利用者像に名前をつけるウェブサイトが情報を届けるべき主な相手が、「名前」となって見える化されます。

進め方

頭に浮かぶ人物像を書き出しましょう。今回もとにかくたくさん！3 分で！ 年齢層や性別などのイメージも。

みんなの目の前で、進行役がポストイットに書かれた利用者像をグループに分けていきます。まとめたグループにキーワードをつけてお用意するもの：

くのも前回と同じです。

ポストイット／太めのサインペン／ホワイトボード（あれば）まとめ終えたら全体を俯瞰して、情報を届けたい相手の優先順位を議論します。これから立ち上げようとしているウェブサイトが効果を上げるためには、どの人物が最も重要でしょうか？優先順位をつけてみ

進め方ましょう。

問１と同じやり方で、考えつく限りの答えをシンプルなフレーズで表情報を提供するべき相手が想像しやすいカタチになりました。

現し、机の上に置いていきましょう。
短時間でトライしましょう。

いくつかの「軸」を検討してみるのも大事
優先順位といっても、そう簡単には甲乙をつけがたいですよね。参加者の間でも意利用者の置かれた立場をイメージして見が分かれそうです。
そんなときは、順位づけの基準となる「軸」を設けてから、それ答えの書き方は、利用者の置かれた立場が分かりやすいとベストです。例えば学校にそって順位を考えましょう。
例えば、施設のウェブサイトの場合、「施設への来場のウェブサイトの場合、「入学希望者」には、来春に今の学校を卒業する予定で入学を希望する立場の人と、今は社会人で、入学を希望する立場の人がいます。単に「入者を増やすには？」という軸と「貸出施設の利用を増やすには？」という軸では、情3 分間で約 100 枚のポストイットが集まりました。

報を届けたい相手や優先順位は異なります。
「軸」とはウェブサイトの目指すゴールやテーマとも関係しているのです。

学希望者」
よりは、「卒業後入学希望者」や「社会人入学希望者」のほうが、利用者の置かれた立場が分かりやすい書き方といえます。

まとめ利用者の種類と、利用者が求める情報、利用者の優先順位が目に見える「カタチ」になりました。ウェブサイトのターゲットが明確になったのです。次は、立場の異なる利用者が、それぞれの欲する情報に快適にたどりつくための「道」を考えてみましょう。

89

共創（Co-Creation）のノウハウ 3「どうしたら伝わるのか」のアイデアを整理する

ミニストーリーを発展させる

STEP2

ストーリーをもっと豊かに、楽しくしてみましょう。参加者どうしでアイデアを出し合い、ストーリーを展開させます。

前の 2 つの問いを通じて、伝えたい「情報」と「相手」が整理されました。

進め方のポイント：良いストーリーは、利用

ここでは、そのプロセスで具体的にあがってきた要素を結びつけながら、進め方ウェブサイトによって利用者が体験するであろうミニストーリーをつくります。

全員の発表が終わったら、そのストーリーをさらに発展させるアイデ都合も満たしてくれます。どちらにとってもアを考えます。発展させるためのキーワードをポストイットに書き、不自然さや無理矢理感があってはいけませ

こんな問いを立てて、考えてみましょう。

ん。
「実際にありそう！」と、みんなが思えるか元のストーリーの脇に貼っていきましょう。

問３

ある人があなたの会社のウェブサイトで満足しました。
どんな体験をしたのでしょう？

どうかが大事なポイントになります。

例 左ページ下の文化施設のミニストーリーを発展させる！

♪

元のストーリー：ウェブサイトでお気に入りの作家の展覧会情報を調べていた利用者 Aミニストーリーをつくる「シェアする」の作家のイベントを見つけたことを Twitterで紹介。すると、情報を共有した A さんの友つけ、両方に行くことができた。

達 B さんも、興味を持った。

STEP3

進め方

展開されたストーリー：A さんは、お気に入りさんは、展覧会に関連するイベント情報も見

結果を一枚の絵に表す
全てのストーリー展開をひとつのイメージにまとめ、 共有しましょう。 人と情報のつながりが見渡せるはず。

利用者の種類や動機によって、ウェブサイト上での行動や体験が変わります。その可能性や違いを考えてみましょう。

進め方のポイント：利用者に向かう矢印と、進め方円に向かう矢印の色を変えるなど、見やすさ

1. はじめに大きめの円を描きます。これはウェブサイトを表します。の工夫を適宜行いましょう。

2. その外に「利用者」を環状に並べます。

問 2 でグループ化された利用者像ごとに、ミニストーリーを考えます。
ストーリーをつくる際は、下の 4 つのポイントがはっきりするよう3. 円の中に「情報」を並べます。（図 1）に心がけてください。

4. 情報から利用者に向かって矢印を引きます。これがひとつのストー

4 つのポイント：利用者／動機・置かれた立場／情報／行動・印象一枚の絵（コミュニケーションマップ）が完成しました。

リーを表します。

参加者各自がポストイットにストーリーを書き、ホワイトボードなどに貼って発表します。

5. 今度は、利用者から円に向かって線を引きます。これが利用者の行

例 文化施設のウェブサイトの場合！

！

発展のためのキーワード

問 1 や問 2 で整理した情報のキーワードや利用者像を使ってミニストーリーをつくり、発展させていきます。
ウェブサイトは良い体験を提供するための舞台です。
その舞台の上で「誰が、どのようにして、何をするのか」。アイデアをできる限りたくさん出してみましょう。

STEP1

者が満足できるだけでなく、同時に発信者の動や感情を表します。（図 2）
6. すべてのストーリーを描き終わるまでくり返します。

！

♪

まとめ情報、利用者、ストーリー。この 3 つがひとつの絵にまとまったら、これからつくるウェブサイトのコンセプトは完成です。みんなの総意がつまったウェブサイトを実!!

現するために、コンテンツの企画やデザイン、それらを利用者 A さんは、ウェブサイトでお気A さんは、展覧会に関連するイベント

そして A さんは、展覧会とイベントのに入りの作家の展覧会情報を調べた。

情報も見つけた。

両方に行くことができた。

支えるサーバや更新システムなど、インフラの計画をス
1

1011

2

タートさせましょう。

共創（Co-Creation）のウェブサイトが完成するまで

1

仕様書作成

コンセプトが固まったら、いよいよ具体的な設計と制作を行います。

向をよく知り、豊富な経験とノウハウを持った制作会社など専門

仕様書作成から発注までのプロセス（この見開きの上段）は、お客家の力を借りながら進めるのが良いでしょう。計画策定から完成様サイドで行います。しかし、可能であれば、技術やデザインの動まで（この見開きの下段）は、制作会社が行います。

2ポイント
目的

3

概算見積りを依頼

提案を依頼（コンペ実施）

4

発注

仕様書というと堅いイメージがあります

ウェブサイトをなぜ新規作成またはリニューアルするのか、その目的（またはコンセプト）を書きます。

仕様書ができたら、制作会社に概算見積りを依頼します。

納期、予算、更新システムなどが詳細になっ会社を決定したら、正式な依頼の前に、提が、ここでは最低限「ウェブサイトで何を目標

どんな会社に見積りを依頼したらよいかは一概には言えませんが、た仕様書をベースに、正式な提案と見積り案の細部や、業務範囲、条件などを最終調したいのか」が外部から見て分かるものを、実現したいストーリーを書きます。複数ある場合はすべて書きます。

発注となれば数ヶ月から半年はおつきあいが続きます。早い、安い、を依頼します。

整し、依頼内容を確定します。

気負わずにつくってみましょう。

主なターゲット

制作実績が気に入ったという理由だけでなく、パートナーとして信その際、提案してほしいことを明確にして契約をとり交わしたら、いよいよプロジェ前ページでまとめた一枚絵（コミュニケー

ウェブサイトの利用者像を書きます。複数ある場合はすべて書きます。

頼関係が築けるかどうかも、判断の大切なポイントです。

おきましょう（デザインの提案や、制作会クトのスタートです！

ションマップ）から、いくつかのポイント

主なコンテンツ用意した仕様書が多少粗くても、丁寧に確認を行い、選択肢を示し社ならではのアイデアの提案など）。

を書き出せば OK です。

ウェブ画面のメインメニューに並ぶ文言のように、短い単語で書き出し、必要なら説明をつけます。

ながらアドバイスをしてくれる会社であれば期待できます。逆に、提案の依頼は、概算見積りをお願いした会

その他

仕様をつめるための相談に乗ってくれなかったり、何の質問もなく社だけに行ってもよいですし、複数の会社他にも「これは必ず必要」ということがあれば、仕様書に加えておきましょう。例えば、スマートフォン見積りが出てくるようなら、少し考えたほうがよいかもしれません。に依頼をし、コンペを実施してもよいで対応や、更新や管理方法（人数や体制）など。

複数の会社にお願いして、それぞれの会社の個性を見極めることがしょう。

分からないところは無理に答えを出さず、仕様書とは別にリストアップしておき、次のステップで専門家大事です。に相談しましょう。

ここからは、私たちアライアンス・ポートが行うウェブサイト制作の標準的な流れをご紹介します。

5

計画策定

6

情報設計

7

8

ビジュアルデザイン

システム構築

9

データ入力

11

正式運用開始

お客様と話し合いながらプランをさらに具体化し、コンテンツを精査し、ページの構成やレイアウト、お客様と共にビジュアルデザインの方向性を見極6 〜 7 で決定したページ構成とデザインを CMS にリニューアルの場合は、旧ウェブサイトから引き全ての準備が整ったら、正式に運用開始です。立プロジェクト計画書を作成します。

ナビゲーションを設計します。

め、各ページのデザインを決定します。

実装します。社内の開発用サーバで構築するため、継ぐ情報を入力します。

ち上げ直後は何かと分からないことも多いので、

内容

内容

内容

サイトマップ作成、要求定義書作成、CMS（コンワイアフレーム作成、ナビゲーション設計、全ペー

デザインテーマの作成、トップページを基本としテンツ・マネジメント・システム）設計仕様書作成

ジリスト作成たサンプルデザイン、細部フォーマットの作成

運用中のウェブサイトには影響しません。
内容
開発サーバの設置、コーディング、テンプレート開発、CMS の設置、その他機能の開発サポートを行います。

10

試験運用、マニュアル作成とレクチャ試験運用を行い、微調整を施します。また本番環境での運用前に、担当の方にマニュアルを使ったレクチャも行います。
1213

アライアンス・ポートの紹介
プロジェクト紹介

スタッフが大切にしていること

アライアンス・ポートは、2006 年に設立して以来、ミュージアム等の文化事業を中心に、特徴数々のお客様の情報メディアづくりをお手伝いしてきました。
以下が、「共創 (Co-Creation)」で成果を上げたウェブサイトの数々です。

1

デザインと技術の総合力

情報の出し手と受け手の“想いが通じる”
サービスのために良いデザインのウェブサイトに触れたとき、安心感や親近感が湧いた経験のある方は多いと思います。
ところが最近では、生産性を重視し、「ゼロからの発想によるデザイン」に時間をかけない傾向が強く、用意されたパターンを用いて色やイメージだけを入れ替える場合が多いようです。これではな体験
宮城

せんだいメディアテーク

魅力的は提供できません。とはいえ複雑な機能を全て独自につくると費用がかさんでしまいます。

そこで私たちは、CMS（コンテンツ・マネジメント・システム）を基本に、デザインや使い勝手へ

公益財団法人仙台市市民文化事業団
http://www.smt.jp/の繊細な要望を受けとめ諸機能を追加調整しながら、オリジナルのウェブサイトをつくりあげていきます。

福岡市文化芸術振興財団（FFAC）
公益財団法人福岡市文化芸術振興財団
http://www.ffac.or.jp/

山口情報芸術センター（YCAM）
公益財団法人山口市文化振興財団
http://www.ycam.jp/

特徴東京

2

柔軟性・拡張性の追求

つくって終わりではなく“変化”に対応

突然ですが、家づくりを想像してみてください。家は生活の基盤です。日々の使い勝手や居心地が良山口

く、ストレスなく過ごせるように、設計する際には、住んだ後の生活を具体的かつ詳細にイメージします。また、家族の成長など、将来の変化も十分に見据えます。これは、ウェブサイトでも同じです。
私たちは、スピードの速いデジタル環境の変化や、事業内容の変化に柔軟に対応しながら、 使う人

日本科学未来館と共に成長する

独立行政法人科学技術振興機構
http://www.miraikan.jst.go.jp/

WEB アートリエ

特徴

公益財団法人福岡市文化芸術振興財団
http://artlier.jp/

3

ウェブサイトづくりを大事にします。ぜひ、将来のビジョンも聞かせてください。

3 つのアフターケア“運用”と“解析”、そして“成長”のための支援「ウェブサイトは、完成したときがスタートであり、生き物だ」と聞いたことはありませんか？

福岡

生まれたばかりの子どもを成長させるために、私たちは 3 つのアフターケアを行います。1 つは「運用面のサポート」。使い始めてから分かる不具合の微修正や、専門的な知識が必要なサーバ保守、各
神奈川

メディア芸術カレントコンテンツ種メンテナンスを行います。2 つめは「アクセス解析」。ユーザーの動向を見つめ、自社の目的にかトーキョーワンダーサイトなったウェブサイトとしてきちんと機能しているかどうかを分析・診断します。3 つめが「企画提案」。

メディア芸術総合情報事務局（監修：文化庁） 公益財団法人東京都歴史文化財団
http://mediag.jp/
http://www.tokyo-ws.org/

今後のウェブ戦略を練る、成長のためのサポートです。

主な業務と受賞歴●ウェブサイト、スマートフォンサイト等のメディアデザイン業務● CMS、ウェブサービス、スマートフォンアプリ等の開発業務●ウェブサイトアクセス解析・診断、市場分析等の調査・分析業務●ブランド戦略、コミュニケーション戦略等のコンサルティング業務

横浜国立大学大学院／
建築都市スクール Y-GSA（2012 年 3 月まで運用）

KAAT 神奈川芸術劇場

日本化学会

アサヒ・アート・フェスティバル

公益財団法人神奈川芸術文化財団（2013 年 4 月まで運用）

公益財団法人日本化学会
http://www.chemistry.or.jp/

AAF 実行委員会
http://www.asahi-artfes.net/○ 2009 年文化庁メディア芸術祭 エンターテイメント部門奨励賞受賞
14

15

小冊子の制作によせて制作者紹介

この小冊子は、私たちアライアンス・ポートがこれまで全国各地の山辺真幸（やまべ・まさき）

文化施設、科学館・博物館、学校・大学の方々と共に立ち上げてきた、ウェブサイトや情報メディアの制作プロセスをコンパクトにまアライアンス・ポート クリエ
イティブディレクター。多摩美

とめたものです。

術大学非常勤講師。デザイン

複雑化・高度化するウェブサイトの開発。だからこそ私たちは、システムやレイアウトといった「器」を考える前に、そもそも「利用事務所でデザイナー、ウェブディレクターとして勤務した後、アライアンス・ポート

者と発信者の間のコミュニケーションをどう変えていきたいのか」を共同設立。文化芸術や科学をテーマとしという個々の組織特有の問題（コンセプト）をしっかりと捉えることが、とても大切だと感じています。

た公共性の高いウェブサイトのプランニン
グ、ディレクションを行う。主なプロジェ

この小冊子では、「共創」をキーワードに据え、「自分たちのウェブサイト」の核となる部分を、より多くの人たちと共に描き出す手順

クトは、日本国際博覧会「愛・地球博」のオンラインパビリオン「サイバー日本館」、をまとめました。これからウェブサイトの立ち上げやリニューアル

山口情報芸術センター、トーキョーワンを考えている方々の参考になれば幸いです。

ダーサイト、せんだいメディアテーク、日本化学会、日本科学未来館、他。

2013 年 7 月

アライアンス・ポート

アライアンス・ポート

東京都渋谷区千駄ヶ谷 3 丁目 16-3 メイゾン原宿 6F
2013 年 7 月発行

企画・制作・発行：アライアンス・ポート

アライアンス・ポート アート
ディレクター。日本グラフィッ
クデザイナー協会会員。グラフィックデザイン、インターフェースデザ
インを学んだ後、デザイン会社でサインデザインや地域・企業のデザインに携わる。
2007 年よりアライアンス・ポートでデジタルメディアを中心としたビジュアル・コミュニケーションの仕事に携わる。
川角友太（かわすみ・ゆうた）
アライアンス・ポート デザイ
ナー。情報デザイン、インターフェースデザインを学び、アラ
イアンス・ポートに参加。ウェブサイトやモバイル端末の情報設計、グラフィックデザインに携る。

電話番号 03-6459-2961 ／メールアドレス info@allianceport.jp ／ウェブサイト http://www.allianceport.jp/© ALLIANCE PORT, LLC

小川裕子（おがわ・ひろこ）

編集：ハル編集所

イラスト：くさかみなこ