シンプルだけど程よく目立たせるボタンデザインとは?

shunichi shiga
シンプルなボタンデザイン

「ECサイト」や「サービスサイト」におけるボタンは企業の利益や集客に直結する重要な要素なので、「何とかしてユーザーにコンバージョンしてほしい」というクライアントの希望に沿えるようなボタンデザインをしたいものです。ここでは、シンプルでも程よく目立ち、ユーザーのアクションを促せるボタン作りのポイントを紹介します。

ボタンもシンプルデザインがトレンド

シンプルデザインがトレンド

ひと昔前は、「購入する」「資料請求する」といったユーザーにアクションを促すボタンは、シャドウをつけて盛り上がらせた「いかにもボタン」なデザインをよく見かけましたが、最近は少なくなりました。デザインとして洗練されていない、アピールしすぎて逆にユーザーを警戒させてしまうなどの理由で淘汰されていったのかもしれません。
今のウェブサイトのボタンはサイトに溶け込んだシンプルなデザインが多く、単に目立たせるだけでなくユーザーが迷わないようにしっかりと誘導できるナビゲーション性が求められています。

あくまでも「ボタン」であることを忘れないで

ボタンであること

シンプルなデザインを追求しているとただのアイコンになってしまう可能性がありますが、あくまでもボタンであることを忘れないようにすることがポイントです。サイトを訪れるユーザーは、サイトでの商品購入や申込を目的としている人、何度も訪れているリピーター、決断はしていないけれど興味があって閲覧している人、偶然訪れただけの人など様々です。

不特定多数の人がサイトを訪問しますが、コンバージョンにつながるボタンには「特定の人のアクションを促しやすくする」という目的が必要です。単純にシンプルでキレイなボタンを作るのではなく、アクションする可能性が高いユーザーが見逃さずに押してくれるようなボタンデザインを意識しましょう。

要素を注ぎ込みすぎないボタンデザインに

要素の詰め込みには注意

「ボタンであることや目的を明確にするデザイン」もとても大切ですが、はっきりさせすぎると逆効果になる場合もあるので注意が必要です。例えば「このボタンを押すと購入されます。よろしいですか?」という文言と「購入する」という文言では、後者の方がクリックしやすい傾向があります。前者のように長い文章だと、「本当に購入していいのだろうか?」と購買意欲が低下してしまう可能性があります。

このように、ややソフトな印象のボタンにしておいた方が、クリック率が上がる場合もあります。どういう文言がクリックにつながりやすいのか、アクセス解析などのデータを取って、戦略に基づいてボタンをデザインすることがオススメです。コンバージョンに直結したボタン要素の強いデザインと、ワンクッション置いたソフトなデザインの両方を上手に使い分け、ユーザビリティの高いボタンを目指しましょう。

アクションのためのシンプルなボタン

アクションのためのボタン

アクションを促すボタンを作成するには、ユーザーが次の画面を予想できるようにデザインにすることが不可欠です。シンプルなデザインで次の画面を想像させるには、広く使用されている記号やアイコン、文字を活用するのがオススメです。
例えば、買い物カート、メール、フェイスブック、ツイッターなどのアイコンは、今やインターネットをする人の共通認識となりつつあるマークです。このようなアイコンを使うことでシンプルなデザインでありながらもアクションを促しやすいボタンとなり、文字を使用したボタンはダイレクトに次のアクションが伝えられるのでオススメです。

おすすめのボタンデザイン

シンプルで程よく目立つボタンをデザインするコツは、「ユーザーの共通認識」を活用することです。「このマークなら、次の画面はこうだろう」というユーザーの予測から外れない、シンプルなデザインでアクションしやすいボタンを作成することで、コンバージョンもアップするかもしれません。今の主流である「シンプルなボタン」のテクニックをぜひマスターしておきましょう。

関連記事

思わず目が奪われるシンプルデザインの看板を作ろう!

思わず目が奪われるシンプルデザインの看板を作ろう!

