にぎやかデザイントレース記録

最近、にぎやか系LPのトレースをしていました。
そこでトレースの気付きをまとめてみたいと思います。

 

切り抜きと背景がなじむようにデザインする

にぎやかなLPデザインの傾向として、画像を切り抜きで使っていることが多かったように思います。
その時に、切り抜いた画像が浮いて見えないように、その色を使ったり、その画面の空間に置いてあるようにすることで、違和感なくにぎやかな印象を作ることができると感じました。
例えば液体系だったら、このように表現していたり

モノ・人だったら画像を複数使用して、新しく一枚のものとして成立する構図を作ってみる、といった表現を見かけました。

枠にイラストを使用してみる

ほとんどの要素の枠がイラストを用いて表現されていました。
木の枠や掲示板風など、そのLPの題材に関するものやイメージなどで作られていました。
枠をイラストで表現する場合、そのまま枠を書き出してしまうとサイズが固定されてしまって、中の文章量に制限が出てしまいます。そのため、書き出すときは上部・コンテンツ部分・下部で書き出していました。このようなやり方でレスポンシブ対応時にも困らないイラスト枠を表現していました。

1つのパーツに3つ以上のあしらいをかけてみる

1つのパーツに3つ以上の要素が組み合わされていることも多かった印象です。
例えば、『フレーム』×『イラスト』×『文字』がひとつのカタマリとして表現されていました。
一番目立たせたい部分に添える形で、あしらいとして別の要素を組み合わせることでにぎやかな印象を与えていました。
図にすると、このような感じになります。

文字もあしらいとして使うことで、印象がとても変わるんだなと思いました。

イラストを活かしたアニメーションをつける

横に移動する単純なアニメーションでも『ベルトコンベアー風のイラスト』で使うと、ベルトコンベアーが動いているような印象にさせているサイトなどがありました。
単純ににぎやかそうなエフェクトをつけるのではなく、その要素が動きそうな動きを付けることで、より印象に残るアニメーションが表現できると感じました。

私の職場では、業務でこういったにぎやかなデザインを頼まれることが時々あります。
でも機会がとても少ないので、引き出しがあまりに少なく、完成したものを見ると違和感のかたまり……といったことがありました。今回にぎやか系のデザイントレースをしてみて気付いたことをしっかり活かせるようにしていきたいと思います。