illiDesign

WORKS

LP
クライアントワーク

Design・Wire・Writing

私設図書館特設サイトのトップページイメージ
※2024年10月の内容
概要
Webデザインスクールで行われたリーフレット制作の授業内コンペで、特設サイトの新規作成をご提案し、リーフレットと合わせて採用いただきました。ノーコードツールStudioで制作しました。(公開環境への移行・公開はクライアント様で実施) リーフレットはこちら(私設図書館リーフレットのリニューアル)
使用ツール
  • Figma
  • Photoshop
  • Illustrator
  • Studio
制作時期/期間(1日作業時間平均約4時間)
Webデザインスクール入学7ヶ月目
  • 企画・ワイヤー4日
  • デザイン7日
  • Studio実装7日
特に意識したこと
  • 分かりやすく親しみを感じられるデザイン
  • 上から下へスクロールしていただくため、興味が移りやすい順序を意識した情報の掲載順
  • 本棚オーナーの魅力を端的に表したキャッチコピー(サイトトップ)
動きのイメージ
パソコンサイズ(1)
私設図書館特設サイトのサムネイル
パソコンサイズ(2)
私設図書館特設サイトのサムネイル
タブレットサイズ(一部抜粋)
私設図書館特設サイトのタブレットサイズサムネイル
スマホサイズ(一部抜粋)
私設図書館特設サイトのスマートフォンサイズのサムネイル
スマホサイズ(メニュー画面)
私設図書館特設サイトのスマートフォンサイズのメニューサムネイル

More Details

案件の概要

クライアント
私設図書館の運営法人
目的
紙面に限りのあるリーフレットから特設サイトへ誘導することで、興味のあるかたに詳細な情報を提供する。制度の周知/利便性の向上
コンセプト
一箱本棚オーナー制度のメリットやなり方を分かりやすく紹介し、問い合わせにつなげる
ターゲット
ユーザー
一箱本棚オーナー制度に興味のあるかた。
特に、図書館案内リーフレットに掲載のQRコードからアクセスされるかた

制作にあたっての考え方

情報設計

図書館案内リーフレットに掲載されたQRコードからのアクセスが主なターゲットになることから、スマホサイズを中心に設計しました。

まずは訪問者に本棚オーナー制度に興味を持っていただけるよう、本棚オーナーになるメリットや特典を最初に掲載しています。次に、興味を持たれたかたが、問い合わせ前に把握しておきたい有益な情報を順番に掲載することで、問い合わせ以降のやり取りがスムーズになるよう工夫しています。

デザイン

リーフレットからのアクセスを想定しているため、リーフレットとデザインの共通性を持たせながら制作しました。
(デザインに乖離があると、訪問者がサイトを間違えたと誤解し、離脱につながる可能性があるため)

ホームページならではの動きを、制作で使用したノーコードツールでも可能な範囲で実装することで、スクロールを促すとともに図書館の楽しさを感じてもらえるよう意識しました。