街の中にはさまざまな看板があふれていて、どれも色や形、素材など、さまざまな工夫が施されています。カラフルな看板が立てられている賑やかな街では、逆にシンプルなデザインの看板の方が、その中で人目につきやすいこともあります。では、シンプルな看板をデザインするためのポイントを紹介します。   どうしてシンプルデザインの方が目立つのか? 看板は人や建物が集まっている場所に設置されていることが多く、そのデザインは様々です。看板がたくさん設置されている場所では、「カラフルな看板がたくさんあるな」とひとまとめに認識されてしまい、どれも同じような看板だと思われやすくなってしまうので、結果カラフルなのに目立たないということになりかねません。 一方シンプルなデザインの看板は、内容が明確に表現されていることもあり、周囲の看板と差をつけることによって人々の目を引き、注意をひきやすくなります。ただ単に「シンプルであればいい」というわけではなく、掲載されている内容や色使いなど伝えたいことが明確なデザインであることが大事です。   一目で内容がわかる看板づくりを心がける 人が看板を見る時間は、車の運転中で約3〜5秒と言われています。また、歩行者は自分にとって必要な情報しか見ないという調査結果も出ており、ほとんどの人は視界に看板が入ってもその内容までを見てはいないとされているのです。 そんな状態の中では、いかに情報をキャッチしてもらうかが重要となるので、一目見ただけでその看板がどのような内容なのかわかるようにデザインする必要があります。 わかりやすいシンプルなデザインにするためには、内容を1つに絞り込むことがポイントです。例えば企業の認知度を上げたいという依頼ならば、極端なことを言えば、その企業の会社名やロゴを掲載するだけでも十分です。ただし、ロゴだけとは言っても、ロゴの色やフォント、余白のバランスなどを考えながら、より広告として効果的なデザインにする必要があります。   ムダなものを省いて必要最低限の情報を載せる 看板にはたくさんの情報は必要ありません。前述したように、人が看板の内容を捉えるのはほんの一瞬です。たくさんの情報を載せたところで、そのすべてを捉え切れるはずもなく、それどころか一体何を伝えたい看板なのかさえわからなくなってしまいます。 看板というメディアの役割は、人により詳しい情報を伝えるためにあるのではなく、見た人にインパクトを与えることで興味をひくためのツールとして使われることが多いです。クライアントから得た多くの情報の中から「絶対に必要」と判断した情報以外を削除していき、内容や見た目をよりシンプルにすることで、効果的で印象に残る看板に仕上げていくことができるでしょう。   街の景観に配慮した色使いで印象づける 看板や屋外広告を制作したことがある方なら、少なからず「マンセル値の制約」を受けたことがあるのではないでしょうか?1905年にアルバート・ヘンリー・マンセルさんによって考案された「マンセル・カラー・システム」では色を、色相、明度、彩度の三属性に分類しています。現在日本国内で、景観を損なわないために、看板デザインに対してこの三属性に規定を設けている自治体が増えてきています。 「目立つ色を使いたい」とデザイナーが思っていても、看板を設置する場所によってはその色が使えないことがありますので、事前に各自治体のホームページなどで調べておくのがオススメです。 シンプルな看板は、「看板を見る人の立場や心情を想像しながら、より効果的にデザインする」ことが大切なポイントとなります。また、「いかに多くの情報をわかりやすく簡潔にまとめられるか」という面でデザインの訓練にもなるので、ぜひ積極的に挑戦していきましょう。

シンプルに仕上げたLPのデザイン参考例

シンプルに仕上げたLPのデザイン参考例

元々はユーザーが最初にアクセスしたウェブページの事を意味したランディングページ(LP)ですが、インターネット広告業界では専ら、バナー広告などのリンク先にある、長めの1ページにまとめた商品やサービスの売り込みを指しています。 その大抵のページにはキャッチコピーや口説き文句があふれていますが、最近ではシンプルに決めたものも登場してきました。そんな時代を先取りするLPをご紹介しましょう。 こんな依頼ならシンプルなデザインに キャッチコピー、ベネフィットフレーズ、利用者の声といった、LPのお決まりの言葉を盛り込んで、極太ゴシックや補色などを使って派手に作ってほしいという従来のLPを要望されたら、それに従うしかありませんが、そのようなLPも飽和状態なので、シンプルデザインが合う内容であれば、違った提案をするのも一つの手です。 例えば、銀行や証券会社のような信用第一の業種なら、あまり美辞麗句を書き立てるのも逆効果なので、簡潔かつ的確にまとめたいものです。 また、サービスに絶対的な自信があるものは、それをさりげなく披露すると、必ずや説得力を持つ事でしょう。 シンプルなデザインで気を付けたい点は? いくらシンプルにすると言っても、文章や画像を単調に並べただけではデザインに失敗していると考えざるを得ません。フォントはベーシックなものが良いですが、その大きさや太さでメリハリを付けましょう。 また、画像も1枚をベタッと貼り付けるのではなく、説明で欲しい所に貼るという必要性を熟慮するべきです。 そして、それらの配置は、「これはこんな事ができて、その成果はこんなふうで、こんな感想が届いています」といった物語を感じるものにすると、読み進める気を起こさせるでしょう。 シンプルなデザインのLP例 成功例を見ると、シンプルデザインがより良く理解できると思います。 ドローンを使って、空撮を行ったり環境をモニタリングする会社のLPです。サービスを簡潔にまとめ、一番の関心事である写真の出来を明確に提示しています。 また、使用するドローンは、良く知られているDJIのファントムではなく、上位機種のインスパイアである事を強調したデザインです。 イギリスの不動産業者向けにデジタルマーケティングを伝授する会社のLPです。信頼を感じさせる緑色を取り入れ、スタイリッシュに仕上げています。 SNSなどと連動して街に出ている友人を探す事ができるアプリのLPです。一目で理解できるアイコンを作って、このアプリが何の役に立つのか、どんな動作をするのかを端的に説明しています。 企業や個人投資家向けのベンチャーキャピタルファンドのLPです。要望した色はブラック、そして、プラチナとホワイトでしたが、ブラックはそのまま使うと信頼感を損なうため、グラデーションにしています。 オランダを中心とした求人広告会社のLPです。企業の人事向けに、優秀な人材を集める方法を解説する教材を、分かりやすいインフォグラフィックで説明しています。 ペットと死別した人のために、その遺骨を収める壺を販売するデザイナーのLPです。最小限の言葉が説得力を増しています。 持ち家、借家に関わらず、省エネを目指す人に指南する電子書籍のLPです。白熱球や蛍光灯よりもLEDという誰でも知っている省エネの方法を提示しているので、見ただけで内容を理解できます。 WordPressを使ったサイトを最適化するサービスのLPです。大きく描いたバロメーターが、あっと言う間に心配事を解決してくれるような印象を与えます。 デザイン by Infinity デザイン どんなに口説き文句を並べるよりも、簡素な言葉や単純な画像のほうが力を持つ時があります。それらはもちろん、人々の関心を引くものでなくてはなりません。 依頼内容からその核心となる部分を見出し、是非シンプルなデザインへと昇華してください。

