サイトレビュー No.08
こんにちはあいめいです。
本日は株式会社ステラキャスティングさんのHPをレビューさせていただきます。
■会社概要
キャストのキャスティングからイベント企画・制作・運営までを行う会社。
■ターゲット
商品宣伝のCMに大手のホリプロ所属のタレントを起用したい企業。
集客を狙ったイベントへのタレントの出演をお願いしたい企業。
■ゴール
CMなど宣伝へホリプロタレントのキャスティングにつなげる。
■サイトの構成
TOP
COMPANY
NWES
WORKS
RECRUIT
■ファーストビュー
・鮮やかなブルーの背景に会社ロゴが画面中央に下からフェードインしてくる。→会社の名前が強く印象づく。
・メインビジュアルはグループ会社のホリプロ所属のすごく有名なタレントの写真がスライドで切り替わりで表示される。→誰もが知っている有名タレントばかりでインパクト大。信頼感も出る。
・タレントの写真が切り替わる時に左下に名前を英文で表示。
・会社のコンセプトを日本語と英文で表示。
・ナビは画面は横幅いっぱいではなく独立したデザインで影をつけて立体感が出ている。
・ナビメニューは左端に会社ロゴがあり右端にホリプログループのロゴマークがある。→ユーザーがホリプログループと一目でわかり安心感が生まれる。
・コンタクトは背景色がついてすぐにお問い合わせできるように目につきやすい。
・ナビはスクロールで追従してくる。
SP
・ナビは左端にロゴ右端にハンバーガーボタン。ハンバーガーボタンを押すとぶわっと画面いっぱいに広がりメニュー部分は上からスライドしながらおりてくる。→真似したい動き！！
■全体
・背景に小さなドットをつかっている。ベタ塗りの背景より奥行きを与えていると思う。ファーストビューは半分はブルーのベタ塗り背景の部分やボタン部分には影をつけることでより奥行きがあるように見える。
・ボタンやWORKSのコンテンツ部分は周りに影をつけている。WORKS部分は押すと写真がズームアップ・影が消える動き。
・各セクションのタイトルはゴシックの太めだが色が薄いブルーにしていて文字感が少し広くとられているので落ち着いた知的な印象を与えていると思った。
・テキストの文字は小さめだがフォントカラーがブルーなので目が痛くならない大きさで読みやすいと思った。
・セクションごとに背景色をグレーにしたりすることでドットカテゴリをはっきり区分けしているのがわかりやすい。
・NEWS部分は各項目ごとの上下余白が広くとられている。余白が大きいので中の文章がはっきりと逆に目立つようになっている。
・footerは紺色でかっちりした印象。白から紺に激しく変わると浮いた印象になると思うがfooterの前のコンテンツで写真に紺色を透過して重ねることで違和感がないく色の変更をしていると思った。
・footerのお問い合わせとプライバシーポリシーはボタン風にしてユーザーにすぐにわかるように他のフッターメニューと差別化している。
■フォントとカラー
フォント
英文：Renner
日本語：Noto Sans JP
カラー
メインカラー：#254FBC
ベースカラー：＃FFF
アクセントカラー：#E0DDDD、#091E38
■学び
メインカラーを中心に濃さを変えたりすることで統一感がでて会社のイメージを損なうことなく色を変更している。また、グラデーションを使うことでボタンはベタ塗りだとのっぺりした印象になるが立体感が出る。背景にドットをつかったりコンテンツに影をつけることで奥行がうまれる。
文字間隔を広く開けることでゴシック体でもかっちりした男性的なイメージではなく知的な女性的なイメージになることがわかった。