Apple Arcade's Lumen: studium przypadku sztuki promocyjnej i logo

W tym studium przypadku dotyczącym logo badamy, w jaki sposób wykorzystanie skeuomorficznego projektowania i dopracowywanie obrazów 3D w programie Photoshop pomogło jednemu projektantowi z Toptal stworzyć wyróżniające się materiały marketingowe dla przebojowej gry Apple Arcade Lumen.

Predrag Markovic jest grafikiem mieszkającym w Belgradzie w Serbii. Pracował w wielu branżach, w tym tradycyjnej drukarni, opakowań, żywności, telewizji i innych, ale branża gier zawsze była tam, gdzie chciał być. Po pracy dla agencji, która opracowała materiały promocyjne do gier Java, dołączył do Mad Head Games, aby pracować jako projektant UX gry. W 2017 roku dołączył do Toptal jako freelancer, a teraz pracuje w pełnym wymiarze godzin w Toptal.

Na początku tego roku zapewnił sobie współpracę z Lykke Studios, firmą zajmującą się grami mobilnymi z siedzibą w Tajlandii, aby zaprojektować materiały promocyjne dla najnowszej gry Apple Arcade, Lumen.

Krótkie

Lumen to gra logiczna, w której gracz znajduje tajemnicze pudełko na strychu i musi manipulować znajdującymi się w nim światłami, soczewkami i lustrami, aby ujawnić historię twórcy pudełka, XIX-wiecznej szkockiej wynalazczyni, Olivii McLumen.

Markovic został poproszony o stworzenie logo, ikony i kluczowej grafiki promocyjnej przy użyciu istniejących zasobów 3D z gry.

Wyzwanie

Apple zazwyczaj pracuje na bardzo napiętym harmonogramie. Markovic miał tylko dwa tygodnie na oddanie logo gry i portretów, a następnie cztery tygodnie na sfinalizowanie ikony. Raport zawierał również wersję paralaksy logo i ikony, którą można było manipulować wskaźnikiem w Apple TV, ale Markovic nigdy wcześniej nie pracował z Apple Parallax Previewer.

„To był bardzo krótki harmonogram, więc wiedziałem, że będzie to oznaczać pracę przez wiele nocy i weekendów” – mówi Markovic. „Ale oprócz Parallax Previewer, znam już swoje narzędzia bardzo dobrze, a pracując wcześniej w branży gier, rozumiałem proces uruchamiania gry”.

Podejście

Główna bohaterka gry, Olivia McLumen, żyła na przełomie XIX i XX wieku i aby przywołać tamtą epokę, wygląd i styl gry czerpie z estetyki steampunk i art nouveau. „Podobała nam się ręcznie wykonana estetyka tych stylów”, mówi Jakob Lykkegaard Pedersen, szef Lykke Studios. „Naprawdę mają świetne, szczegółowe wykonanie, którego już często nie można znaleźć”.

Ta estetyka musiała znaleźć odzwierciedlenie w walorach promocyjnych.

Dla porównania, studio dostarczyło grywalną wersję gry, a także zasoby 3D z gry, które można wykorzystać do celów promocyjnych.

„Zawsze chciałem zaprojektować coś w stylu steampunkowym” – mówi Markovic. „To naprawdę wyjątkowy wizualnie styl, a ponieważ jest to technologia fantasy, masz ogromne możliwości w tym, co tworzysz. Byłem podekscytowany możliwością połączenia tego z secesyjnym stylem, który był popularny w czasie, gdy gra została przygotowana.

Na początek Markovic zebrał moodboardy i obrazy referencyjne, aby zanurzyć się w stylach steampunk i art nouveau, ponieważ chciał wprowadzić wiele z tych szczegółów do swojej pracy.

„Chociaż Lumen to gra mobilna, wizualnie jest bardzo dopracowana i realistycznie wyglądająca, ze szczegółowymi modelami 3D, teksturami i dynamicznym oświetleniem” – mówi Markovic. „To nie jest mocno stylizowana gra o płaskich kształtach i czystym designie. Tworzone przeze mnie zasoby musiały odzwierciedlać ten wygląd i styl. W tym przypadku najlepszą opcją było podejście do projektowania skeuomorficznego. Chcieliśmy pokazać graczom poprzez logo i ikonę aplikacji, jak naprawdę wygląda gra. A ponieważ projekt skeuomorficzny nie jest obecnie powszechnym wyborem projektowym, wyróżnia grę w Apple Arcade”.

Unikalny proces projektowania

„Kiedy projektuję w 3D, mam do czynienia z dość skomplikowanym procesem” — mówi Markovic. „Używam wielu różnych narzędzi, ponieważ lubię wydobyć z każdego to, co najlepsze, dzięki czemu mój produkt końcowy może być naprawdę dopracowany”.

Zaczyna od odręcznych szkiców, aby szybko przekazać swoje wstępne pomysły klientowi. Po zidentyfikowaniu najlepszych opcji opracowuje wersje 2D w programie Adobe Illustrator. Następnie, w przypadku wersji 3D, konfiguruje sceny w programie Autodesk 3ds Max i finalizuje je w Corona Renderer.

Następnie, jako dodatkowy krok, eksportuje kanały alfa do Photoshopa, aby retuszować obrazy. Jeśli tworzy animację, używa Adobe After Effects.

