ミニマルなブログやオウンドメディアに最適！超シンプルなモノトーンのテンプレ登場

こんにちは！
BiND10テンプレートのデザインディレクターを担当している、デザイナーのオモトです。
前回のブログで、ユーザーさんと共同制作している「オウンドメディア風サイトのテンプレート」についてご紹介させていただきましたが、今回はその続き。

MatsuDonald’sさんのリクエストでもあったカラーバリエーション違いのデザインについてお話ししたいと思います。

カラーバリエーションはコレ！

きちんと見えするから、誰でも使いやすい「白ベース」のカラーバリエーション

MatsuDonald’sさんのリクエストであったモノトーンのサイトは、BiND史上（？）一番の真っ白さを誇るテンプレートとなりました。
真っ白すぎて、一見何もデザインされていないようにも見えますが、全てはこのサイトの主役となる「画像」を目立たせるためにあらゆる配慮がなされています。

画像とはもちろんタイル状に並んだ記事の画像のこと。
トップページはBiND Pressでブログ化したインデックス・ブロックで構成しているので、BiNDでページを作らなくてもBiND Pressで記事を投稿すればトップが更新され、記事ページが自動生成されるようになっています。画像より目立つ色をとことん排除し必要最低限の要素を目立たせ、罫線の色にもこだわり、ミニマリスティックさをこれでもかと追求しました。

最初は、ページ上部の「COME ON〜」のエリアをグレーのベタにしていましたが、少しでも色が入っていると、その色のイメージに引っ張られてカスタマイズしにくいサイトとなってしまうと思い、
情報と情報の境目を罫線で分けるという、BiNDのテンプレートでは今ままで表現してこなかったデザインにチャレンジしました。

記事ページもご覧の通り真っ白です！

余計な色がないので、写真の色がグーンと引き立っていますね。
テンプレートは「誰にでも使いやすくあるべき」というのは私も思うところなので、今後このようなモノトーンのテンプレートを増やしていければと思っています。

引き締まったモノトーンカラーで、きれい見え「黒ベース」のカラーバリエーション

BiNDでは、１つのテンプレートにつき３カラバリ提供しているのですが、そのうち２つともがシンプルになりすぎないよう、こちらのテンプレートは、差し色に薄い桃色を入れてみました。これも、MatsuDonald’sさんのアイディア、リクエストでもあります。

こちらは、先ほどのの白ベースのデザインを反転させたデザインですが、ただ全ての要素を反転させてしまうとかえって読みづらい箇所が出てきてしまうので、
瞬間的に目を引きたい、トップページの記事の見出しのエリアは白いままにしました。

こちらは記事ページです。
先ほど、瞬間的に読ませたいところは白にしたと言いましたが、記事ページも読んで欲しいから白くすればいいか、というとまた違います。
私は、モニターの明るさで目がちらついて疲れてしまうので、iPhoneの設定で背景を黒くして記事を読んだりしています。Twitterでも、背景を黒くするナイトモードが選べますよね。
ちゃんと読んで欲しいときは逆に、背景が黒い方がじっくり読めるんです。
タイトルは、もう知ってるはずなので、やや暗めに。それよりもサイトにきたユーザにとって重要度の高い、記事の内容は、文字を白くし、目立たせるような作りにしたり、細部にこだわりました。

■アレンジアイデア
コンテンツをアレンジすれば、たとえば採用サイトとしてもつかえそうですね。

こちらのテンプレートは、「BiND Site Box Vol.25」として発売中！！興味ある方は追加してみてくださいね。

最新の追加テンプレートをチェックする