【簡単】XDでサクッと高クオリティなサムネイルを作成する方法

Creative

今回はAdobeのユーザーエクスペリエンス専用のクリエイティブソフトであるXDを使用して約10分ほどでサクッと高クオリティなサムネイルを作成する方法を紹介します。非常に便利で効率の良い方法だと思うので、是非真似してみて下さい。

ちなみに今回の記事のサムネイルはXDを使い5分程度で作成しました。

XDでサムネイルを作成

まず初めにXDを開いてアートボードを開く時にカスタムサイズにサムネイルのサイズを入力します。
私のサイトの場合604×340に設定しているので、そのサイズのアートボードを開きます。
YouTubeのサムネイルの場合は1,280×720にします。(サイズは自身のサイトのサムネイルサイズに合わせて下さい。)

次にサムネイルで使用する写真をドラック&ドロップでXDに落とします。
そして先程開いたアートボードを覆うように配置して、位置を調整します。

※この時にアートボード内に入ってる部分が実際のサムネイルでの表示になります。

テキストやアイコンを入れていき、色や背景色なども付けていきます。

完成したらファイルのメニューから「書き出し」→「すべてのアートボード」を選び、画像データで書き出して完成です。
今回は604×340のアートボードで作成したので画像サイズもその様になっています。なのでそのままサイト内にアップしても大丈夫です。

サムネイル作成の簡単小技

四角形ツールで長方形のオブジェクトを並べたら各々に写真を入れる事が出来ます。すると下記の様な3つの写真が綺麗に3分割されます。(円形や波模様などにするとまた面白いサムネイルになります。)

テキストや背景を付ける部分は以下のとおりです。その他に影を付けることも可能です。
影をつける場合は「影」にチェックを入れてからX、Y、Bの値を変えて調整していきます。

画像にフィルターをかけたい場合は四角形ツールを画像にかぶせてから色を付けます。その次に下記の部分で透明度を調整出来るので薄くしていくとフィルターがかかった様な画像になります。

下記のツールを使えば次の様なアイコンがたくさんあります。これを画像編集中にアクセントに使えば存在感のあるサムネイルになるでしょう。


以上が「【簡単】XDでサクッと高クオリティなサムネイルを作成する方法」でした。

Photoshopに比べると流石に見劣りしますが、サクッと作るには非常に効率的なソフトかと思います。

また今回やり方だと完全に無料で出来る範囲なので試してみて下さい。

サムネイルの適正サイズを調べる方法は下記。

2020年6月27日CreativeReference,Software,XD

Posted by KT