
デザイン初心者が、canvaで、ランディングページを作ってみた3(棒グラフ)
デザインに関しては素人なのですが、最近canvaでサイトのデザインを実験的に作ってみてます!
いつかランディングページを作ってみたく、いきなり全て作るのは大変そうなので、今回はサービス導入後にどのように効果があったかをアピールする箇所のデザインを作ってみました!
canvaで棒グラフを使用したことがなかったので、今回は棒グラフを使用してみつつデザインを模索していこうと思います!
前回の記事
棒グラフの使い方
「素材」から「グラフ」の「すべて表示」を選択します。

棒フラグを選択すると、棒グラフのオブジェクトが表示され、左側の「データ」から該当アイテムの数値を変更するとグラフ側に反映されます。

凡例やラベル、グリッド幅の表示制御は、「設定」から変更できます。

デフォルトは、「系列1」と「系列2」の2軸でグラフを表示していますが、「データ」の「系列2」の列を削除すると、「系列1」のみがグラフに表示されます。

フォントの左側のアイコンを押下すると、グラフのスペースやグラフの丸みを設定することができます。

グラフの周りを装飾していく
色々な企業のランディングページを参考にすると、棒グラフ付近の装飾は、矢印線、グラフ名、増加率(または減少率)が記載されていることが多かったので、それを参考に装飾してみました。

グラフだけだと寂しいので、効果と施策内容を記載
棒グラフだけだと寂しいので、右側にどのような効果があったか?と、施策内容を記載してみました。このパターンもランディングページによく見かけますね。

それと配色は水色とピンクと白にすると、割と簡単にまとまる気がしました!(たまたまかな?)
タイトルは、いつものアイコンと下線作戦です、何も思いつかなかった場合はこれにしておくと無難に整う気がします。
完成版

おわりに
最後まで読んでいただき、ありがとうございます!
「導入後3ヶ月でユーザー登録数50%増加って、一体何をしたんだ!」という感じですが、そんなに効果があるサービスの値段が気になりますね、
(アピール内容の元ネタは、いつもお世話になっているChatGPTに色々アイディアをもらい、まとめています)
今回はグラフの周りを装飾していくのが難しく、苦戦したので、今度他のバリエーションにも挑戦してみようと思います。デザインレイアウトの引き出しが多いと効率良く作業ができそうな気もしますので。
おまけ
最近、ChatGPTを使用し、色々なことを模索しています。
もしよければ、以下の記事も見て頂けると嬉しいです!