MEDIA CENTER

電子図書館のデザインとカスタマイズ

電子図書館コラム2023.04.06

今回は、電子図書館の「デザイン」や「見た目」ついてのお話しです。
 
電子図書館の質問の中で、コストやコンテンツの次に多いのが、デザインに関すること。
結構、こだわっている学校も多いのではないかと思います。確かに、どんなに電子図書館が便利でも、生徒に利用してもらうためには、サイトの印象や雰囲気が良くないと離れていってしまいますよね。
 
近年、いろいろな電子図書館サービスが登場してきており、サイト名称やカラーバリエーションを変更したり、画像を挿入したり、デザインを自由にカスタマイズできる機能が備わっています。
 
今回は、電子図書館でどのようなカスタマイズができるのかを紹介しながら、デザインで工夫している点や苦労している点についても触れたいと思います。
 
ここでは、本校が導入しているJDLSの「LibrariE」の機能を紹介しますが、他のサービスを検討や利用している学校にも、何か参考なることがあればいいなと思います。
 
▶本校の電子図書館はこちら

 

 

 

 

▼電子図書館の印象が大きく変わるカスタマイズ5選

 
電子図書館の印象が大きく変わるカスタマイズは、大きく5つあります。
 
1.カラーバリエーション
2.コンテンツ表示形式
3.タイトル画像
4.トップ画像
5.バナー画像
 
どれも重要な要素ですので、一つ一つ説明していきます。

 

 

1.カラーバリエーション

電子図書館のメインカラー選びは、デザインで最初に悩むことかもしれません。
本校もなかなか決まらず、現在も悩みの種となっています。理由は、後ほどお話しします。
 
LibrariEでは、メインカラーを10種類(水色・青色・濃青色・紺色・みどり色・淡黄色・オレンジ・ピンク・赤色・むらさき)の中から選べるようになっています。
 
 
 
 
導入校では、何色が最も選ばれているのか、ちょっと気になったので調べてみました。
ここでは、インターネット上で検索ができた「LibrariE(紀伊國屋書店)」55校と「LibrariE (TRC)」15校の合計70校を対象に調査しました(随時更新)。
 
その結果がこちらです。 
 
 
 
 
最も選ばれているメインカラーは、【赤色】【みどり色】【紺色】でした。
 
【赤色】と【みどり色】は、「LibrariE(紀伊國屋書店)」の導入校に人気でした。【紺色】は、「LibrariE (TRC)」の導入校に人気で、15校中9校に選ばれていました。ちなみに、「LibrariE(紀伊國屋書店)」では、55校中3校だけという意外な結果に。
 
落ち着いた図書館のイメージを彷彿とさせるカラーが人気のようですが、学校や学校図書館のシンボルカラーを用いている場合も多いようです。
 
通年でカラーを固定している学校が多くみられますが、季節などで変更している学校もあるようです。本校も、学校のシンボルカラーに近い【紺色】にしていましたが、現在は、春夏シーズンは【水色】、秋冬シーズンは【赤色】にしています。
 
カラー選びでは、電子図書館に親近感を持ってほしいという思いもあり、図書館らしい落ち着いた印象から、遊び心のあるイメージ作りを大切にしています。そこで、冒頭で触れた悩みの種というのが、
 
カラーバリエーションをもっと充実させてほしいという悩みです。
 
10種類の中から選べるのは嬉しいのですが、こんな色があったいいなと思わずにはいられないのも事実です。将来的には、カラーチャートから自由に選べるくらいになると嬉しいです。

 

 

2.コンテンツ表示形式

サイト全体の雰囲気をチェックしたあと、次に目に入るのは「電子書籍」です。
電子書籍を見やすく配置する=レイアウトも、デザインの重要な要素になります。
 
LibrariEでは、コンテンツ表示形式が3パターンあります。
 
1.サムネイル表示
2.1列表示
3.2列表示
 
それぞれの特徴やメリット・デメリットについて簡単に紹介します。
 
 
1.サムネイル表示


 
サムネイル表示は、コンテンツが横に並んでいるタイプです。
 
一番のメリットは、縦スクロールのストレスが少ないことです。
 
特集欄がコンパクトながら、表紙や文字のサイズも小さすぎず、3つの表示形式の中では、一番見やすくて、使いやすいと思います。導入校では、サムネイル表示にしている学校が最も多くみられます。
 
デメリットではないのですが、要望を強いて言えば、コンテンツを固定するのではなく、横スクロールになるといいですね。より多くのコンテンツが、サイトを移動することなく見られるようになると、さらにストレスなく使えると思います。
 
 
2.1列表示


 
1列表示は、コンテンツが縦に並んでいるタイプです。
 
自然と目線が下に移るので視認性は良いのですが、たくさんのコンテンツや特集が多くなってきたときに、縦スクロールのストレスを感じると、デメリットになります。
 
メリットとしては、スペースがあるので本の情報量が多いことでしょうか。
 
「出版社」と「コンテンツタイプ」が追加で表示されていますが、さらに、「あらすじ」が一行でも表示されれば、文句なしのレイアウトになるでしょう。実は、生徒からも「あらすじ表示」の要望は、ちらほら聞こえてきます。今後、実装されることを密かに期待しています。
 
 
3.2列表示


 
2列表示は、コンテンツが左右に並んでいるタイプです。
 
表紙サイズも見やすくて、画面が縦長になり過ぎず、本の情報スペースも確保できる万能レイアウトです。
 
デメリットというわけではないのですが、コンテンツが5つしか表示されないので、6つ目のスペースに違和感が…モヤモヤする謎のスペースです。気になるのでコンテンツを表示してほしいです。

 

 

3.タイトル画像

