HANDAI JK Engineering Blog

HANDAI JKの技術ブログです

JKLT Summer 2019 宣伝イメージのメイキング

HANDAI JKの石田です。 7月12日(金)に夏のLT大会が開催されることが告知されました!やった!!

HANDAI JKではイベントごとを行うときに、イベントのポスター的役割を担う宣伝イメージを作成しています。 本記事では宣伝イメージの作り方(メイキング)を紹介したいと思います。

使用ソフト

テキストが多いものや、派手に画像を加工しない場合はAdobe XDFigmaといったプロトタイプツールを使って作っています。 本来これらのソフトはアプリのプロトタイピングに使われるものですが、機能がとてもシンプルでちょっとしたフライヤーのようなものを作るためにも使えると個人的には思っています。

しかし、今回は少し手の込んだことをしたのでPhotoshopを使って作りました。

f:id:handaijk:20190613202954j:plain
今回用意したコンセプト候補。最終的に左上の「三点透視図法」が選ばれた。

完成した宣伝イメージ

f:id:handaijk:20190613205317p:plain
HANDAI JK LIGHTNING TALKS Summer 2019

今回は今までで一番映画のポスター風の仕上がりになりました。(というのも作った人が映画好きだからです。) 特に世界が上下逆さまになっているシーンは、「インセプション」や「サカサマのパテマ」、「アップサイドダウン 重力の恋人」などたくさんの映画で見たことがあると思います。

www.youtube.com www.youtube.com www.youtube.com

ポイント解説

では、どういう技(というほどのものではないのだが)を使ってこの宣伝イメージを作ったかポイントを絞って解説します。

1. 二値化

f:id:handaijk:20190613133445p:plain
二値化 (Threshold)

二値化というのは、「これより暗い箇所は黒、明るい箇所は白」というように画像を2色に加工することです。これをビル街の画像に対して適用しています。エッジ部分だけが残るので、白黒にするよりもシャープな感じになります。

2. スクリーン(描画モード)

f:id:handaijk:20190613133449p:plain
描画モード: スクリーン

描画モードをスクリーンに設定すると、レイヤーを重ねた時に色も重なっていき白色に近づいていきます。全体が白黒ばかりだと物足りないので、アクセントとして青緑赤の長方形をスクリーンで重ねたものを加えました。

3. ゆらす

f:id:handaijk:20190613133455p:plain
クモの巣をゆらしてみた例

これは特に名前がついているか知らないのですが、レイヤーを複製して片方を少しぼかす&ずらすと3D映像を眼鏡をかけずに見たときのような独特な効果が生まれます。上半分の逆さまになっているビル街に適用しました。

4. フォント

f:id:handaijk:20190613133440p:plain
フォントを使い分けるだけでもがらっと雰囲気が変わります

今回の宣伝イメージには3つのフォントを使いました。HANDAI JK LIGHTNING~部分には Adderss Sans、Summer 2019部分にはLato、下部の日付部分にはRobotoを使用しています。

文字はフォントを変えたり、レタースペース(文字と文字の間隔)やウェイト(太さ)が違うだけでも印象が結構変わるので、いろいろ試してみると面白いです。

おわりに

宣伝イメージのメイキングはいかがでしたか?だいたいこんな感じで宣伝イメージは作られています。もし面白そうだなと思ったら、HANDAI JKではデザインができる運営メンバーを歓迎しているのでTwitter DMなどで声をかけてくださいね~!