愛される学校づくり研究会

分かりやすい学校サイト・デザイン講座


★このコラムは、「愛される学校づくり研究会」にて発表された、「わかりやすい学校サイト・ポイント講座」を元に、具体例を追加しながら、デザインにつてい解説していくシリーズです。

【第12回】ロールプレイングで見えてくるもの

学校サイトは「今」学校に通っている子供や保護者だけではなく、他の地域・都道府県からアクセスしてくる人、将来、関係者となるまだ子供のいない潜在的なユーザーへも、空間・時間を越えた公共のサービスとして機能すべきものです。

第1回目の最後にこんなことを書きました。学校サイトにとって重要なポイントです。

  1. 看板    ホームページではタイトルにあたります。
          どこの学校かわかるようにしましょう。
  2. ターゲット 誰のために運営しているかを明確に。
  3. アピール点 トップページを見ただけで学校の特徴がわかる。
  4. メニュー  目次やサイトマップが整理されている。
           欲しい情報がどこにあるかが予想できる。
  5. 満足感   欲しい情報が公開されている。学校の事が手に取るようにわかる。

これらを実現するために、具体的にどうすれば良いのか、色彩や書体、図解や写真の撮り方などを、多方面から説明してきました。いろいろな技術や手法はありますが、今回はターゲットの具体像をどこまでイメージできるかという話です。漫然と語りかける話や歌が心を打たないように、だれに向かっているのかわからないサイトは輝きません。
相手の顔を思い浮かべて話をする為に、まず、その人になりきってみる。そういう意味でのロールプレイングです。

■なりきるための方法

先生方は授業研究や指導案作成などで、子供たちの気持ちになって授業を組み立ててみるという経験がおありだと思います。サイトデザインもこの「〇〇の気持ちになって」というのは大事です。しかし、知らない人の立場になって考えるというのは難しいものです。
誰かの立場で考えるというときに、出来るだけ具体的な「だれか」をイメージすることができるでしょうか。それがポイントだと思います。
タイトルに学校名を入れる時でさえ、他県からの訪問者を想定できるかどうかが問われます。
訪問者が子供だったら?外人だったら?自分の学校名が地域独特な読み方をしていて、読めるのはその地域の人だけかもしれません。

■もっと具体的ななりきり(たのしい妄想の世界)

ターゲットを抽象的にではなく、かなり具体的にイメージしてみると‥

●子供が小学校に上がる時に郊外に家を買ったが、通勤時間がかかるうえに、残業が多いので、子供や学校の話題になかなか参加できないお父さん。電車の中でスマホから学校の様子を週に1度覗く。電車の中や、昼休みの職場で学校の様子を覗いているので、学校のトップを開いた時にいきなり校歌が流れ出すと、ちょっと恥ずかしい。
写真やPDFなどは、時間がある時にじっくり見るので、日々のニュースが帰りの電車でチェックできればよい。PTAのお父さん方と顔をあわせることも稀だ。

〜〜などと具体的にイメージすると対策がたてやすいものです。

●戦時中生まれなのでアルファベットはあまり分からないが、デジカメを買って近くに住む孫達の様子をアルバムにしているおじいちゃん。PC教室にも通っているが、PCは子供のお下がりなので、画面の大きさは1024X768dotsで、すこし小さい。バッテリーは充電不足でいつも電源コードをつないでいる。デジカメ撮影の後には、写真整理のためにPCにスイッチが入る。たまに学校サイトへもアクセス。それは、月に1、2回。もちろん老眼なので、写真はいいけど小さな文字が沢山あると、ついつい読むのがおっくうになってしまう。しかし孫の様子を写真で見るのはとても楽しい。

※この年代に限りませんが、マウスの操作が得意でない人も多く、画面スクロールがおっくうだという人がかなりいます。  特に最近のマウスにはスクロール用のホイールが付いてますが、あのボタンで操作ができるのは、かなりのPCの使い手と思われます。

●子供が中学に上がったのを期に仕事に復帰したお母さん。中学生にもなって持ち物の準備ができない息子にイライラしてる。朝も夜もいそがしいので、学校から貰ってくるプリントに目を通すのが精一杯。最低限必要な情報がまとまっているとうれしい。

