無人本屋くらんなか

コーディング
デザイン

知人の運営する無人本屋のホームページを作成させていただきました。

コーディング

HTML・CSS・jQueryを使用しています。FLOCSSとSassを使用し、可読性が高いコードになるよう配慮しました。
極力CSSで動きを実装し、読み込み速度が重くならないサイトを目指しています。縦書きのテキストを使いながらレスポンシブが崩れないように工夫しております。

ソースコードを見る

デザイン

田舎の温かみがある雰囲気が伝わるようにとのご要望をいただき、背景に淡いクリーム色を敷いて温かみを出しています。
その他のカラーは蔵や周辺の木々から色をチョイスし、自然の雰囲気が伝わるようにいたしました。
ゆったりと時が流れていくような空間を余白が広いしっぽり明朝で表現しています。
本をめくるような感覚を縦書きと三角形のモチーフで演出しました。