表現力がワンランクアップ!デザインツール「Canva」解説|応用編

▶はじめに:素人っぽいデザインから抜け出そう!

こんにちは! 就労継続支援A型事業所ONE STEP利用者のしおりぃです!
前回の「基礎編」の記事は読んでいただけましたか?
「意外と簡単そう!」「未経験の自分でもできそう!」と少しでも思っていただけたら、とっても嬉しいです!

前回の基礎編はこちら

基本的な操作ができるようになると「なんだかちょっと素人っぽいな⋯⋯」「もっとパッと目を引くデザインにしたい!」といったところが気になるのではないでしょうか?

そこで今回は「応用編」ということで、デザインが垢抜けるテクニックを紹介します!

実際にONE STEPのSNS発信でも使用している、すぐに使えるテクニックですよ。

この記事を読めば、あなたのデザインが「プロっぽい仕上がり」にワンランクアップすること間違いなしです!

▶テクニック1:文字間・行間を整えて読みやすさアップ!

まずご紹介するのは、全体の見栄えを左右する「文字の間隔」の調整です。Canvaで文字を入力した際に、デフォルトのままだとなんだか引き締まって見えませんよね?

そんなときは、文字を選択して上部メニューにある「高度な設定」ボタンをクリックしてみましょう。

「文字間隔」と「行間隔」をスライダーで細かく調整することができます!

これをほんの少しだけ狭めてあげると⋯⋯

調整前と比べて、キュッと引き締まってスッキリ読みやすくなりました!

しおりぃのこだわりポイント!

文字間を詰めると全体がスタイリッシュで洗練された「プロっぽい雰囲気」になりますよ!

逆に、あえて文字間隔や行間を広げると、おしゃれでゆったりとした雰囲気になりますよ!作りたいデザインの雰囲気に合わせて使い分けましょう。

▶テクニック2:文字のエフェクトでパッと目を引くタイトルに!

こちらの動画のサムネイル、「SUMMER VLOG」の文字が少し見えにくいですよね?

このように背景に写真や模様を入れたときに「文字が背景に紛れて読みにくいな⋯⋯」となったことはありませんか? 

そんなときに活躍するのが「エフェクト」機能です!

文字を選択して、上部メニューの「エフェクト」をクリックします。画面左側に色々な効果が出てくるので、今回は「グロー」を選んでみましょう。

他にも、文字に色付きのフチをつける「袋文字」や、文字の後ろに背景を敷く「背景」など、すべて無料で使うことができます。

文字にうっすらと影がついて、背景のエモーショナルな雰囲気に合ったタイトルになりましたね!

しおりぃのこだわりポイント!

文字のエフェクトは、動画のサムネイルのタイトルで大活躍しています!スマホでスクロールしたときに、一瞬で文字が目に飛び込んでくるような工夫が大切です。

背景の色に埋もれないように注意しましょう。

▶テクニック3:写真を色んな形に切り抜いてみよう!

こちらのドリンクメニュー、文字の配置は揃っていますが、写真がそのまま貼り付けられているので、少し素人っぽさが残りますよね? このように「使いたい写真のサイズがバラバラでうまくまとまらない⋯」となったことはありませんか?

そんなときに活躍するのが「フレーム」機能です! 

まず左側メニューの「素材」から「フレーム」を選択すると、様々な形のフレームが表示されます。今回は丸型のフレームを選択し、デザインに追加します。

次に、切り抜きたい写真をこの丸型のフレームに向かってドラッグ&ドロップします。

しおりぃのこだわりポイント!

フレームを取り入れることによってデザインにまとまりが生まれて、よりプロのような作品に仕上がります。切り取る際は、並べた時に写真の中の主役(被写体)がそれぞれ同じサイズ感になるように調整すると、より統一感が出ますよ!

▶テクニック4:パズルのように重ねる!レイヤーの操作方法

デザインを作っていると「さっき配置したイラストが新しく入れた背景の後ろに隠れて見えなくなっちゃった!」となったことはありませんか?