■イメージトレーニングで広がる世界

学校サイトで発信する際の注意点を整理してみます。

  1. ハード・ソフトの環境に配慮できるか
    Windows、MacOS、携帯、スマホなどのハードの違いや、ie、safari、chrome、firefoxなどのブラウザによる見え方の違いがあるので、自分のPCで見えている画面と同じものは見ていないと思ったほうがいいですね。
  2. 閲覧する場所に配慮できるか
    電車内や職場で見るのか、家族の共有PCで居間で見るのかは人それぞれです。ちなみに私の周りには書斎でみるという人がいません。そもそも書斎がないらしいです。
  3. 季節や時間に合わせた話題提供ができるか
    旬な話題(いまなら新入生向けの学校行事など)
    次週に行われる行事の準備としてサイトを覗く事もありますね。
  4. 年齢、国籍の違いや、障害、色弱などの属性に考慮できるか

この様に書くと、すべての人に対応した膨大なサイトになってしまうようなイメージですが、画面デザインとしては、一番プアな環境に合わせるとよいでしょう。閲覧環境に依存しないためには流行りの技術を使う必要はありません。
トップ画面もメニューが整理されていて、情報が有るのか、無いのかが一瞬でわかること。あるいは想像がつくこと。これがとても大切です。欲しい情報を探しまわるのは時間の無駄ですよね。
自分の欲しい情報が無いことがわかれば、学校へ電話をしたり他の手段をとることができます。

ターゲットの具体的な姿が見えてくると、学校サイトに「何を」「どのように」掲載するかを判断する材料になります。 この姿が見えないと、何も作れないのは、デザイナーも一緒です。デザイン作業に入る前に、念入りにヒアリングするのはそのためです。しかし、先生方は、いろんな子供たちや保護者や卒業生を見てきたわけですから、具体的なユーザーの姿がすでに見えていることでしょう。その姿に語りかけるようなサイトになれば、ユーザーも応えてくれるに違いありません。

「分かりやすい学校サイト」コラムに、一年間お付きあいいただき、ありがとうございました。

【コラム】世界の図書館

子供から大人まで、様々なユーザーをターゲットとするサイトとして図書館があります。
主にそのトップページを比較して、分かりやすいかどうか調べたことがあります。国会図書館がサービスや資料数では一番大きいと思われますが、トップページはわりとシンプルです。
XGA(1024X768)の画面におさまっています。
使いやすさ、探しやすさを優先ということだとおもいます。

国立国会図書館 (http://www.ndl.go.jp/)

海外の図書館はもっとシンプルです。こちらで比較してみてください。 トップページにはメニュー項目しかありません。


ALAアメリカ図書館協会(http://www.ala.org/)
ポルトガル国立図書館(http://www.bnportugal.pt/)
フランス国立図書館(http://www.bnf.fr/)
ポーランド国立図書館(http://www.bn.org.pl/)
インド国立図書館(http://www.nationallibrary.gov.in/)
ロシア国立図書館 (http://www.nlr.ru/eng/)

fig_020.jpg

県立、市立図書館は比較的トップページの情報が豊富ですが、上から下までスクロールして探す情報が多いかもしれません。 トップページにメニューだけでなく、コンテンツ(情報内容)が載っていても決して悪いというわけではありません。 どうしても情報過多になってしまうので、優先順位をきめて画面上部と下部で優先順位を決めておけば見通しはとてもよくなります。

fig_030.jpg

(2012年4月9日)

ahotta.jpg

●堀田敦士
(ほった あつし)
教育+ネットワーク+ゲームを3本柱に開発するデザイン会社勤務。若くて元気な頃は、シミュレーションゲーム「TheTower」「シーマン」などのアートディレクターとして徹夜の連続。現在はWEBサイトデザインやCMS開発で主に学校を対象にした広報支援のためのお手伝い。お手伝いがエスカレートして、息子の高校PTAのICT委員会顧問に抜擢され、ICT教育の準備で徹夜の連続。