ALFA Otwarte do testów

Zbudowanie reklamy to mała część tej roboty.

Jedna aplikacja zamiast łańcucha Animate → After Effects → folder. Animujesz w niej, zarządzasz assetami, pilnujesz wagi, wysyłasz HTML5, statyki i wideo, a akceptację klienta prowadzisz z tego samego pliku. Czyta i zapisuje formaty, których już używasz, więc nic, co zrobiłeś, nie staje się niedostępne. Każdy panel jest dopracowany co do piksela, a każda ikona narysowana ręcznie.

Zobacz edytor
Edytor ADIMATE: panel artboardów, oś czasu, biblioteka i właściwości tekstu
Production_Plan.adi · artboardy, oś czasu, biblioteka, właściwości tekstu powiązane z copy deckiem
20%
właściwa produkcja
szybciej
50%
poprawki klienta
znika
30%
przenoszenie plików, wyrównywanie wersji
znika
01 / Problem

Jedna animacja. Budowana trzy razy, w trzech programach.

HTML5

animowane w Animate, narzędziu, które przestało się rozwijać lata temu, publikowane 27 razy

WIDEO

ten sam ruch odbudowany ręcznie w After Effects, więc nigdy do końca nie pasuje do banera

STATYKI

klatka końcowa odtworzona w Photoshopie 34 razy, po jednej na rozmiar

Trzy silniki animacji dla jednego pomysłu. Każda zmiana to trzy zadania, a trzy wyniki coraz bardziej się rozjeżdżają. ADIMATE buduje to raz i eksportuje wszystkie trzy z tego samego pliku. Tym, jak teksty i assety pozostają zsynchronizowane w całej kampanii, zajmuje się A.D.I..

02 / Edytor

Prawdziwa oś czasu, w konwencji, którą już znasz.

Klatki kluczowe, tweeny, krzywe easingu, przeciąganie kluczy, zaznaczanie zakresu, warstwy prowadnic. Jeśli przychodzisz z Animate, niczego nie musisz uczyć się od nowa.

Production_Plan.adi · 1 : 1 Przeciągnij, aby się rozejrzeć
Edytor ADIMATE w rzeczywistym rozmiarze: oś czasu, artboardy, biblioteka i właściwości

Gotowe animacje

Fade, slide, pop, spin jednym kliknięciem albo twoja własna krzywa.

Movie clipy

Zagnieżdżone symbole z własną osią czasu.

Dziewięciopunktowe kotwice

Punkt rejestracji tam, gdzie się go spodziewasz, za każdym razem.

Wyrównywanie i rozmieszczanie

Siatka, prowadnice, przyciąganie.

Typy warstw

Tekst, kształty, grafiki i wideo jako pełnoprawne warstwy.

Edytor easingu

Krzywe, które możesz przeciągać, używać ponownie i nazywać.

02b / Detale

Co do piksela. Każda ikona narysowana ręcznie.

Narzędzie, na które patrzysz osiem godzin dziennie, musi być spokojne. Interfejs ADIMATE jest zbudowany na siatce 28 px według jednego style guide'u: pięć rodzin kolorów, dwa style tekstu, jeden niebieski. 330 ikon nie pochodzi z biblioteki; każda została narysowana do swojego pola 16 px, ze stanem nieaktywnym, aktywnym i wybranym, tak aby pasek narzędzi dało się odczytać jednym spojrzeniem i nic nie skakało między panelami.

Działające panele ze style guide'u ADIMATE. Najedź i kliknij: to prawdziwe komponenty, a nie ich obrazki.

Narzędzia

Zaznaczanie, transformacja, tekst, kształty, wypełnienie, pipeta. Panel sam reaguje na kursor: jedna kolumna, dwa stany na narzędzie, żadnych etykiet do czytania.

Tekst i właściwości

Źródłem tekstu jest deck, a nie ciąg znaków: klient, klatka, język. Właściwości to pozycja, transformacja, krycie, treść, układ, każda sekcja zwijana. Te same odstępy, to samo pole, ten sam niebieski.

