人材育成のための授業紹介●デザイン学

Webデザイン教育
〜デジタルデザイン3年生中小企業のホームページデザイン(産学官連携)〜


西垣 泰子(明星大学情報学部デジタルクリエイトコース教授)

 デジタルインフォメーション(Web)は、知識共有技術を記述するためのフォーマットや「Mash Up 」、「Web Ontology」から、さらに、「SNS」、「ユーチューブ」、リアルタイムに参加できる「ニコニコ動画」等がコミュニティ社会を生み出し、散逸した「情報」の集合体から新たな「社会」を創り、検索する側の資質や知識量により異なる複合的情報社会を生み出しました。インフォメーション・デザインする側はプログラミングのみならず、社会を理解した独自性の高い視野を持つことが必要とされます。
 社会や経済界での自らの役割を反映させることを理解するために、明星大学産学官連携推進室と多摩信用金庫価値創造事業部と連携した教育プログラムを導入いたしました。この教育効果は高く、学生達は社会意識を持つとともに、企業の実態を知ることから必然的に実学のデザインに取り組み緊張感の高い授業となります。

図1 完成したホームページ
図1 完成したホームページ
図1 完成したホームページ


1.「信頼され好感がもたれる中小企業Webサイトのデザイン」

 Webをデザインとして指導することの他に二つの目的を含めました。

(1)多摩中小企業の経営者と連携を持つことにより学生が社会性を身につける。
(2)モバイル世代が社会の経済活動を活性化させていくことから、学生の進取・先行性と感性を生かし、多摩地域社会の経済発展に貢献する。

<プロセス>

1) 企業訪問のためのマナー研修(多摩信用金庫価値創造事業部主催)
2) 『Webデザイン』のコンテンツページ構成要素である「視覚言語」、「CSSレイアウト」、「色彩効果」、「アニメーション」。インフラである「サーバ」、「システム」の論理的把握。
3) 企業訪問:クリエイター(取り組む学生)と企業のマッチング
 企業の事前調査(企業の望むWebデザイン)、購買態度の測定(商品・サービスの購入や利用に際して生活者の価値付け、満足感やモチベーションを感じているかを把握。購買層の把握。競合企業や商店の差別化)
 ブレーン・ストーミング(brainstorming能力開発技法)からコンテンツデザイン。
  • 多くのアイデアを出させる。
  • 他のアイデアを改良する、二つのアイデアを組み合わせたりすることも考える。
  • アイデアを見直し、創造的、個性的なアイデアを優先させる
  • フローチャートデザイン
4) グループ単位にて企業訪問、サイト構成(コンテンツ〜デザイン)
  • ブレーン・ストーミング後のコンテンツを企業訪問にてコンセンサスを得る
  • ラフスケッチのコンテンツ構成図、フローチャートデザイン持参
5) プログラミング
6) 企業訪問〜最終確認
デザインの確認。デザインの確認は、企業に出向き、合意を得るため幾度も打ち合わせを持つ。同時に動作確認も行う。
7) 完成報告イベント:完成作品の受け渡しのセレモニーを開催。(社会的責任の意識が高まる)

 各回では、プレゼンテーションを行い、コミュニケーション能力を養っています。

写真1 ブレーンストーミング風景
写真1 ブレーンストーミング風景
写真2 中小企業を訪問してデザイン確認と動作確認
写真2 中小企業を訪問してデザイン確認と動作確認
写真3 企業訪問
写真3 企業訪問
写真4 完成発表会
写真4 完成発表会
写真5 完成交流会
写真5 完成交流会
写真5 完成交流会


2.ネットワーク型コミュニケーションデザイン

 「視覚」のみならず「聴覚」も含めて興味の湧く方向へとアクセスするネットワーク型コミュニケーションの設計では、「意味を与える視知覚のデザイン」、「情報共有ができる構成」、「ユーザビリティ」が必要とされます。中でも重要なデザインとして、一瞬の理解度が85%から95%と高く、即時的に全体把握できるノンバーバルコミュニケーション(非言語コミュニケーション)デザイン、可読性の高いタイポグラフィデザイン、アイコン、インデックス、シンボルを基本に置いています。

<ノンバーバルコミュニケーションデザインと擬音語のデザイン>

(1)ピクトグラムデザイン
 Webデザインを履修する前に、グリットシステムと幾何学図形をベースとして、ピクトグラムデザインの演習時間を持っています。

(2)擬音語の可視デザイン

(3)音と形の関係を理解できるように、日本独自の「擬音語」を限られた要素(点、線、面)で視覚デザインしています。このデザインからフラッシュアニメーションに発展し、「動きと音の関係」を認識するデザインワークをします。

写真6 山口先生のピクトグラムデザイン演習風景
写真6 山口先生のピクトグラムデザイン演習風景
図2 擬音語のデザイン(学生作品) 図2 擬音語のデザイン(学生作品)
図2 擬音語のデザイン(学生作品) 図2 擬音語のデザイン(学生作品)
図2 擬音語のデザイン(学生作品)


3.今後の課題

 ICT(Information and Communication Technology)活用から社会に参加していく教育プログラムは醍醐味があります。しかし、多くの困難が度重なり生じることがあります。
 いくつかの事例をあげておきます。

(1)企業訪問時間帯の設定。(タイミングの良い企業訪問時間を見極める)
 教員が進行状況を含めて全グループの把握をする。

(2)学生と企業との良い関係を保ち続けるためのサポート。

(3)企業側が活用したいとの要望があったときの対応の方法。
 サーバ、更新の問題。

(4)学生が企業に出向く時の時間設定と交通費が必要になる。

(5)グループ内での学生同士の作業分担がスムーズなコミュニケーションでされることへの教員の指導体制。

 今年は、学生数が多いことから、高幡不動商店街の6企業を1社6名から7名のグループで担当して進行しています。商店街の方々は学生達を暖かい気持ちで支援していただいています。このことが学生の励みになり、良いWebを制作しようという意気込みにつながっています。このような関係は、学生達に良い作品をデザインするだけではなく、「人と人のコミュニケーション能力」を自然に育てていると確信しています。



【目次へ戻る】 【バックナンバー 一覧へ戻る】