Sansan Tech Blog

Sansanのものづくりを支えるメンバーの技術やデザイン、プロダクトマネジメントの情報を発信

DSOCブランドサイトのビジュアルコンセプト

DSOC Creative Groupの山脇です。この度DSOCのブランドサイトをリニューアルしました。
今回は、制作期間のほとんどの時間を費やしたキービジュアルとフォントにこめた想いについてお話しします。

キービジュアル

さっそく本題ですが、キービジュアルは、
出会いの始まりである名刺交換の様子をイメージし、
「白と黒の名刺が交差した」表現から始まります。

f:id:yamawaki0123:20181128122837g:plain
名刺が交差したイメージ


そしてDSOCがSansan株式会社において担っている大きな2つの役割、『DATA』と『RESEARCH』の表現に繋がります。

『DATA』ではビジネスの出会いの情報を
人力と機械の力を融合した独自のシステムにより、
ほぼ 100% の高精度で「出会いのデータベース」を構築しています。

その出会いのデータベースを用いて新たな「出会いの未来を描く」のが、
『RESEARCH』です。

キービジュアルの背景には、文字情報由来の膨大なビッグデータをイメージさせる大量の文字列や数列を配置。
正確性を表現している『DATA』では、規則的な並びと直線的な動きで表現し、『RESEARCH』では、数列や文字列の大きさ、位置をバラバラにし曲線と組み合わせた大きな動きでまだ見ぬ未来、さまざまな可能性を描いていくことを表現しています。

また『DATA』で構築されたものを『RESEARCH』で新しい価値につなげていく様子を、数列や文字列が右(DATA領域)から左(RESEARCH領域)に流れる動きで表現しています。

そして中央に大きく配置した「DSOC」には、
『DATA』『RESEARCH』によって、
出会いからイノベーションを生み出し、
世界中のビジネスを変えていくという強い志を表しています。

f:id:yamawaki0123:20181128121729g:plain
オープニングアニメーション

フォント

今回は文字で伝える情報も多いサイトなので、フォントの選択も熟慮しました。

・英文
可読性が高く文字が認識しやすい、
文字ごとのエレメントがシンプルで視認性が高い Aktiv Grotesk を使用。
世界中で多用されているフォントの一つ、 Helvetica に影響を与えたとも言われている美しいサンセリフ書体。

f:id:yamawaki0123:20181128123042g:plain

・和文
サイトの雰囲気を壊さずなおかつ可読性の高さで Noto Sans を選択しました。
チームの各人の名称だけは 太ゴB101 を使用しています。
文字の大きさと名前という漢字の持つ強さなどからここだけ変更しました。


キービジュアルやフォントの他にもコンテンツや構成、各ページのアニメーションなどにも想いを込めておりますが、それは次の機会があればお話したいと思います。
今後もバージョンアップしていきますので、DSOCのブランドサイトをぜひ訪れてください。

© Sansan, Inc.