Apple Arcadeのルーメン:プロモーションアートとロゴのケーススタディ

公開: 2022-03-11

このロゴのケーススタディでは、スキューモーフィズムデザインを採用し、Photoshopで3D画像を磨くことで、1人のToptalデザイナーがヒットしたAppleArcadeゲームLumenの傑出したマーケティング資産を作成するのにどのように役立ったかを探ります。

Predrag Markovicは、セルビアのベオグラードを拠点とするグラフィックデザイナーです。 彼は、伝統的な印刷、包装、食品、テレビなど、さまざまな業界で働いてきましたが、ゲーム業界は常に彼が望んでいた場所でした。 Javaゲームの販促資料を開発した代理店で働いた後、MadHeadGamesに参加してゲームUXデザイナーとして働きました。 2017年にフリーランサーとしてToptalに入社し、現在はToptalのエンゲージメントにフルタイムで取り組んでいます。

今年の初め、彼はタイに本拠を置くモバイルゲーム会社であるLykke Studiosと契約を結び、最新のAppleArcadeゲームであるLumenのプロモーション資産を設計しました。

ブリーフ

ルーメンは、プレイヤーが屋根裏部屋で不思議な箱を見つけ、その中のライト、レンズ、鏡を操作して、箱の作成者である19世紀のスコットランドの発明者OliviaMcLumenの物語を明らかにするパズルゲームです。

Markovicは、ゲームの既存の3Dアセットを使用して、ロゴ、アイコン、およびプロモーションキーアートを作成するように依頼されました。

挑戦

Appleは通常、非常に厳しいスケジュールで作業します。 マルコビッチは、ゲームのロゴとスプラッシュアートを提出するのにわずか2週間、そしてアイコンを完成させるのに4週間しかありませんでした。 ブリーフには、Apple TVのポインタで操作できる視差バージョンのロゴとアイコンも含まれていましたが、MarkovicはこれまでAppleの視差プレビューアを使用したことがありませんでした。

「それは非常に短いタイムラインだったので、それは多くの夜と週末に働くことを意味することを私は知っていました」とマルコビッチは言います。 「しかし、視差プレビューアを除けば、私はすでに自分のツールを本当によく知っており、以前にゲーム業界で働いたことがあるので、ゲームの発売プロセスを理解していました。」

アプローチ

ゲームの主人公であるOliviaMcLumenは、1800年代後半から1900年代初頭にかけて住んでいました。その時代を想起させるために、ゲームのルックアンドフィールはスチームパンクとアールヌーボーの美学から引き出されています。 「私たちはこれらのスタイルの手作りの美学が大好きでした」とLykkeStudiosの責任者であるJakobLykkegaardPedersenは言います。 「彼らは本当に、あなたがもうしばしば見つけることのない素晴らしい、詳細な技量を持っています。」

これらの美学は、販促資産に反映される必要がありました。

参考までに、スタジオはゲームのプレイ可能なビルドと、プロモーションアートに再利用できるゲームの3Dアセットを提供しました。

「私はいつもスチームパンクなスタイルで何かをデザインしたかったのです」とマルコビッチは言います。 「それは本当に視覚的にユニークなスタイルであり、ファンタジーテクノロジーであるため、作成するものに大きな可能性があります。 それを、ゲームが設定されている間に人気があったアールヌーボースタイルとブレンドする機会を得たことに興奮しました。」

まず、マルコビッチはムードボードとリファレンス画像を組み立てて、スチームパンクやアールヌーボーのスタイルに没頭しました。彼はそれらの詳細の多くを自分の作品に取り入れたかったからです。

「Lumenはモバイルゲームですが、視覚的には非常に洗練されており、詳細な3Dモデル、テクスチャ、動的な照明を備えたリアルな外観です」とMarkovic氏は言います。 「これは、フラットな形状とすっきりとしたデザインを備えた、高度に様式化されたゲームではありません。 私が作成したアセットは、そのルックアンドフィールを反映する必要がありました。 この場合、スキューモーフィズム設計アプローチが最良の選択肢でした。 ロゴとアプリアイコンを使用して、ゲームが実際にどのように見えるかをプレーヤーに示したかったのです。 そして、スキューモーフィズムデザインは最近では一般的なデザインの選択肢ではないため、AppleArcadeでゲームを際立たせています。」

独自の設計プロセス

「3Dで設計する場合、パイプラインはやや複雑になります」とMarkovic氏は言います。 「私はさまざまなツールを使用しています。それぞれを最大限に活用して、最終製品を本当に磨くことができるようにするためです。」

彼は手描きのスケッチから始めて、最初のアイデアをクライアントにすばやく伝えます。 彼らが最良のオプションを特定したら、彼はAdobeIllustratorで2Dバージョンを作成します。 次に、3Dバージョンの場合、彼はオートデスクの3ds Maxでシーンを設定し、CoronaRendererでそれらを完成させます。

次に、追加の手順として、アルファチャネルをPhotoshopにエクスポートして、画像をレタッチします。 アニメーションを作成する場合は、AdobeAfterEffectsを使用します。

「これにより、シャドウ、ライティング、およびカラーコントロールを完全に制御できます」と彼は言います。 「あなたは本当に違いを知ることができます。 そして、光に関するゲームの場合、それはさらに重要です。」

レタッチ前後のゲームアイコン。

ロゴデザイン