電子図書館のタイトル部分は、デザイン性が出るところです。
どこの電子図書館サイトなのか、最初に確認するところでもありますので、タイトル画像は、わかりやすく印象的なものにしたいですよね。
 
導入校を見てみると、電子図書館の名称、学校名、校章、マスコットキャラクター、図書館をイメージするモチーフなどを取り入れたデザインが多くみられます。
 
本校では、季節に合わせて3つのタイプを用意しています。
 
 
▼春・秋バージョン(標準)

▼夏バージョン

▼冬バージョン

 
 
イラストの制服は、標準服、夏服、冬服、色違いバージョンとリアルなデザインに寄せており、衣替えシーズンに合わせて画像を切り替えています(意外と好評です)。
 
画像の作成は、ユーザー側で自由に作成できるようになっているので、得意な方にとっては、カスタマイズの醍醐味を存分に楽しめるところですね。一方、苦手な方にとってはデメリットとなります。
 
本校では、図書委員さんと一緒にアイデアやイメージを出し合いながら、電子図書館のイメージ作りをしています。スキルはあっても、センスがない!という場合は、図書委員さんや漫画研究会、美術部、その他に外部委託するという方法もおすすめです(本校はこれです)。
 
さらには、タイトル部分を「動く画像」にすることもできます。
簡単なアニメーションのようになるので、遊び心をくすぐられますね。GIFアニメーション画像を設定することで可能なようです。試してみたいです。

 

 

4.トップ画像

トップ画像は、カスタマイズの中で最もデザイン性が出るところです。
 
サイトの中で一番目立つため、非常に重要な「情報発信スペース」といえます。
どのように活用するかで、その学校の個性が出るところですね。
 
 
 
 
導入校を見てみると、主に6つの活用タイプに分けられるかと思います。
 
1.学校 or 学校図書館の画像
2.広告(蔵書検索、本の相談、イベント、特集、青空文庫、便利サイトなど)
3.メッセージ(一人5冊まで、電子図書館へようこそ、ご入学おめでとうなど)
4.図書館に関連した画像(本、書架、読書、図書館のイメージ画像など)
5.図書館に関連しない画像(学校行事、季節、風景、植物、イラストなど)
6.画像なし
 
本校では、2つめの「広告」で活用することが多いです。
 
 
▼オンライン蔵書検索の案内

▼レファレンスの案内

 
 
導入校では、学校図書館の画像にしているところが多いようです。
 
意外だったのは、画像なしにしているところも多くみられたことです。
 
すっきりとしたデザインになるのでいい感じではあるのですが、一番目立つ部分をあえて活用しないのは、もったいない気もしますね。おそらく、画像作成の負担やスキル不足からそうしている部分も否めないかと。
 
本校でも、負担の割にあまり効果を感じられず、無難に画像なしにしていた時期がありましたが、利用者が増加してくると、情報発信スペースを有効活用しない手はありません。
 
現在はトップ画像の効果を実感しており、積極的に活用したいと考えているので、要望としては、トップ画像を複数表示できるようになるといいですね。

 

 

5.バナー画像

バナー画像は、画像サイズが小さめで、あまり目立たないように感じますが、複数表示させるとそれなりの存在感があり、デザイン性が出るところです。
 
バナーは、関連ページへ移動しやすくするだけでなく、広告としても使えるので、非常に使い勝手の良いカスタマイズです。そんな使い方があったのか!という活用方法もあり、可能性は無限大です。
 
 

 
 
導入校を見てみると、主に8つの活用タイプに分けられるかと思います。
 
1.資料のリクエスト
2.オンライン蔵書検索
3.ID・パスワードの再発行・再通知
4.学校 or 学校図書館のWebサイト
5.契約データベース(ジャパンナレッジ、朝日けんさくくんなど)
6.便利な情報・サービス(青空文庫、CiNii、公共図書館など)
7.その他(利用規定、開館日、特集、独自コンテンツなど)
8.画像なし
 
導入校では、「資料のリクエスト」「オンライン蔵書検索」「便利な情報・サービス」のバナーを表示しているところが多いようです。
 
たくさんのバナーを表示させると、見にくい・使いにくいというデメリットがあるので、バナーのデザインに統一感があるといいですね。

 

 

▼電子図書館の「デザイン」や「見た目」は、学校図書館の「環境整備」と一緒!

学校図書館でいう「環境整備」とは、落ち着いて読書や学習を行うことができるような、安らぎのある環境や知的好奇心を醸成する開かれた学びの場としての環境を整えることと示されています。
 
学校図書館では、本を手に取ってもらえるようにPOPや展示ブースを作ったり、リラックスしてもらえるように居心地の良いソファやクッションを置いたりすることがありますが、
 
使い心地が良い、また利用したいと感じられるような電子図書館を作っていく作業もまた、学校図書館でいうところの「環境整備」に通ずるのではないかと思います。
 
導入前、電子図書館に「環境整備」のような業務があるとしたら、それはどんな作業だろうと思っていましたが、「デザイン」や「見た目」にこだわってカスタマイズをしているときが、一番近いように感じます。
 
いかに役立つかや利便性を向上させるかといった機能面だけでなく、温かみや親しみを感じたり、愛着が湧いたり、知的好奇心をくすぐるような魅力的な電子図書館を作るためには、
 
「デザイン」や「見た目」という要素が必要不可欠です。
 
電子図書館をいかにデザインしていくか、ユーザー側にもサービス側にも課題はありますが、もっと良くなるという可能性を感じます。
 
今後、電子図書館の「デザイン」や「見た目」に関連したカスタマイズが、どのように進化するのか楽しみですし、ユーザー側として電子図書館の環境を整えていくスキル向上にも努めていきたいと思います。