Specyfikacja dla kampanii Mobile FullPage w formacie Rich Media

Ogólne informacje #

• Format: Mobile FullPage (rich media)
• Urządzenia: Smartfony (iOS, Android)
• Orientacja: Pionowa (obowiązkowa) oraz opcjonalnie pozioma (jeśli kampania przewiduje dynamiczne dostosowanie do orientacji urządzenia)
• Czas trwania animacji: Maksymalnie 15 sekund
• Waga pliku: Do 150 KB (inicjalne ładowanie), do 2 MB (po pełnym załadowaniu assetów)
• Technologia: HTML5, CSS3, JavaScript (zaleca się unikanie dużych frameworków jak jQuery)

Wymagania dotyczące kreacji – dostarczanej przez klienta #

1. Rozmiar pliku końcowego:
   • Kreacja w formacie ZIP zawierająca otwarte pliki HTML, CSS, JS oraz zasoby graficzne.
   • Finalny plik powinien być zgodny z IAB Rich Media Guidelines.
2. Wymiary kreacji:
   • Standardowe wymiary FullPage: 1080×1920 px (lub większe dla urządzeń o wyższej rozdzielczości).
   • Kreacja musi być responsywna, skalowalna do szerokości ekranu urządzenia użytkownika.
3. Animacje:
   • Animacje płynne, do 30 FPS.
   • Zakończenie animacji musi pozostawiać statyczny kadr z CTA.
4. CTA:
   • Widoczny i czytelny przycisk CTA.
   • Zalecane: umieszczenie przycisku w dolnej części kreacji.
   • Tekst CTA maks. 30 znaków, np. „Dowiedz się więcej” / „Kup teraz”.
5. Zasoby graficzne:
   • Grafiki w formacie PNG/JPG (zalecane kompresowane bezstratnie).
   • Wektorowe elementy w formacie SVG.
   • Maksymalna liczba fontów: 2, wbudowane w plik ZIP (zalecany format WOFF/WOFF2).
6. Pliki wideo (opcjonalne):
   • Format: MP4, H.264.
   • Waga: Maks. 2 MB.
   • Auto-play bez dźwięku (dźwięk tylko po aktywnym kliknięciu użytkownika).
   • Maksymalna długość: 15 sekund.
7. Pliki otwarte:
   • Wszystkie pliki źródłowe powinny być przekazane (PSD, AI lub Sketch).
   • Uwzględnij elementy do edycji w przypadku konieczności poprawienia kreacji.

Funkcjonalności interaktywne #

• Swipe: Obsługa gestów przesunięcia (swipe).
• Kliknięcie: Cała kreacja klikalna (przekierowanie do strony docelowej lub innego zasobu).
• Efekty animowane: Przy przewijaniu/kliknięciu (np. fade-in, zoom, slide).

Śledzenie i tagowanie #

• Tagi trackingowe: Wsparcie dla pikseli śledzących w postaci img.
• Linki przekierowujące: Kliknięcia i interakcje muszą być tagowane za pomocą UTM (np. utm_source, utm_medium, utm_campaign).
• Eventy interakcji:
  • Liczba kliknięć.
  • Czas spędzony na kreacji.
  • Współczynnik aktywacji dźwięku (jeśli dotyczy).

Materiały wymagane od klienta – Kreacja po stronie WorkFlow Media #

1. Formaty otwarte z warstwami:
   • Pliki graficzne w formatach umożliwiających edycję i separację warstw:
     • Adobe Photoshop (PSD): Pliki muszą być w wersji warstwowej, z nazwanymi i zorganizowanymi folderami (np. „Tło”, „CTA”, „Elementy animacji”).
     • Adobe Illustrator (AI): Pliki wektorowe z warstwami oddzielającymi kluczowe elementy, np. logo, grafiki, teksty.
     • Sketch: Jeśli projekt został przygotowany w Sketch, plik musi zawierać wszystkie zasoby i style.
     • Figma: Dostęp do projektu z możliwością pobrania plików źródłowych.
2. Warstwowy Key Visual:
   • Wszystkie elementy graficzne kluczowe dla kampanii, takie jak:
     • Logo.
     • Elementy brandingowe (ikony, patterny, ramki).
     • Zdjęcia i ilustracje.
   • Każdy element na oddzielnej warstwie, w pełnej rozdzielczości.
3. Fonty:
   • Pliki czcionek w formacie WOFF/WOFF2, OTF, lub TTF.
   • Alternatywnie: nazwa fontu oraz licencja do jego użycia w kreacji (link do źródła).
4. Wideo (jeśli dotyczy):
   • Format: MP4 (H.264), wersja wysokiej rozdzielczości.
   • Wersja wideo w formacie warstwowym (np. After Effects – plik AEP) wraz z osadzonymi fontami i plikami źródłowymi (jeśli wideo wymaga edycji).
5. Paleta kolorów:
   • Kody HEX, RGB lub CMYK (jeśli potrzebna jest konwersja do druku).
   • Dokumentacja brandbooka (jeśli dostępna).
6. Elementy interaktywne:
   • Zasoby przeznaczone do animacji (np. ikony, przyciski, elementy do efektów „swipe” lub „tap”).
   • Preferowany styl interakcji (np. minimalistyczny, dynamiczny, efekt 3D).

Wymagania dodatkowe #

1. Edycja treści:
   • Teksty muszą być umieszczone na osobnych warstwach, aby umożliwić modyfikację (np. zmiana języka, CTA).
   • Preferowane formatowanie zgodne z zasadami responsywności.
2. Rozdzielczość:
   • Grafiki w wysokiej rozdzielczości, minimalnie 1080×1920 px.
   • Elementy skalowalne (np. SVG) dla zachowania jakości na różnych urządzeniach.
3. Pliki pomocnicze:
   • Plik PDF lub inna dokumentacja wyjaśniająca strukturę pliku, hierarchię warstw oraz użyte fonty i kolory.

Proces realizacji #

1. Weryfikacja plików:
   • Ocena kompletności i zgodności dostarczonych materiałów w ciągu 1 dnia roboczego.
   • W przypadku braków – kontakt z klientem w celu ich uzupełnienia.
2. Tworzenie kreacji:
   • Przygotowanie projektu w formacie HTML5 z animacjami opartymi na dostarczonych warstwach.
   • Optymalizacja elementów graficznych i animacji.
3. Testy:
   • Testowanie responsywności i interakcji na różnych urządzeniach.
   • Sprawdzenie poprawności animacji oraz funkcji interaktywnych.
4. Dostarczenie gotowej kreacji:
   • Finalna wersja w pliku ZIP (HTML, CSS, JS, zasoby graficzne).
   • Dodatkowo, zwrot zmodyfikowanych plików otwartych z naniesionymi poprawkami.

Testowanie #

1. Kreacja powinna być przetestowana na różnych urządzeniach i przeglądarkach mobilnych:
   • Safari, Chrome, Edge, Firefox (Android/iOS).
2. Sprawdzenie responsywności.
3. Potwierdzenie poprawności wszystkich trackingów (np. Google Tag Assistant).

Dostarczenie kreacji #

• Format plików końcowych:
  • Plik ZIP zawierający wszystkie elementy HTML5 oraz zasoby.
  • Otwarte pliki projektowe (np. PSD, AI).
• Termin dostarczenia: Min. 5 dni roboczych przed planowanym startem kampanii.

Jeżeli potrzebujesz wzoru briefu lub checklisty, mogę przygotować coś dodatkowego! 🚀