Markovicは当初、ゲームへのスチームパンクの影響を強調するために、リベットやヒンジなどの機械要素に大きく依存するタイポグラフィを使用してロゴを開発しました。 また、生産も比較的早く、時間が短かったので重要でした。

ロゴのムードボード。

しかし、スタジオはまた、ロゴがゲームのルックアンドフィールのより芸術的で創造的な要素を投影することを望んでいたので、Markovicは最初からやり直し、パズルボックスやゲームの他の機能を飾るアールヌーボーの詳細を反映した書体を作成しました。

マルコビッチのスケッチは、ルーメンのロゴのさまざまなアイデアの進展を詳しく説明しています。

次に、プレイヤーがパズルを解くために操作する必要のあるライトやミラーなど、ゲームの要素を追加し、AdobeAfterEffectsでアニメーション化しました。 マットなスチールのように見えるロゴは、コーナーに機能的なギアを備えた装飾的な真鍮の境界線で囲まれた木製の背景に設定されています。

その結果、ゲームが設定された時代に本物であると感じただけでなく、視聴者にゲーム自体の仕組みを垣間見ることができるロゴができました。

最終的なアニメーションロゴは、木箱、真鍮の付属品、ゲームプレイに登場するライトやミラーなど、多くのゲーム要素を参照しています。

AppleArcadeアイコンのデザイン

アイコンは、多くの場合、潜在的なプレーヤーのゲームへの最初の紹介です。 これは、AppleArcadeストアをスクロールしたときにプレーヤーに表示されるものです。 ルーメンのアイコンは、ゲームの本質を呼び起こし、プレーヤーにクリックを促すために目立つ必要がありました。

Appleのアイコンガイドラインではテキストの使用を推奨していないため、画像はゲームの名前と同じくらい特徴的である必要がありました。 Markovicは、いくつかのオプションをスケッチしました。OliviaMcLumenの画像と、ゲーム要素を表示するためにボックスが開いているものを含む、パズルボックスのさまざまなビューです。

オリビアの画像とオープンボックスオプションは、アイコンが必要な小さなサイズではうまく機能するには複雑すぎることが判明しました。 画像はよりシンプルでありながら、ゲームやその他の販促用アセットのリアルなスタイルを維持する必要がありました。

マルコビッチは最終的に2人のファイナリストになりました。1つはボックス全体を遠近法で上から見た画像、もう1つは正面装飾のフルフレームのクローズアップで、蓋が少し開いて内側から光が輝いています。

2人のファイナリストはボックスとライトの要素を特色にしました。

2番目のオプションは最終的にカットを行いました。

このアイコンは、Apple Arcadeで、他のアイコンのよりフラットな画像に対して際立っています。

AppleTV視差アイコンデザイン

プレイヤーはAppleTVでゲームを購入することもできます。 そこでは、デバイスのリモコンのポインター機能を使用してゲームアイコンを操作できます。

この機能を有効にするには、設計者は、単一のインタラクティブ画像を作成するために結合する2〜5層で構成される階層化画像を作成する必要があります。

彼のデザインがプラットフォーム上で機能することを保証するために、Markovicは彼にとって新しいAppleのParallax Previewerツールを使用する必要がありましたが、彼は躊躇しませんでした。 「私は新しいツールを試すのが好きです」と彼は言います。

AppleのParallaxPreviewerツールを使用すると、Markovicは、ユーザーがAppleTVポインタを使用して操作できるアイコンを作成できました。

「私たちは、私たちのために設計されたiOS、tvOS、およびmacOSのアイコンPredragに特に感銘を受けました」とLykkegaardPedersen氏は言います。 「これらは3Dで構築されており、フラットなアイコンがデバイスから飛び出しているように見えます。 アプリストアでは非常にユニークに見え、ゲームに非常によく適合します。」

キーアート

ゲームは、窓から差し込む光で満たされたほこりっぽい屋根裏部屋で設定されています。 マルコビッチは、既存のアートをマーケティング資料で使用できるように再利用する必要がありました。 もちろん、彼にはゲームからパズルボックスを含む多くの3Dアセットが提供されました。 蓄音機; クロック; 屋根裏部屋のインテリアショット。

しかし、ゲームのアートはモバイル向けに最適化されていたため、Markovicは画像をよりマーケティングに適したものにするために、画像に詳細を追加する必要がありました。 つまり、ポリゴンとメッシュをさらに追加する必要があり、場合によっては、それらを最初から再設計する必要がありました。 彼はすべてをCoronaRendererで4Kでレンダリングして高精細な外観にし、Photoshopを使用して画像をレタッチしました。

スタジオが提供する3Dゲームアートの一部で、モバイル向けに最適化されています。

レタッチされた画像をフィーチャーした完成したスプラッシュアート。

「これが機能するためには、私とクライアントの間のコミュニケーションが不可欠でした」と彼は言います。 「幸いなことに、彼らには経験豊富な3Dアーティストがいて、私が使用できるように3Dアセットを準備してくれました。 その後、3ds Maxでシーンを設定し、スプラッシュアートに適したムードを設定するために協力しました。 そして、スタジオのリーダーは非常に反応が良く、ゲームを反映したアートディレクションを推進するために私と緊密に協力しました。」

成功

Lumenは成功したゲームであり、AppleArcadeストアで5段階中4.7の評価を得ています。 スタジオチームはマルコビッチの仕事にとても感銘を受けたので、彼らは別のゲームのために彼を再び連れてきました。