Artboardy i biblioteka

Plan produkcji jako lista: każdy rozmiar, każdy język, jego status. Biblioteka trzyma assety z ich wagą, wbudowany kompresor i wyszukiwarkę, która podmienia w całym planie.

03 / Artboardy i resize'y

Wiele artboardów w jednym projekcie. Typ decyduje o eksporcie.

Każdy artboard to HTML5, wideo albo statyk. Treść skaluje się razem z artboardem, także w trybie responsywnym. Zbuduj mastera i zduplikuj go na resztę planu.

97
assetów w kampanii
17
unikalnych layoutów

Pozostałe 80 to rozmiary i języki czegoś, co już zrobiłeś.

300×250HTML5
728×90HTML5
160×600HTML5
1080×1080MP4
04 / Biblioteka i waga

Nie lista plików. Zarządzanie assetami.

Foldery, sortowanie, kolumny, wyszukiwanie i zamiana. Zaznacz warstwę, a biblioteka podświetli plik, z którego pochodzi.

Wbudowana kompresja PNG i JPG
Bez zewnętrznej usługi, bez klucza API. Redukcja palety, bo grafika banerowa ma kilkaset kolorów, a nie miliony. Wsadowo, na całej bibliotece naraz.
Obsługa wideo
Zmiana kontenera, transkodowanie do docelowego rozmiaru w MB, podgląd z wykresem fali dźwięku.
Waga · na żywoLimit 150 KB
138.4KB→ 104,7 KB po kompresji
kod
35.9 KB
png
57.2 KB
jpg
34.8 KB
zapas
11.6 KB
05 / Zna specyfikacje

Zasady są w narzędziu, a nie w PDF-ie, którego ktoś zapomniał przeczytać.

Google / DCM AdForm Sieci lokalne

clickTag

Zapisany tak, jak oczekuje każda sieć, dla każdego artboardu.

150 KB

Pilnowane podczas pracy, a nie odkrywane przy dostawie.

Backup statyczny

Generowany z ostatniej klatki, bez osobnego kroku eksportu.

Fonty

Osadzone albo tekst zamieniony na krzywe, aby typografia przetrwała na komputerze bez twojego kroju pisma.

06 / Import i eksport, w obie strony

Działa z tym, co już masz.

Import
.fla
także uszkodzone pliki, których Animate nie chce otworzyć
.psd
artboardy, edytowalne warstwy tekstowe, przezroczystość
After Effects
przez Lottie albo skrypt ADIMATE
Figma
przez plugin
.adi
Eksport
HTML5
zgodnie ze specyfikacją sieci, spakowane do ZIP, z podpiętym clickTagiem
PNG / JPG
statyki i backupy z dowolnej klatki
MP4
renderowane z samego banera
.fla
jako dokument HTML5 Canvas
After Effects
projekt zbudowany przez samo After Effects

Nie "zastępuje Animate". Czyta twoje pliki i oddaje je z powrotem.

.adi
Nowy format pliku

ADIMATE zapisuje .adi. A.D.I. czyta go jako template.

Jeden plik mieści całą produkcję: każdy artboard i rozmiar, oś czasu, bibliotekę, warstwy tekstowe powiązane z copy deckiem, języki. Otwórz go w ADIMATE i animuj dalej. Wrzuć go do A.D.I., a stanie się template'em: A.D.I. zasila go deckiem, marką i assetami, a każdy rozmiar i język powstaje z tego samego pliku, sprawdzony i gotowy do preview.

Plik .adi jest hostowany w A.D.I. razem ze swoimi assetami. Zmiana tekstu, nowy packshot albo świeży eksport dzieje się na serwerze, z przeglądarki, więc nikt w zespole nie potrzebuje zainstalowanego ADIMATE, żeby kampania szła do przodu. Osoba, która zbudowała plik, nie jest już jedyną, która może go zmienić.

artboardyoś czasubibliotekatekst powiązany z deckiemjęzykitemplate dla A.D.I.hostowany ze swoimi assetamiedycja i eksport bez ADIMATE
07 / Wideo

