TRPGサムネイルシリーズ記事系列
作例
バディキャンペーンシナリオ集『Dirty Pair』【DX3rd】
※ 本作は、「矢野俊策」「有限会社ファーイースト・アミューズメント・リサーチ」及び「株式会社KADOKAWA」が権利を有する『ダブルクロス The 3rd Edition』の二次創作物です。(C)矢野俊策/F.E.A.R.
使うツール(Canva)
Canvaを使いますが、
パワーポイントや他ツールでも可能!
簡単にコラージュして画像を作る系のツールならOK
ツールは、
いつも通りCanva使うよー
有料使っているけど、
ソシャゲの課金的な恩恵が
あるだけだから
無料でOK!
4PLのサムネイル:流れ
シナリオの雰囲気確認
サムネイルを見て「楽しそう!」と思った人が
「思っていたのと違う!」となることの防止
概要欄を読んで、雰囲気を作る!
4PLは人によって、
スタイルが違うけど、
どんな感じ?
Dirty pair概要より
第一話「Code Magenta【紅紫法典】」PC①…自他共に認める天才チルドレン
PC②…最年長の落ちこぼれエージェント
若者達の間に奇妙な噂が広まっている。
──【紅紫法典】。
目にするだけで願いが叶う紅き文字。
その内容は悪戯ともとれる不可解なものだった。
任務に赴く彼らに、その正体はまだ解らない。
チルドレン・若いエージェントばかりが集う少々子供に過保護なUGN小佐古支部にて、
天才と謳われるPC①は同年代のライバルとの賭けもあり初めての任務に胸を躍らせる。
そんな中、ペアを組めと言われた相手は
……くたびれたエージェント・PC②だった。
第二話「Cobalt Plan【蒼蒼計画】」PC①…他を寄せ付けない孤高のエリートエージェント
PC②…最終兵器として隠匿されてきた、謎のレネゲイドビーイング
UGN武上支部内の空気は焦燥に包まれていた。
早急に手を打たねばならない、どんな手段をもってしても。
そして、ある一つの任務が下されることとなる。
それはこう呼ばれる。──【蒼蒼計画】と。
孤独に任務を遂行するUGN武上支部きっての実力者・PC①。
今までもこれからも一人で充分であるというのに、
一体なぜレネゲイドビーイングなどと行動しなければならないのだろう。
隣町から波及し未だ止まることのないジャーム化事件の解決のため、
PCは調査を開始する。第三話「Perfect Gray【曖昧十全】」
PC①②…UGN小佐古支部に所属するチルドレンとエージェント(マジェンタ組)
PC③④…UGN武上支部に所属するエージェントとレネゲイドビーイング(コバルト組)
二つの街で起きたジャーム化事件が、隠匿されつつあった。
そんな中、UGN小佐古支部に1件の通知が届く。
PCは支部長の意思を背負い、武上町へと向かう。
ダブルクロスの2ペアもの。
メインPCとサブPCがいるスタンス。
①②でコードマジェンタ
【紅紫法典】って
シナリオを行って
うんうん
そっから、③④で
コバルトプラン【蒼蒼計画】を行う
その後に合流って感じ?
そうそう、
最後は
パーフェクトグレイ【曖昧十全】って
シナリオで4人集まる。
本来は紅紫法典①②と、蒼蒼計画①②が
①②③④として改めて行く流れですが、
便宜上、PC①~④にしています。
……と言っても、
今回はDirty Pairとしての
赤と青を基調とした
サムネイルを見たい。
確かに、
立ち絵も色合いが赤青だから
原色強めな色にしても
行けそうな気がする
それなら幸い。
使うツール(Canva)
Canvaを使いますが、
パワーポイントや他ツールでも可能!
簡単にコラージュして画像を作る系のツールならOK
ツールは、
いつも通りCanva使うよー
有料使っているけど、
ソシャゲの課金的な恩恵が
あるだけだから
無料でOK!
立ち絵仮置き
立ち絵をざくっと置いて、
場所や立ち位置決めをします。
PC番号順になることが多いですが、場合によっては変更することも◎
今回はダブルクロスのシナリオをお借りしているので、
PC1を前にする配置にしています
ぱぱっと置いてみたけど、
こう?
かなりいい感じ!
横文字のタイトルだから
中央余白って埋められそう?
…なるほど?
じゃあ、こう?
–
–
–
–
–
…あー……。
–
ペア、変ったな…?
私もそう思った。
–
うーん、余白埋めつつ、
二人の繋がりをー……、
–
–
–
–
こうかな?
元鞘に戻った感
よーし!
ダブルクロスなので、とりあず裏切りを意味する言葉を入れてみる
入れたいので、入れました。
中央の区切りを
誤魔化したい
――ダブルクロス、
それは裏切りを意味する言葉
って
入れてもらえるか?
はいはーい
–
–
–
–
閑話タップで開く:湧いて出てきたので格納しております
ダブルクロスだ。
湧いて出たな
–
今出てても
ノイズだし
ジャームだと思うから
すぐに帰る
私の応援は
全然来ないのに
そっちだけ2人も来て、
ずるくない?
人徳あげろ
ふふん、かれかって
放置すると可愛いから
皆で可愛がってるだけ!
じゃあねー
……お、おう…。
文句言う前に、消え去った…
–
タイトルロゴを入れる
タイトルロゴが入る余白がある為、入れてみる
丁度上の部分に
タイトルロゴ入りそうだね?
なら、頼んだ。
!!!!
……ッ、頼まれた!
–
–
–
–
格好良いかよ
いいね、
これすごくいい感じ!
背景を付ける
コードマジェンタと
コバルトプラン混ぜた感じの
サムネイルが良いから、
赤・青って行けるか…?
–
–
–
まあ、明度とか彩度合わせりゃ
なんとかなるか
明度とは色の明るさの事で、
明度が高ければ”白”に近づき、低ければ”黒”に近づきます。
彩度とは、色の鮮やかさのことで、
彩度が高ければ”ビビットな色”となり、
低ければ”白、黒、灰色”(無彩色)となります。
説明引用元&見本が載っている例↓
思ったより、
詳しい…
…あー、
これ詳しいになるのか。
もうちょい普通な対応がしたい
生徒役だからって、
そこまでしなくていいよ!
助かってるしねー
–
–
プラン1!
原色原色しないように、
だんだん暗い色になる背景で
調和していく感じかな?
中央の区切りって、
目立ちそうだな?
どうだろう、
とりあえず敷いてみる…ね!
–
–
–
–
–
–
いや、気にならないな。
格好良いサムネイルだろ、
これ
これこれこれ、
格好良いよね!
余白気になる部分あっけど、
まだPC番号とか書いていないから
むしろ、正解って感じ
PC番号などを入れてみる
感覚的にそれっぽいところに置いていますが、
①「顔周りが目立つ」ので、胴体あたりにPLなどを配置
②横向き文字の方が読みやすい
③余白や配置によっては縦向き文字を選んでも〇
④HOやPC概要は余白埋め・添えるだけ要素寄り
の意識で置いています。
よーし、
PL付けるね
そうだな。
で、PLの近くに
PCの説明をを入れて、
余白を埋めてみようかな
–
–
いい感じ!
で、最後にPC名!
–
–
–
サムネイルは「顔」が大事!について
サムネイルは「ぱっと見の印象重視」かつ、
小さくても見えるようにが◎
その為、一回小さくして確認することも大事
かなり小さくしたサムネイル↓
いや、
最高なんだけどさ
うんうん、だよね
天才なので
あー……
その、さ
あっ、大丈夫大丈夫。
言ってるだけで修正あったら、
即直すから!
いや、足りないのは分かるんだけど
何処が足りないのかがさ、
自己嫌悪中。
–
–
まとまりすぎてるっつーのか、
……!
分かった。
分かった?
Youtubeのサムネイルだと、
弱くないか、これ
……ごめん、
言われてみればそうかも
いや、
こっちこそ悪い
異能力感出したかったけど、
エフェクト回りは
無視して顔アップでも良い?
勿論、OK!
あと、
裏切りを――も削除で良い?
気にしないで良い。
やってくれ
…え、いい……?
そ、それなら、いけるかも。
–
–
–
こんな感じで……、
いいかな?
–
–
–
…!
–
インパクト強くなったな
顔大きくしただけ
なんだけどね…!
確認の為に
小さくしてみよう
……いい。
負けないサムネイルだなこれ
–
–
本当なら、
タイトルロゴ中央のが
いい気はすっけど、
PC1の身長小さい感が欲しいから
此処は弄らないで欲しいし、
これで完璧
いけそう?
良かった…!
パーツ分け・テンプレート
作ったサムネイルを、
パーツ毎に分けてみたよ
パーツ分け
サムネイルテンプレート
Canvaで
テンプレート使いたい人は↓から
他:参考例
ダブルクロスだと
PC番号ごとの兼ね合いも
サムネイルに入れて作ってもらったから、
紅坂さんのサムネイルも参考にする。
赤・青の背景で例を作るのが
特例だったからね…
ゆるい余談
紅坂さんのサムネイル……、
“あの”紅坂さんだ。
……?
“あの”、なの?
いや、配信画面の作り方説明の時に
俺が「紅坂さん」を
連呼し過ぎたせいで
読者の方に
「紅坂さんが突然出てきた。」
「紅坂がいれば何でもできる」って
言われてて
面白くなって、つい乗った。
該当記事↓(紅坂さんCSS作ってくれている有難い方です…)
–
–
–
紅坂さんのファンボで
立ち絵の表情差分を
動画・配信に反映できる
ツール配布してるから
気になる人は是非どうぞ
配信卓でも表情差分を反映させるツールの使い方↓
宣伝してる…
俺も
「立ち絵反映が出来たらいいな」と
言っていた側だからさ
…4PLどの子も
平等に映ってて、
すごく良い配置かも…!
だよなー?
だから、
テンプレート参考として、
見せる許可もらった。
※著者が元からお話している方だったので、
頼みやすかった事もあります。
–
他の皆様の素敵サムネイルも此方にて掲載しております↓
–
流石に借り物だから、
詳しく作り方は伝えないけど
テンプレートみたいに
するならこんな感じ
テンプレート自体も
かわいくない…?
そうそう、
シンプルにすると
更にセンスある構図だな―って
実感した
関連記事
-
TRPGサムネイルの作り方、始め方。前編:素材準備や説明編の話、どうしてサムネイルを作るのか?見本のサムネイル一覧ページや権利関係の話やロゴの作り方、立ち絵等の話。
-
YoutubeサムネイルやTRPGトレイラーで使える画像の作り方。無料ツールを使っての画像作成の仕方、動画サムネ画像を簡単作成!インストール不要なツールCanva無料版にて作成
-
自分でロゴを作成してみる。ココフォリアでのタイトルロゴ。ざっくりロゴ作成方法、ロゴっぽいのを作る!、ロゴの作り方、トレイラー・サムネイルの作り方、VtuberさんやTRPGシナリオなど簡単なロゴが合った方が良いからそれとなく作ってみたい人向け!
-
TRPG配信でキャラクターステータスやキャラクター紹介画像のデザインまとめ、TPRG 配信 キャラクター 画像や探索者ステータス画像、共鳴者ステータス画像などのまとめ
-
お部屋やサムネイルを作る際に守って欲しいことなどや、規約の話。TRPGのロゴやトレイラー画像の使用などの画像権利関係や立ち絵の商用利用の話。
-
漫画化幻覚テンプレートまとめ、TRPG素材、探索者ディスプレイ関係など。非公式素材もあるので用法用量、規約など守ってご利用くださいませ
-
TRPGトレイラー4枚を作る前編!キャッチコピー編!Canvaを使ったトレーラー作成方法。キャッチコピーや人を引き付ける台詞をどうやって作るのか、キャッチコピーやタイトルを付けるコツや型について紹介!
-
TRPGトレイラー4枚を作る後編!トレイラー画像編!Canvaを使ったトレイラー作成方法。概要に何を書くのか、シナリオのロスト率基準について、1枚目から4枚目って何に書いているのか。Twitterでもおしゃれに見えるトレーラー画像を作る!
-
TRPGサムネイルの作り方:後編① 2PLのサムネイルを作ってみる!テンプレートと理論を使って作ってみる
-
立ち絵ディスプレイの作り方、TRPGでキャラクターの立ち絵やビジュアルの背景を作るやり方、絵が描けなくても無料ツールで出来る方法。応用すればトレイラーの作り方にも!
-
TRPGサムネイルの作り方:後編② 4PCのサムネイルを作ってみる!ニュアンス寄りにざっくり作る
-
YoutubeのTRPGサムネイル参考一覧まとめ:配信者さん、Vtuberさんにお願いしてTRPGサムネイルをお借りしたのを纏めております。※随時更新予定
–
–