soyogo|書を読んで、まちへ出よう

サイトイメージ

ゆるい

堅い

単色

カラフル

手触り

機械的

soyogo|書を読んで、まちへ出よう
soyogo|書を読んで、まちへ出よう

ちょうどいいポイント

余白のバランスが心地よい

定期的に多彩なジャンルの小説やエッセイが更新されていく、印刷会社が運営するオウンドメディア。ファーストビューでは台灣出身のイラストレーター「高妍(Gao Yan)」さんのイラストが、左から右へ本をめくったような演出とともに出迎えてくれます。タイトルとあしらい、メニュー、イラストというシンプルな構成で、「緻密なイラスト」と「余白」のコントラストが一層際立っているデザインです。

また、よく見るとイラスト内の本がめくれたり、ねこの表情が変わったり、左下のスクロールバーも時折アニメーションしています。紙ものではできない、Webならではの遊び心がちりばめられているのもポイントです。

「読みたい欲」をかきたてる

スクロールしていくとイラストが右に固定され、左側に本の小説やエッセイのタイトルがふわっと表示されます。背景色がややくすんだベージュ系の白になっていることと、コンテンツ幅が狭めに設定されていることにより、まるで紙の本の目次を見ている気持ちになります。

小説やエッセイのエリアを過ぎると、サイトの紹介およびクレジットのエリアに入ります。ここでは表示演出のアニメーションもなく、このサイトの主役はあくまで小説やエッセイなのだと、より一層作品が際立つように感じます。

フォントにもこだわりがつまっている

このサイトでは、英字には「EB Garamond」日本語には「Zen Old Mincho」が使用されており、レトロ感もある落ち着いた雰囲気を演出しています。

また、タイトルには「YakuHan MP」が最優先で設定されています。このフォントは、約物(やくもの)とよばれる「かっこ」や『二重かっこ』、句読点などの記号を半角にできます。実装に負担の少ない形で、印刷物などでは当たり前に用いられるレタースペーシングの概念も取り入れることで、Webでありながら紙ものを読んでいるような印象になっていると思います。

タイトルの「かっこ」、びっくりマーク!などに「YakuHan MP」が設定されている

ちなみに、下層ページにあるエッセイの本文には「Zen Kaku Gothic New」というゴシック体が使用されています。サイトの雰囲気は壊さずに、明朝体よりも比較的とっつきやすい印象をあたえられているので、このサイトのデザイナーさんはフォントの持つ特徴をとても理解して使用されているなと思いました。

下層ページにあるエッセイ
ちにゅり

ちにゅり CHINYURI

フロントエンジニアをしながら、オリジナルキャラクター「まっちゃねこ。」のイラストを描いています。ねこと抹茶とサッカーが大好きな、日本生まれの台灣人です🐱🍵⚽️ 少しでもこのサイトを見ている方のお役に立てますと嬉しいです🐥✨

Yuzu

テトラード配色が活かされているサイト

Tsuki

夜空のグラデーションが上品で美しい

ara

アナログ(新聞)→デジタル(web)に!

Yuzu

有彩色も無彩色も綺麗に使われているサイト