kanvasリニューアルのデザインや仕様のご紹介

これまでkanvasは名称を「KANVAS」と大文字で表記していました。今回のリニューアルでは心機一転、小文字表記への変更を行いました。

小文字にすることで「k」だけがXハイトから飛び出し、それにより「グロースハック」や「成長」の意味を表現しています。フォントは小文字の「k」がボディサイズいっぱいに伸びる「Futura」を使用しました。

kanvasとは「キャンバス」の事です。トップページのメッセージで伝えている「真っ白なキャンバスに夢を描くこと」が、kanvasの名前の由来です。

キャンバスから連想する色は、やはり「白」です。ベースカラーに「白」と、レイアウトを分ける目的で「薄いグレー」の2色を使い、アクセントカラーにベーシックな「黄」を使いました。

デザインの印象をまとめる上で、今回は「線」を使いました。メッセージにある「曲がり、重なる、その線は、次第に形を描きます。」の線です。

1pxの黒（#000）の線で、角が立たない様にラウンドさせています。トップページのラインアニメーションから、アイコン、各レイアウトを示す右上の縁にも線を使いました。

PCサイズでは画面全体を大きく使いつつも、スマートフォンでの読みやすさにこだわりました。PCサイズの時、段落の幅が広すぎると読みづらくなる事を考慮し、タブレットサイズ時までは左サイドに余白を設けました。

今回は、デザインカンプを一切作らず、全てのページをインブラウザでデザインしました。それにより、左右中央寄りのデザインから脱却し、各ブレイクポイントで効果的なレイアウトを取ることができました。

業務上、デザイン制作を行うので、制作物の偏りを避けるために「あえて無個性な印象」を意識しました。本当はアースカラーもkanvasに似合う配色かなぁ、など…

近接・整列・強弱・反復はもちろん。読む箇所や、見る箇所。装飾的な表現と、読みやすさの棲み分け。サイト構造の分かりやすさ。ユーザーの導線。たくさんたくさん考えて作りました。