Film i baner nie mogą się rozjechać.

MP4 jest renderowane klatka po klatce z tego samego HTML-a co baner. Nie ma drugiego silnika animacji do synchronizowania, bo drugiego silnika po prostu nie ma. Wideo jako warstwa tła pod tekstem, docelowy rozmiar ustawiany w MB.

08 / Deck, jedno źródło tekstów

PM pisze. Banery zmieniają się w trakcie pisania.

Teksty wkleja się raz z Excela. ADIMATE, After Effects i Figma czytają ten sam deck przez swoje pluginy. W wideo tekst jest wtopiony w piksele, więc narzędzie mówi to wprost, zamiast po cichu kłamać.

Deck · wiersz 14
nagłówek
Darmowa dostawa do niedzieli
cta
Kup teraz
300×250 · 41 KBDarmowa dostawa do niedzielina żywo
160×600 · 38 KBDarmowa dostawa do niedzielina żywo
MP4 · 3,4 MBDarmowa dostawa w tym tygodniutekst zmieniony, jeszcze nieprzebudowane
campaign_plan_q4.xls → 97 wierszy62 gotowe · 35 pozostało
ROZMIAR
FORMAT
SERWER
LIMIT · TERMIN
BACKUP
300×250
HTML5
DCM
150 KB · 02.09
tak
728×90
HTML5
AdForm
150 KB · 02.09
tak
1080×1080
MP4
Meta
4 MB · 05.09
nie
09 / Plan zakłada projekt

Wrzucasz XLS, a projekt już wie, co musi powstać.

Plik .adi żyje razem z tym planem i mówi ci, ile formatów zostało. Wybierz, gdzie żyje kampania: na dysku, w ADI LINK, w Adpiler albo w twoim własnym systemie, a panel Artboardy ustawi twoje artboardy względem planu: co trzeba jeszcze zrobić, co czeka, co wróciło z uwagami.

10 / Jeden artboard, wiele języków

Język to wymiar artboardu, a nie jego kopia.

Dwadzieścia plików, które powoli się rozjeżdżają, to nie lokalizacja. Dodaj tyle języków, ile potrzebuje kampania, popraw layout raz, a każdy język go dostaje. Nadpisuj tylko tam, gdzie jeden język naprawdę potrzebuje innego layoutu.

∞
języki, tyle, ile potrzebuje plan
1
artboard
EN DE IT PL ES + dodaj
KOLEKCJA JESIENNA
Każdy layout, każdy rozmiar, jeden plik
Zobacz kolekcję
master_480x300.adilayout bazowy
11b / Komentarze i statusy

"Nie" od klienta ląduje na twojej liście artboardów, z uzasadnieniem.

Statusy i komentarze są wspólne z A.D.I. i ADI LINK, a agencja definiuje własny zestaw. Gdy klient odrzuci plik w preview, producent widzi go jako odrzucony w panelu Artboardy w tej samej sekundzie, z komentarzem przypiętym do tego artboardu. Poprawiasz, wgrywasz z wiersza, status idzie dalej. Bez drugiego okna i szukania maila.

do zrobieniagotowew akceptacjiw poprawkachzaakceptowaneodrzucone+ twoje własne
ADI LINK · widok klienta
[CAMPAIGN]_728x90_DE
ODRZUCONE
Klient · 14:02
Zła data, powinno być 30.06.
ADIMATE · panel Artboardy
728x90_DE
ODRZUCONE
Klient · 14:02 · ta sama sekunda
Zła data, powinno być 30.06.
12 / Roadmapa
JESZCZE NIE ZBUDOWANE

Dokąd to zmierza.

01

Template'y

Template'y animacji i template'y decków.

02

Maszyna renderująca

Edycja decku przebudowuje pliki bez producenta przy klawiaturze.

03

Wersja dla klienta

Wybierz template, wrzuć tekst i zdjęcie, pobierz, bez wychodzenia z template'u.

Copy Check i Brand Check dla całej dostawy już istnieją. Działają w A.D.I., a dla statyków w narzędziu Vadilator.