„To daje mi pełną kontrolę nad cieniem, oświetleniem i kolorem” — mówi. „Naprawdę widać różnicę. A w grze o świetle jest to jeszcze ważniejsze”.

Projekt logo

Markovic początkowo opracował logo wykorzystujące typografię, która opierała się w dużej mierze na elementach mechanicznych, takich jak nity i zawiasy, aby podkreślić wpływy steampunkowe w grze. Produkcja była również stosunkowo szybka, co było ważne, ponieważ czas był krótki.

Ale studio chciało również, aby logo odzwierciedlało bardziej artystyczne, kreatywne elementy wyglądu i stylu gry, więc Markovic zaczął od nowa, tworząc krój pisma nawiązujący do secesyjnych detali, które zdobią pudełko z puzzlami i inne elementy gry.

Następnie dodał elementy z gry, w tym światła i lustra, którymi gracze muszą manipulować, aby rozwiązać zagadki, i animował je za pomocą Adobe After Effects. Logo, przypominające matową stal, osadzone jest na drewnianym tle otoczonym ozdobną mosiężną obwódką z funkcjonalnymi zębatkami w rogach.

W rezultacie powstało logo, które nie tylko wydawało się autentyczne w erze, w której toczy się gra, ale także dało widzom wgląd w działanie samej gry.

Projekt ikony Apple Arcade

Ikona jest często pierwszym wprowadzeniem potencjalnego gracza do gry. To właśnie zobaczy gracz, przewijając sklep Apple Arcade. Ikona Lumen musiała przywoływać esencję gry i wyróżniać się, aby zachęcić graczy do jej kliknięcia.

Wytyczne Apple dotyczące ikon odradzają używanie tekstu, więc obraz musiał być tak charakterystyczny, jak nazwa gry. Markovic naszkicował kilka opcji: obraz Olivii McLumen i różne widoki pudełka z puzzlami, w tym taki, w którym pudełko było otwarte, aby wyświetlić elementy gry.

Wizerunek Olivii i opcje otwartego pudełka okazały się zbyt skomplikowane, aby dobrze działały w tak małych rozmiarach, jakie musi mieć ikona. Obrazy musiały być prostsze, ale zachować realistyczny styl gry i inne elementy promocyjne.

Markovic wylądował z dwoma finalistami: zdjęciem całego pudełka w perspektywie i widzianym z góry oraz pełnoklatkowym zbliżeniem dekoracji przedniej, z lekko otwartą pokrywą i światłem świecącym od środka.

Druga opcja ostatecznie dokonała cięcia.

Projekt ikony paralaksy Apple TV

Gracze mogą również kupować gry na Apple TV. Tam mogą manipulować ikonami gry za pomocą funkcji wskaźnika na pilocie urządzenia.

Aby umożliwić tę funkcjonalność, projektanci muszą tworzyć obrazy warstwowe, które składają się z dwóch do pięciu warstw, które łączą się w jeden interaktywny obraz.

Aby upewnić się, że jego projekt będzie działał na platformie, Markovic musiał użyć narzędzia Parallax Previewer firmy Apple, które było dla niego nowością, ale nie zawahał się. „Lubię eksperymentować z nowymi narzędziami”, mówi.

„Szczególne wrażenie zrobiły na nas specjalnie zaprojektowane dla nas ikony iOS, tvOS i macOS”, mówi Lykkegaard Pedersen. „Zostały zbudowane w 3D, aby płaska ikona wyglądała, jakby wyskakiwała z urządzenia. Wygląda bardzo unikatowo w sklepie z aplikacjami i bardzo dobrze pasuje do gry”.

Kluczowa sztuka

Akcja gry toczy się na zakurzonym strychu wypełnionym światłem wpadającym z okien. Markovic musiał zmienić przeznaczenie istniejącej sztuki, aby można ją było wykorzystać w materiałach marketingowych. Dostarczono mu szereg zasobów 3D z gry, w tym oczywiście pudełko z puzzlami; gramofon; zegar; oraz ujęcie wnętrza strychu.

Ale ponieważ grafika gry została zoptymalizowana pod kątem urządzeń mobilnych, Markovic musiał dodać więcej szczegółów do obrazów, aby uczynić je bardziej przyjaznymi dla marketingu. Oznaczało to, że musiał dodać więcej wielokątów i siatek, a w niektórych przypadkach musiał przeprojektować je od nowa. Wyrenderował wszystko w 4K w Corona Renderer, aby uzyskać efekt wysokiej rozdzielczości, a następnie użył Photoshopa do retuszu obrazów.

„Komunikacja między mną a klientem była kluczowa, aby to zadziałało”, mówi. „Na szczęście mieli doświadczonego artystę 3D, który przygotował dla mnie zasoby 3D. Potem przygotowałem scenę w 3ds Max i pracowaliśmy razem nad stworzeniem odpowiedniego nastroju dla splash-artu. Kierownicy studia byli bardzo wrażliwi i ściśle współpracowali ze mną nad kierowaniem artystycznym, które odzwierciedlało grę”.

Sukces

Lumen odniosła sukces, z oceną 4,7 na 5 w sklepie Apple Arcade. Zespół studia był pod takim wrażeniem pracy Markovica, że ​​zaprosili go ponownie do kolejnej gry.