Jeśli masz już w Figmie co najmniej jedną zaprojektowaną ramkę baneru, Bannerify może na jej podstawie wygenerować zupełnie nowe ramki banerów w wielu rozmiarach.

Przydaje się to, gdy masz gotowy jeden dopracowany rozmiar główny i chcesz, aby Bannerify przygotowało wstępną wersję pozostałych standardowych rozmiarów reklam bez ręcznego budowania każdego układu od zera.

Co robi ta funkcja

• Powiela zaznaczone ramki lub instancje najwyższego poziomu z Figmy jako nowe ramki.
• Pozwala wybrać kilka standardowych rozmiarów banerów jednocześnie.
• Obsługuje własne rozmiary wyjściowe.
• Może opcjonalnie dopasować układ tekstów, logo, przycisków CTA i grafik do każdych nowych proporcji.
• Nie zmienia oryginalnych ramek źródłowych.

Traktuj tę funkcję jako skrót w produkcji, a nie zamiennik przeglądu kreacji. Bannerify szybko doprowadzi Cię bardzo blisko celu, a ostateczne poprawki projektu możesz wprowadzić bezpośrednio w Figmie.

1. krok: otwórz kartę Generate

Otwórz Bannerify w Figmie i przełącz się ze zwykłej karty Load Banners from Figma Frames na kartę Generate New Banner Sizes from Figma Frames.

Bannerify przeszuka bieżącą stronę w poszukiwaniu ramek i instancji najwyższego poziomu, których można użyć jako banerów źródłowych.

2. krok: zaznacz ramki źródłowe

Zaznacz jedną lub kilka ramek źródłowych, od których chcesz zacząć.

Dobrze sprawdzają się:

• gotowe projekty banerów,
• dopracowany rozmiar główny, na przykład 300x250 lub 1200x628,
• ramki o przejrzystej strukturze i wyraźnie pogrupowanych elementach.

Bannerify generuje nowe ramki z zaznaczonych źródeł i nie nadpisuje oryginałów.

3. krok: wybierz rozmiary wyjściowe

Włącz rozmiary banerów, które chcesz wygenerować.

Karta Generate zawiera zestaw popularnych rozmiarów reklam, na przykład:

• Leaderboard (728x90)
• Medium Rectangle (300x250)
• Large Rectangle (336x280)
• Skyscraper (120x600)
• Wide Skyscraper (160x600)
• Half-Page Skyscraper (300x600)
• Banner (468x60)
• Square (250x250)

Jeśli potrzebujesz niestandardowego rozmiaru, wpisz własną szerokość i wysokość, a potem kliknij Add Custom Size.

4. krok: opcjonalnie włącz inteligentny układ

Jeśli chcesz, aby Bannerify automatycznie dopasowało zawartość każdego nowego baneru, włącz:

• Auto re-layout new Figma frame content layers (BETA)

Po włączeniu tej opcji Bannerify spróbuje zmienić rozmiar i położenie treści w każdej nowej ramce, aby bardziej naturalnie pasowała do docelowych proporcji. Stara się też zachować pierwotne rozmieszczenie treści w ramce, więc układy, które były dociążone u góry lub wyrównane do krawędzi, rzadziej przesuwają się z powrotem do środka.

Gdy opcja jest wyłączona, Bannerify nadal utworzy ramki w nowych rozmiarach, ale zmieni tylko rozmiar ramki zewnętrznej, a położenie zawartości pozostanie bliższe oryginalnemu układowi źródłowemu.

5. krok: kliknij Generate

Kliknij przycisk Generate, aby utworzyć wybrane rozmiary.

Bannerify utworzy na stronie nowe ramki w Figmie, nazwane według ramki źródłowej i rozmiaru wyjściowego, na przykład:

• Homepage Promo / Leaderboard (728x90)
• Homepage Promo / Medium Rectangle (300x250)
• Homepage Promo / Half-Page Skyscraper (300x600)

Co próbuje dopasować inteligentny układ

Gdy przełącznik dopasowania układu jest włączony, Bannerify spróbuje:

