■概要
絵本「かないくん」が完成するまでのルポルタージュをまとめたサイト。谷川俊太郎作、絵は『ピンポン』『鉄コン筋クリート』で有名な松本大洋。
■ターゲット
・谷川俊太郎、松本大洋のファンの人
・「かないくん」の読者
・出版関係者
■FV
鉛筆で書かれたようなタッチの絵本の表紙イラストと、手書きで書かれたサイトタイトルを中央に配置。本が完成するまでのレポートサイトということもあり、手書きのイラストや文字は、本がどのように完成していったのだろうというワクワク感を読者に与える。
右下の出版社のロゴは、FVでは目立つアクセントカラーになっているが、文字を斜めにしたり柔らかい印象のフォントを使用することで、トップ画像に馴染むようになっている。
■特徴
右下のロゴが少し見切れているので、スクロールをするとこのサイトについての説明文が縦文字で配置されている。
全体のベースカラーに淡い水色を使用しているため、FVの鉛筆のような薄い色で書かれているイラストでもはっきりと視界に入ってくる。FV以降のイラストついては、背景色と同じ水色にすることで、メインの文章に集中が出来る。淡い配色にすることで、本文に挿入されているイラストや画像がパッと目に入り、メリハリがつく。説明イラストには太めの枠線を使い区別。
せろりのセオリー/ Webサイト100選 No.22 「かないくん」ができるまで
進行過程はブログ風のデザインで書かれており、初めから最後まで中央にテキストが配置されている。ルポルタージュサイトのため文章が多めのページになるのだが、単調にならないよう所々テキストの色を変えてアクセントをつけている。
せろりのセオリー/ Webサイト100選 No.22 「かないくん」ができるまで
もともとpc版でシングルカラムレイアウトのため、スマホ表示用の切り替えの必要が無く、そのままのレイアウトになている。
■フォント
・ヒラギノ角ゴ Pro W3
■配色
・テキスト：#265C8D, #919191, #BE6E3C, #00A0DC
イラスト・背景色と同じようなトーンを使用。控えめで優しい印象。
淡いトーンの色を使うことで、絵本の優しさが伝わってくる。
せろりのセオリー/ Webサイト100選 No.22 「かないくん」ができるまで
せろりのセオリー/ Webサイト100選 No.22 「かないくん」ができるまで