sutudio nob-san

web
wasabi

webコンサルティング「wasabi」のコーポレートサイト

ツール
photoshop / illustrator / dreamweaver
技術
xhtml1.0 / css2.1
ゴール
新規顧客の獲得とリピート利用を促し、ブランドイメージ構築する。
問題
ユーザーにいかに認知され、サイト利用につなげるか。
制作期間
50時間
URL
http://studionobsan.jp/works/web/wasabi/
詳細
授業の課題で作成した架空のwebコンサルティング会社「wasabi」のコーポレー トサイトです。
全体として信頼が持てるイメージを目指し、ユーザーの目的に応じた導線を設計しました。
・コラムやセミナー、無料相談会の実施で、興味を持ってもらい、サイトに訪問率やリピート利用率の上昇を狙いたい。

【デザイン全体】

・サイトの性格上、情報量が多くなったりかたくなりがちですが、切り抜きの図や写真を用いたり顔写真を用いるなどのデザインの配慮で実用性の中にカジュアルさを含ませ固さを軽減しました。
・各パーツは同じ役割では同じデザインルールを用いたり要素を連続的に配置するなどで統一感とリズムを意識。
・メインカラーに青を用いているが、無彩色グレーを活用して知的で洗練されたイメージを意識し、顔写真や図の多様で、安心感カジュアルさを意識。

【メインビジュアル】

・コンサルタントの写真を同じ幅で連続配置しリズムを生み出し、顔を露出する事により安心感を一番右の女性の視線が左を向いてい視線が外に逃げず、左に誘導している。
・一番右の女性の視線が左を向いているのでユーザーの視線が外に逃げず、左に誘導している。
・一番左のグラフィックはシルエットでスタッフ全体を想像させ、そのコピーは中央配置・縦書きで視線をすぐ下の左サイドのメニューに誘導。

>> webコンサルティング「wasabi」のサイトはこちら

サービス紹介ページ

このコンテンツの想定ユーザーは新規のお客さまなので 文字だけでなく、イメージやアイコンを活用しwasabiの業務について なるべくイメージをしやすいコンテンツになるように心がけた また、ページサイズが縦長になったので、左サイドに ページ内リンクを設けてユーザビリティの向上を目指した。

>> サービス紹介ページはこちら

サービス紹介ページ

ロゴデザイン

【ロゴマークのフォルムについて】

全体として、アルファベットのQをイメージ。これは、問題解決のキーワードを意識した。 また、Qと同時にサークルのフォルムも含まれ、これは顧客との信頼関係を表す。 中央を横切る曲線は流線型でやわらかく、変幻自在とか、未来を自在につきすすむ、 理想の現実化を意識した。
ロゴタイプでは同じ様なラインを下部に配置してるが、同じ意味を 表し、同時にこちらは安定感も狙っている。
全体としても、繊細さと、同時に流れるイメージをもたせているが、狙いは同じである。 下の曲線は船をイメージ、厚みをややもたせ、心理的に安定感を持たせるイメージ。

【カラーについて】

ブルーは落ち着き信頼性。赤は温かみ、親しみやすさ、情熱、活動的をイメージ。

【タイポグラフィーについて】

セリフでもサンセリフでもない、混沌とした意味をもたせた。モダンで繊細さが 感じられれば、幸いである。 流線型で、繊細なフォルムは、ロゴマークで説明した狙いと同じ。
最後のアイはドッキリマークを逆さにした。これは、気づきやアイデアが湧き出る瞬間 あるはアハ体験をイメージ。
ロゴマークでは、サークルの上半分と一体化してるが、これはつながりを表す。

Page Top

Copyright @ 2012 studio nob-san.All Rights Reserved.