NEWS & COLUMN
お知らせ・コラム
SCROLL
DESIGN
ポップで遊び心のあるWEBデザイン4選
2022
.06.02
若者向けのイベントや、子供向けの製品を取り扱う企業サイトでは、ポップで遊び心のあるWEBデザインが人気です。遊び心のあるWEBデザインは、ユーザーに興味を持たせ、ホームページの隅々まで見たくなる為です。今回はポップで遊び心のあるWEBデザインを4つほど紹介します。
【目次】
1. POPなWEBデザインについて
2. POPで遊び心のあるWEBデザイン4選
a. のんほいパーク
b. BE FES!!
c. STOCK market
d. 筑紫AMゴシック
3.今回のまとめ
ポップなWEBデザインについて
ポップなWEBデザインでは彩度が高く、はっきりしたトーンの色を使用されることが多いです。また、使用される色数も多いため、カラフルな印象となります。
使用される書体は線の太いゴシック体を用いることが多いです。丸みを帯びているフォントを使用することで、子供向けの印象を与えることができます。また、文字に装飾を組み合わせることで賑やかな印象となります。
背景にはドット柄やストライプ柄などを使用することが多いです。
写真も四角で配置するのではなく、モチーフの形にトリミングし、ホームページ全体でリズムを作り出すことで、元気な印象を持たせることができます。
ただし、ポップなWEBデザインでは要素が多くなりがちなため、要素の配置方法に気をつける必要があります。
ポップなWEBデザインは、イラストを動かすなど、アニメーションとの相性も良いため、適度に取り入れポップさを演出しましょう。
POPで遊び心のあるWEBデザイン4選
ここからは、ポップなWEBデザインを制作する際に参考になるホームページを5つ紹介します。若者向けのイベントホームページや、子供に向けたホームページを制作する際に参考にしてみてください。
のんほいパーク
のんほいパークは愛知県豊橋市にある動植物公園です。特に子供のいるファミリー向けのこのホームページでは動物のイラストが数多く使われており、元気で明るい印象を受けます。動物が軽快に動くアニメーションも取り入れられており、ユーザーが飽きない工夫も施されています。ロゴタイプのオレンジをメインカラーとして使用し、彩度の高いカラーをいくつも使用しています。装飾要素の多いホームページですが、情報は見やすく整っており、ユーザーの利便性も考慮されているホームページです。
のんほいパーク:https://www.nonhoi.jp/
BE FES!!
若者向けの音楽フェスのホームページです。ロゴには鮮やかなオレンジとブルーが使用されており、元気で爽快なイメージがあります。まるで音楽に乗って動いているかのように、軽快に動くメインビジュアルのイラストも、フェスに行きたくなるようなワクワク感をうまく演出しています。彩度の高いカラーであっても、白の背景をベースにしてすっきりと見せる事で、子供っぽくなりすぎていないところも参考にしたいポイントです。
BE FES!!:https://www.beams.co.jp/special/befes/2022/
STOCK market
落ち着いた印象とポップさを両立させたホームページです。落ち着いたネイビーのカラーを全体で使用していますが、元気な印象を受ける大きな文字を使用し、どこか子供らしさを感じる印象のホームページです。手書きのようなイラストがホームページ内の随所に現れ、ユーザーを飽きさせない工夫がなされています。画像の使い方においても、あえて斜めに配置することで、ポップな印象を演出しています。
STOCK market:https://stock-ygg.com/
筑紫AMゴシック
「筑紫AMゴシック」というフォントの紹介ホームページです。画像の多いホームページですが、ホームページ内で紹介している筑紫AMゴシックは丸みを帯びたポップで柔らかい印象を受けるフォントのため、ホームページ全体でポップな印象を受けます。ホームページで使用されるフォントが大きく印象を変えるのが分かります。
また、彩度の高いオレンジみを帯びた赤からもポップな印象を受けます。
筑紫AMゴシック:https://fontworks.co.jp/special/tsuku-am-gothic/
今回のまとめ
今回はポップで遊び心の感じられるWEBデザインを4つ紹介しました。最後に紹介したホームページのように色やイラストだけでなく、使用するフォントもポップさを演出する大きな要因となり得ます。ポップなWEBデザインを制作する際には、ホームページ内で使用する色やイラスト、背景などだけでなく、使用するフォントにもこだわる事をおすすめします。
またポップなWEBデザインを制作しようとするあまり、装飾が多すぎて見づらいホームページになってしまう可能性があります。ポップさを演出することも大事ですが、情報が見づらくなっていないか気をつけながら制作するようにしましょう。