• zmienić rozmiar i położenie bloków tekstu,
• zachować czytelność nagłówków w wąskich, wysokich lub bardzo niskich i szerokich formatach,
• utrzymać treść umieszczoną u góry, pośrodku lub u dołu bliżej jej pierwotnej pozycji,
• uniknąć nadmiernego pomniejszania całej kompozycji, gdy nowy rozmiar ma proporcje zbliżone do oryginału,
• zachować odstępy wokół szerszych obszarów tekstu,
• przesunąć elementy dekoracyjne i kształty, aby pasowały do nowych proporcji,
• w miarę możliwości trzymać pogrupowaną treść razem,
• ograniczyć wyraźne nakładanie się i wychodzenie treści poza ramkę.

Dokładny wynik zależy od struktury ramki źródłowej i różnicy proporcji między rozmiarem oryginalnym a docelowym.

Kiedy włączyć lub wyłączyć dopasowanie układu

Włącz je, gdy

• chcesz szybko uzyskać wstępną wersję wielu nowych rozmiarów,
• baner źródłowy ma przejrzystą strukturę treści,
• chcesz, aby Bannerify wykonało większość pracy przed ostatecznym dopracowaniem.

Zostaw je wyłączone, gdy

• chcesz tylko szybko utworzyć ramki w nowych rozmiarach,
• planujesz samodzielnie przestawić wszystkie elementy w Figmie,
• układ źródłowy jest bardzo nietypowy i chcesz mieć pełną, ręczną kontrolę.

Dobre praktyki, które poprawiają wyniki

Najbardziej spójne wyniki uzyskasz, gdy banery źródłowe mają w Figmie przejrzystą strukturę.

Trzymaj ważne elementy jako bezpośrednie warstwy podrzędne lub w logicznych grupach

Na przykład:

• grupa nagłówka,
• grupa tekstu głównego,
• grupa CTA lub przycisku,
• grupa logo,
• grupa zdjęcia produktu.

Dzięki temu Bannerify łatwiej rozpozna rolę każdego elementu i rozsądnie dopasuje jego układ.

Unikaj jednej ogromnej, płaskiej ramki z niepowiązanymi warstwami

Jeśli wszystkie elementy leżą luźno w ramce głównej bez logicznego pogrupowania, Bannerify ma mniej informacji o ich znaczeniu.

Nadaj długim tekstom rozsądne pole tekstowe

Jeśli baner zawiera długi tekst prawny lub zastrzeżenie, nadaj warstwie tekstowej w ramce źródłowej realistyczną szerokość.

Jeśli tekst ma pozostać przewijany w eksportach HTML, zobacz Przewijane warstwy tekstowe.

Używaj sekcji tylko do banerów wieloscenicznych

Funkcja Generate tworzy nowe rozmiary z istniejących ramek.

Jeśli chcesz połączyć kilka ramek w jedną animowaną sekwencję baneru, zobacz Banery wielosceniczne.

Po wygenerowaniu

Wygenerowane banery to zwykłe ramki w Figmie. Możesz:

• ręcznie poprawić układ,
• animować je w Bannerify,
• wyeksportować je do HTML, GIF, MP4, WebM lub innych obsługiwanych formatów.

Jeśli później zaktualizujesz oryginalny projekt źródłowy, wygeneruj nową partię banerów.

Wskazówki dotyczące rozwiązywania problemów

• Jeśli wygenerowane układy wymagają zbyt wielu ręcznych poprawek, wyłącz przełącznik dopasowania układu i zmień rozmiar wariantów ręcznie.
• Jeśli rozmiary z dużą ilością tekstu nadal wymagają poprawek, uprość układ źródłowy i wygeneruj banery ponownie.
• Jeśli wygenerowane banery zawierają zbyt dużo tekstu jak na bardzo małe rozmiary, skróć tekst źródłowy albo użyj tekstu przewijanego lub wyświetlanego w okienku pop-up.
• Jeśli chcesz, aby Bannerify traktowało kilka ramek jako jeden baner, użyj sekcji Figmy zamiast funkcji Generate.

Podsumowanie

Funkcja Generate to najszybszy sposób, aby zamienić jeden lub kilka gotowych banerów z Figmy w pełny zestaw nowych rozmiarów.

Zaznacz ramki źródłowe, wybierz rozmiary wyjściowe, zdecyduj, czy włączyć Auto re-layout new Figma frame content layers (BETA), i pozwól Bannerify wygenerować nowe ramki bezpośrednio na stronie.