Canvaのデザインは、いわば「紙を机の上に重ねていく作業」と同じです。

隠れてしまった素材や順番を変えたい素材を選択して、上部メニューの「配置」ボタンをクリックしてみましょう。すると、画面左側にメニューが表示されます。

「レイヤー」という項目をクリックすると、今までデザインに追加した文字や素材が表示されます。重ね順を変更したい物を選択して、上下にドラッグすると簡単に変更することができます。

背景を一番下に⋯⋯と順番を整理してあげると、思い通りのデザインが完成します!

しおりぃのこだわりポイント!

デザインをするときに、ついつい文字や写真が重ならないようにしていると平面的なデザインになってしまいます。レイヤー機能を活用してデザインに「奥行き」を出しましょう。例えば、人物写真の後ろに大きい文字を配置すると、人物が飛び出しているような躍動感のあるデザインになりますよ!

▶テクニック5:動きで視線を集めるアニメーション

最後は、基礎編の終わりでも少しお話した「動くデザイン」の作り方です。

InstagramのストーリーやXなどのSNS発信では、少しでも動きがある方が見る人の目を引きやすくなります。

こちらの広告、まとまりのある夏らしいデザインですが、そのままだと少し味気ないですよね?

動かしたい文字や素材を選択して、上部メニューの「アニメーション」をクリックします。

すると画面左側に様々なアニメーションが表示されます。

無料版でも「フェード(ふわっと流れる)」「ライズ(下からスッと上がる)」「ポップ(ピョコッと飛び出す)」など、楽しい動きがたくさん用意されています。今回は文字に「ポップ」のアニメーションをつけてみましょう!

さらに、アニメーションの種類を選ぶと、下の方に「両方」「開始時」「終了時」というタイミングの設定ボタンが表示されます。これは文字や素材を「いつ動かすか」を決める設定です。

・両方:最初と最後の「両方」で動かす
・開始時:画面が表示された「最初」だけ動かす
・終了時:画面が切り替わる「最後」だけ動かす

今回は、最初のインパクトを大事にしたいので「開始時」を選んで、文字に「ポップ」をつけてみましょう!

一瞬で、動きのあるデザインを作ることができました!

しおりぃのこだわりポイント!
SNSに投稿する動画では、最初の1〜2秒でパッと目を引くことが大事です!

そのため基本的には「開始時」に設定して、画面が出た瞬間に動かすのが効果的ですよ。

全部を「両方」にしてしまうと、画面の中で常に何かが動き続けてごちゃごちゃした印象になってしまうので注意しましょう!

▶おわりに:デザインに「正解」はない!

応用編でご紹介したテクニックはいかがでしたか?

「文字の間隔をちょっと狭める」「エフェクトを付け足してみる」など、数回クリックするだけのちょっとした調整で、デザインは見違えるほどプロっぽい雰囲気になります!

ONE STEPの利用者さんも、日々こういった機能を使って試行錯誤しながら、楽しくスキルアップしています。

デザインには「こうじゃなきゃダメ!」といった絶対的な正解はありません。

人それぞれスタイルもありますし、時代や文化の移り変わりによって、デザインのトレンドや価値観も変化します。もちろん、目的から大きく外れていたり、見る側にデザインの意図が伝わらなかったりしないよう、注意する必要はあります。

完璧を目指すよりも、まずはツールに触れたり、他の人のデザインを見たりして「楽しい!」と感じることがスキルアップの一番の近道だと思います。

ぜひ皆さんも、今回のテクニックを活用して自分だけの素敵なデザインを作ってみてくださいね!

▶就労継続支援A型事業所ONE STEPからのお知らせ

ONE STEPでは、現在見学や体験を随時受け付けております。

「パソコンを使った仕事に興味がある」「一般就労を目指して、スキルを身につけていきたい!」という方も大歓迎です。

スタッフもしっかりサポートしますので、お気軽にお問い合わせください!

最後までお読みいただき、ありがとうございました!