活用方法

デザイン紹介 - 矢印|存在感は期待度と比例する

Squad beyondの機能の中でも、特に人気なWidget。ブロックやパーツ単位のデザインパーツで、少しの調整で誰でも同じクオリティでLPを作成できます。今回は修正なしで誰でもすぐに使える「矢印Widget」を紹介します。


今回教えてくれたのは

Shihori Nakaide

- BizOps チーム
- Assistant Manager

2021年2月よりSIVAにJoinし、CXチームで活動。ユーザーからのお問い合わせの解決やチームリーダーとしての役割・ユーザーに合わせた機能活用の提案・コミュニティの運営・オフ会の実施などを務めており、大手広告代理店の動向に関する知識を豊富に持っている。

スクリーンショット 2023-07-05 12.04.38

 

 

目次

01 離脱の原因は矢印の使い方かも?
02 誰でも本当に「1クリックだけ」ですぐに使える
03 矢印のデザイン 4選
04 まとめ

 

 

01|離脱の原因は矢印の使い方かも?


矢印の存在感は、ユーザーの期待度を示しています。目立つ矢印を目にすると、ユーザーは自然と「これから驚くべき情報が続くのではないか」と期待を膨らませます。だからこそ、大きな矢印の後に続く情報が期待に見合わないと、ユーザーは大きな失望を感じ離脱をしてしまいます。逆に、後続の情報が特に強調するほどのものでない場合、控えめな矢印を選択することが推奨されます。

つまり、LPの矢印デザインは、ユーザーの心理を操作する力があるのです。

 

▼ 控えめな情報を提示する時の矢印

503489b5c6ed0fb35c1cc6d6c941b5bc


 

▼ 注目を集めたい時の矢印

cd1628700514417d0f0df05bdadd4bfa

 

 

02|誰でも本当に「1クリックだけ」ですぐに使える


 

aac53c3b05824f02e0ffb5af0c933ec3

1 Squad beyondの管理画面にログインし、beyondページを作成
2 Widget管理 > Widet名 を検索し、Widgetを追加
クイック編集をクリックし、文字を入力して完了

 

Squad beyondでは、800種類以上の「Widget」というLP制作パーツを提供しており、これらを組み合わせることで簡単にLPを作成することができます。中でも矢印のWidgetは、HTMLやCSSの修正が不要でそのまま使うことができます。LP制作初心者・Squad beyond初心者でも挑戦しやすいデザインなので是非お試しください。

※下記に紹介しているもの、全てbeyond初心者さんにオススメです!

 

 

03|矢印のデザイン 4選


 

logo (1)

下へ動く矢印

/ Widget名

3bdf839825fa6b6791ce55a6f7ae56a7


logo (1)

下へ続く・・・

/ Widget名

6f60d04e1a850b5dfb445c00ff678d7d


 

logo (1)

矢印(上から下へ流れる)

/ Widget名

f8ceae08179e3fa0c7ce8a6fb24f8407


logo (1)

矢印2(上下に動く)

/ Widget名

5ed7ad4bb0a5a70c1c9bdc28a38ca75f


 

 

 

04|まとめ


矢印のデザインを上手く利用することで、ワンランク上の読みやすいLPを制作することができます。特に矢印のWidgetは、誰でも1クリックだけで今すぐ使えるデザインですので、積極的にご利用ください!修正方法を相談したい場合は、https://service.squadbeyond.com/voice/ よりお尋ね下さい。

 

 

▼関連記事

ブログCTA案

2

 

Squad beyondのご利用には、アカウント開設が必要です。

デモを依頼する

お好きな時間を選んで、どんなことでもお気軽にご相談ください。
(商談の設定、お見積もり依頼、サービスの簡単な説明 など)

 

Similar posts