シンプルなステッカーで人を引き付けるには

シンプルなステッカーで人を引き付けるには

ステッカーは、色々な企業で使われる販促ツールの1つです。企業の特色が強く出るためブランドアピールにはとても効果的で、収集家も多いのが特徴といえます。 カバンやスケートボード、スノーボード、PCや手帳など様々な場所に貼られ、愛されるステッカーの多くはシンプルである傾向が強く、それを貼ることで好みを主張できるものである場合が多いです。今回は、シンプルでありながら人を惹きつけ愛されるステッカーを作成するコツをご紹介していきます。   ワンポイントで作るシンプルなステッカー ステッカーの中でもポピュラーなワンポイントステッカー。こちらは企業ロゴやブランドロゴ、アニメキャラクターなどをモチーフに、1つの絵や模様でシンプルにステッカーを作る方法です。このワンポイントステッカーの優れた点は、どんな絵や模様でも違和感なく作成できる点です。ノベルティや企業の配布物で配られるステッカーで一番多いタイプでもあります。 また、アイキャッチが良く手にした人が気軽に貼ることが出来るため、宣伝効果も高く人の目に触れる機会が多いのも特徴の1つです。   装飾を削ぎ落としすぎないシンプルなデザイン ワンポイントのステッカーがあれば、色々な情報を盛り込んだステッカーも存在します。そんな様々な種類の中で手にとってもらうためには、シンプルな装飾であることが条件の1つと言えます。しかし、あまりにシンプルすぎると、今度は伝えたい情報が不十分だったりちょっと物足りないデザインになってしまう場合があります。そうならないためにも、「絶対に削ってはいけない情報」を先に決めておく必要があります。 模様1つでステッカーを制作することでシンプルさを演出できます。しかし、そこに文字を当てはめることでよりステッカーとしての魅力が増す場合があります。文字と模様や絵柄のバランス、色、大きさなど考慮したうえでデザインすることで、伝えたい情報が盛りこまれたシンプルかつスタイリッシュなステッカーを作ることができます。   ステッカーチューンを考えてシンプルなデザインへ 実際にステッカーを貼る人たちの特徴として、自分好みの作品に仕上げたいという方が多く存在します。このステッカーを貼ることで自分独自の表現をすることを、ステッカーチューンといいます。周りからは適当に貼っているように見えるステッカーも、実は色や全体のバランスなどを熟考して配置されている場合が多いです。つまりデザイナーは人の手に渡るところまでではなく、渡ったあと、どういう場所に貼られ、その場合どういう見栄えになるのかをイメージしながら制作する必要があるということです。 有名人でも私物などに貼る方も多く存在し、その人たちが使用する事でとてつもない宣伝効果を生みます。実際に制作してみて物に貼った時にどういう風に見えるのか、どういう印象を与えたいのかをしっかりイメージし、デザインに起こしてみると実際に使用される頻度も高まるでしょう。   フラットデザインでシンプルなステッカーを Webデザインなどでよくあるフラットデザインの技術を、ステッカーでも利用することができます。 文字や絵柄を一緒に入れたいとき、注意をひいて何かを訴えたいときによく使われます。このフラットデザインの特徴は、色々な表現を1枚に収めシンプルに見せることが出来る点にあります。他の形式ではごちゃごちゃしてしまうデザインも、フラットデザインにすることですっきりしたシンプルなデザインにまとめることができます。文字や模様、絵柄など色々取り入れたいときに是非とも試してみてください。 今回、シンプルでありながら人を惹きつけるステッカーの種類と制作のコツをご紹介致しました。実際に貼られた際のイメージや他のステッカーと合わせた時のことも考慮するとより良いデザインが仕上がると思います。また、伝えたい内容をシンプルにまとめることで、人をひきつけ手にとってもらいやすくなることでしょう。是非ステッカー作りの際の参考にしてみてください。

最新のデザインコンペ

デザイナーとしてステップアップできるお仕事をご用意しています。
0%