その他

2023.12.22

文字の動きを考える

こんにちは!デザイナーのH.Abeです。

生活をしていると読みやすい文章、情に訴えるような文章など様々な文章に出会います。

本や新聞などの手に取れるものは「どんな状況でも形態は一定」なので、読み手の性格・状況によって印象は変わりますが、

Webサイトは「状況で形態を変えることができる」ので、どんな方でも一定の印象を与えることができるのではないでしょうか。

今回は、文字の動きについて考えてみます。

文字が強制的に流れる

PERFECT DAYS : https://www.perfectdays-movie.jp/?days

こちらはPERFECT DAYSという映画の「Days of HIRAYAMA」というコンテンツです。

本映画の主人公である「平山」のなんてことない日常を文章で読むことができます。

なんてことのない日常なので文章は単調でゆっくりと流れています。

文章は強制的に流れる仕様になっており、置いていかれないようにとついつい没入してしまう仕掛けが見事だなと思いました。

また、しっかりと見える範囲の前後は明瞭度が下げてあり、時間の前後関係を感じる演出がされています。

特に見てほしいキーワードに印がつく

株式会社Morght:https://morght.com/

寝具ブランド「NELL」を展開する企業のホームページです。

ファーストビューから手書きの文字がとても印象的なデザインです。

見せ方として、キーワードとなる文字に丸がつく動きがとても印象的で、親切さを感じました。

目立たせる方法として、「文字色を変える」や「フォントサイズを大きくする」など様々ありますが、やはり動きは一番目がいく技法なのではないかなと思いました。

文字の種類によって見せ方は変わります。

その文字には「どのような役割があるのか?」「どのように見せると効果的なのか?」を意識したいと思いました。

この記事をシェアする

関連記事

  • 2024.03.22

    Webデザインにおけるアニメーションについて考えてみた〜実例編〜

    その他

  • 2024.03.12

    Webデザインにおけるアニメーションについて考えてみた〜メリット・デメリット編〜

    その他

  • 2024.02.02

    Webデザインにおけるアニメーションについて考えてみた〜目的編〜

    デザイン

    その他

おすすめ記事

  • 2022.05.31

    超簡単!GoogleMapの色をサイトにあわせて変える方法

    コーディング

    制作

  • 2021.09.29

    【簡単】プロのようなデザインが作れるツールCanva(キャンバ)のおすすめポイント

    デザイン

  • 2022.04.12

    Chromeで画像やテキストがぼやけるときの対処法

    コーディング

    制作

×