Webデザインのお話 #01

こんにちは、Yuzuです。 パブリックではWebデザインを主に担当しています。 ということで、2回目のスタッフブログはWebについてのお話をしたいと思います。

WebデザインもDTP(紙媒体)デザインも、「ハイクオリティ × 伝わりやすいレイアウト」を重視するという点では同じですが、 動き(モーション)の実装ができるWebデザインでの見せ方はDTPデザインとだいぶ違ってきます。

そんな中「コーポレートサイト」や「ブランドサイト」など、イメージを強く表現したいホームページに適切な動きを付けることにより、 企業のイメージやブランドの価値を大きく向上させることができます。 質感を上げることによってお客さんに好印象を与えることが、企業(ブランド)の信頼度向上にもつながります。

ここで過去の事例を例として少し説明いたします：

1. フェイドインにより、ページの入り方がよりスムーズに：

ガタガタで真っ白の画面からまだ読み込み途中で半分となっている画像や文章がいきなり出されるより、見え方が綺麗でおしゃれな雰囲気になります。

ページの移動と要素(例の場合は画像)の間に時間差を付けることにより、雰囲気が柔らかく、ユーザーの目線も引きやすくなリます。

3. マウスオーバー時の表現：

アンダーバーや透明度を下げるなどシンプルな表現は認識度が高いですが、例のように、マウスオーバー時に該当要素に合ったイメージを出現させることで質感が向上する上、ユーザーにより連想、記憶されやすくなります。

4. メニューの出し方：

スライドさせる方向を変えるだけでなく、出現するタイミングでリンクの文字や画像にも同時に違う仕掛けをすることで、おしゃれ感に加えて、「クリックできる」と気付かせ「してみよう」という意欲を湧かせます。

などなど、その業種やタイプの雰囲気に合った動きを付けることにより、Webサイトの見え方もだいぶ違ってくると思いませんか？ Webデザインの面白い、楽しいことは山ほどです！　「Webデザインのお話 #02」の時にまたお話いたします。

今回の例は2021年1月リリースした「アウテリジェンス」様のコーポレートサイトリニューアルの実績です。 よろしければゆっくりWebサイトの隅々までご覧いただければ幸いです。

【 事例のリンクはこちら 】

焚き火での焼き芋が楽しい秋も終わりに近づいていますね。 新潟の気温もだいぶ下がってきました。 ウインタースポーツを楽しみつつ、クリエイティブな毎日を楽しんで行きたいです。 それでは、 SEE YOU NEXT TIME!