Written by MT

近年流行のフラットデザインではベタ塗りのカラーの組み合わせをよく使います。
またフラットデザイン2.0と呼ばれる流行では、グラデーションが見直され、さらに色の組み合わせが自由になっています。
こういった色の組み合わせを考えるのは楽しいですよね。

しかし、今日はあえて色なんて無くてもかっこいいサイトが作れる!
というお見本のようなサイトをいくつか紹介します。

モノクロサイト紹介

comp.jp

完全モノクロと言うよりも、ほんの少し青みがかったグレーを使っていますがそれ以外の色は無し。
デザイン上の色を無くすことにより、写真に少し色があるだけで非常に映えて見えます。

色以外でも非常にシンプルで無駄がなく、見やすく使いやすいサイトです。
サイト名イコール商品名というのも潔さを感じますね。

ウェブサイトを見る

baseq.jp

「BASE Qはイノベーションや新たなムーブメント創出の基点となる交流を目的としたコミュニティ」だそうです。
難しい事言うてはりますね。

起業ロゴ等の変えられない箇所や写真には色はありますが、それ以外はモノクロ。
大胆に取った隙間や、大きく使った写真により寂しさや物足りなさを感じさせません。

トップページの大きな「Q」マークが印象的ですが、写真内にも沢山「Q」マークの実物があり、探すのが楽しくなります。

ウェブサイトを見る

plusgraph-ca.jp

個人事業主向けの経理外注サービスです。

一部ページを除くと写真すら皆無。
完全硬派な文字ベースのモノクロサイト。

文字と配置だけでここまでデザインできるとは圧巻。
コピーライターとデザイナーの意思疎通が凄いのかなぁとか、想像を巡らせてしまいました。

こいうサイトを見ていると、デザイン時に「全然使える写真無いやん!」などと文句を言ってはいけないなぁと反省させられます。

ウェブサイトを見る

nuro.co

コロンビアの腕時計販売サイト。

このサイトではなんと商品写真や動画ですらモノクロです。
実際の商品がこんな色なんでしょう。
ほんまかいな。

と思って下にスクロールしていくと、唐突にカラー写真があります。
なんでここでカラーが必要やねんと思いましたが、腕時計が写真内にあり、ちゃんとモノクロ。
なるほど。

ウェブサイトを見る

jomor.design

カナダのデザイナーのサイト。
これまでのサイトとは逆で、濃いグレーを背景にしています。

マウスに追従する丸の挙動がなかなか面白いです。

海外のサイトを見てて思うのは、フォントが自由でうらやましいですよね。
日本語フォントはGoogle Fontsにもあまり数は無いですし、Adobeやモリサワのフォントサービスなら数は多いんですが、アカウントに紐づいているのでお客さんのサイトではなかなか使いづらいんですよね。

ウェブサイトを見る

まとめ

いかがでしょうか?
色を使わずにデザインするのは簡単なようで難しいです。
写真や適切なスペース、文字の大きさなど細部にわたって気にする必要があります。

今回のサイトなどを参考にして、かっこいいサイトを作っていきましょう!

blog top

Webに関するお問い合わせ、
ご相談はこちら。