„Najpierw zróbmy makietę i najważniejsze grafiki, a teksty przygotujemy później”. Z takiego założenia wciąż wychodzi wiele firm zlecając wykonanie strony. Być może niektórym projektantom taka kolejność nie przeszkadza, ale czy z perspektywy spójności witryny i zadań, jakie ma ona wykonać, jest to dobra droga? W wielu przypadkach lepiej, kiedy najpierw powstaną teksty lub przynajmniej, kiedy są one przygotowywane równolegle z designem.       

Napisanie tekstów i uzupełnienie nimi strony wciąż bywa spotykane na szarym końcu listy zadań projektowych. Niby wiadomo, że copywriting jest bardzo ważny, że teksty sprzedają, ale mimo to zlecający często chcą najpierw nakarmić oko.

Na typowych stronach produktowych czy wizerunkowych (to na nich się skupiamy), to jednak treść i jej kształt w dużej mierze wytyczają ścieżkę, którą później ma podążać użytkownik. Co za tym idzie, copy pozostaje nie bez znaczenia w kontekście układu poszczególnych elementów witryny, a czasami nawet ich stylu, wykonania.

Chociaż oczywiście nie można z góry zakładać, że pisząc teksty pod gotowy projekt zawsze już na starcie osłabiamy nieco stronę. Jasne, czasami uda się to zgrabnie połączyć, tylko większą spójność uzyskamy reagując grafiką na chociaż wstępny tekst niż odwrotnie.

Perspektywa projektanta…

Coraz więcej agencji interaktywnych chce wprawdzie zatrudniać swoich copywriterów, ale takie stanowisko wciąż nie jest standardem. W wielu firmach projektanci opierają się więc na treściach dostarczonych przez klientów, przez co często grafika i copywriting nie powstają razem, ale w pewnym oderwaniu od siebie.

Typowa sytuacja: projektant otrzymuje paczkę plików z nieuporządkowanymi tekstami, aby poznał ofertę marki i na podstawie tego przygotował wstępny projekt. Designer zwykle dysponuje jednak chaotycznym tekstem, który nie został odpowiednio wyselekcjonowany. Często nie ma w nim wyszczególnionych tzw. bullet points, a więc najważniejszych informacji, które wzbudzają ciekawość i w skondensowanej formie zapowiadają korzyści z posiadania produktu czy usługi.

Bez tego informacyjnego „mięsa” trudniej jednak stworzyć spójny projekt. Skąd grafik ma wiedzieć, co i jak pokazać, skoro nie jest w 100 proc. pewien, co marka chce powiedzieć swojemu klientowi? Skąd ma wiedzieć, na co położyć szczególny akcent? Owszem, firmy na etapie briefu mówią o swoich zaletach, ale jednak na gotowym tekście pracuje się inaczej. Nie mając przygotowanych tekstów, niektórzy wybierają więc sprawdzone, bezpieczne rozwiązania, tylko wiąże się z nimi pewne ryzyko: może powstać strona jakich wiele, a przecież nie o taką chodzi klientowi. 

Tworzenie wszystkiego na materiałach zastępczych mocno ogranicza więc projektanta. Nie pozwala na swobodne tworzenie, nie daje możliwości wyeksponowania konkretnych elementów, cech i opowiadania historii, jaką marka chce zaprezentować. Trudno tworzyć wtedy ilustracje, elementy infograficzne itd. Bez tego często łapiemy się tylko ogólników, a co za tym idzie, obie warstwy - ta tekstowa i wizualna - nie uzupełniają się wzajemnie. Brak tekstów może rodzić też konkretne problemy. Oto przykłady.

Pierwszy – tak częste obecnie tworzenie stron, których treści mają być tłumaczone na kilka języków. Problem szczególnie widoczny jest na urządzeniach mobilnych. Np. hasło promocyjne w języku polskim może zamknąć się tam w kilku krótkich wyrazach i będzie wyglądało dobrze. Jednak kiedy w grę wchodzi tłumaczenie chociażby na niemiecki, gdzie wyrazy bywają długaśne, treść nagle jest przenoszona na kilka wersów. To wymusza z kolei inne dzielenie wyrazów i odpowiednie wypoziomowanie stopnia pisma, bo przecież każda wersja tekstu musi prezentować się dobrze. Przy wielojęzycznych stronach lepiej więc od razu dysponować tłumaczeniami. 

Drugi – zaplanowanie ogólnego sposobu formatowania tekstu. Odpowiednie ułożenie treści ma oczywiście ogromne znaczenie (szczególnie pod mniejsze ekrany), dlatego takie kwestie jak wielkość fontu, szerokość kolumny oraz odstępy między wierszami i akapitami, to kluczowa sprawa. Tylko jak to trafnie zaplanować bez docelowego tekstu, nie wiedząc, gdzie będzie on dłuższy, gdzie skrótowy?

Dlatego najlepiej, jeśli na początku projektowania dysponujemy już przynajmniej wstępną wersją copy.

Projektowanie to jednak proces twórczy, dlatego często to grafik kieruje też copywritera na określone tory. Doświadczony designer doskonale wie przecież, co można efektownie pokazać, wyeksponować i kiedy wymagany może być określony format tekstu. Poza tym pamiętajmy, że żyjemy w kulturze obrazu i jest coraz więcej witryn, które opierają się głównie na nim. Przykładami mogą być np. strony agencji kreatywnych, artystów czy klientów z namacalnym produktem, który się eksponuje. W takich sytuacjach nie zawsze trzeba czekać na gotowe teksty, bo jednak nie słowo odgrywa tam główną rolę.

Relacje projektowo-copywriteskie zależne są więc w dużym stopniu od charakteru i wielkości realizacji. W tym tekście skupiamy się głównie na typowych stronach produktowych czy wizerunkowych i tam zawsze lepiej pracować na w miarę gotowej treści. Jednak przy bardziej rozbudowanych projektach, gdzie w grę wchodzi już szeroka analiza UX/UI, niekoniecznie tak jest. Przy większych serwisach bardzo często najpierw planuje się funkcjonalności, makietuje, prototypuje. Tak więc wiele zależy od okoliczności.

Perspektywa copywritera…

Teraz postawmy się w roli copywritera.

Oczywiście są różne szkoły: jedni wolą od początku samemu kreować treść, dzięki czemu nie muszą później mocno skracać lub rozwlekać tekstu, bo trzeba jakoś zapełnić miejsce; drugim zaś teoretycznie łatwiej jest pisać pod zaprojektowaną już powierzchnię. Piszący zna już bowiem przybliżoną liczbę znaków, wie w jakich miejscach komunikat musi być skrótowy, gdzie może pozwolić sobie na rozwinięcie, w którym miejscu trzeba zaplanować nagłówek itd. 

Pamiętając jednak o tym, że teksty mają duży wpływ na design, lepiej kiedy najpierw powstanie po prostu dobry kontent. Początkowo może nie być to łatwe. Pisanie, redagowanie czy selekcjonowanie materiałów bez gotowego projektu sprawia, że niekiedy trudno o punkt zaczepienia. Niby wiadomo, że webwriting to przede wszystkim krótkie, przyciągające uwagę teksty, ale to czasami za mało.

Dlatego w takiej sytuacji, oprócz dobrego pióra, ważne są przede wszystkim dwie kwestie: umiejętność selekcji materiału oraz dobra współpraca z projektantem. W ostatnim przypadku chodzi o to, że piszący zna styl pracy grafika i mniej więcej wie, czego oczekuje on od tekstów, a czego nie znosi. Trudno wprawdzie wypracować taki układ, kiedy jedna ze stron jest freelancerem, ale już w agencji jest to jak najbardziej możliwe.

Wyjaśnijmy to na przykładzie strony, którą projektowaliśmy klientowi zajmującemu się tworzeniem programów lojalnościowych i promocji dla firm. Nowa witryna była dość rozbudowana ze względu na bardzo złożoną ofertę, bogate portfolio i chęć pokazania całego procesu tworzenia promocji. Zanim projektant przystąpił do zasadniczej pracy, zaczęliśmy od przygotowania tekstów na najważniejsze podstrony: główną, ofertową, o nas i realizacje.

Osoba odpowiadająca za redakcję materiałów nie działała jednak oczywiście w próżni. Po wspólnych rozmowach z klientem i projektantem znała ogólną strukturę uwzględniającą np. krótkie opisy usług i licznik pokazujący skalę biznesu (główna), czy też sposób pokazania procesu usługowego (oferta). Grafik wskazał mu kierunek, ale reszta należała już do copywritera. Jego zadaniem była selekcja materiału, napisanie nowych tekstów, wybór struktury i sposobu pogrupowania treści, wskazanie, gdzie lepiej zastosować wypunktowania zamiast akapitów, gdzie lepszą robotę zamiast opisów zrobią piktogramy itd. Cały czas pozostając oczywiście na łączach z projektantem, bo chociaż ten czekał z docelowym projektowaniem, to jednak o obu warstwach myśleliśmy jednocześnie. 

Kiedy designer otrzymał już teksty zaakceptowane przez klienta, mógł przejść do przygotowywania konkretnych elementów strony. Mając kontent, wiedział na co postawić mocniejszy akcent i jak zaprojektować chociażby rysunki i grafiki, aby te nawiązywały do danego tekstu.

Przykład: nagłówkowi „Promocje to magnes, przyciągnij nimi klientów” towarzyszyła kreacja z magnesem, a sekcji o klientach grafika z elementami konkretnych branż. Taka korelacja nie byłaby przecież możliwa, gdyby projekt wyprzedzał teksty. Przy czym nie było też tak, że projektant nie wyrażał swojego zdania na temat kształtu tekstów. Jak najbardziej dawał feedback i w niektórych przypadkach poprawki były znaczące.

Tak naprawdę pełne graficzne pierwszeństwo miało jednak miejsce jedynie na tych podstronach, gdzie teksty wykorzystywano w znacznie mniejszym wymiarze, np. przy kontakcie, stronie zapraszającej do wypełnienia briefu. W tej sytuacji to osoba pisząca otrzymała gotowy projekt, do którego musiała już tylko dobrać odpowiednie microcopy.

Należy podkreślić jeszcze jedną kwestię: projektant, mając przed sobą gotowe teksty (o ile są dobre), nie musi też od początku zastanawiać się nad zaplanowaniem kolejności poszczególnych informacji. Ta ścieżka, którą ma podążać klient, w dużym stopniu została już przemyślana przez copywritera. Treści zostały rozplanowane w taki sposób, aby tworzyły pewną opowieść i każdy kolejny paragraf był kontynuacją poprzedniego.

Co z tymi treściami zastępczymi?

Przy okazji rozważań, na ile to teksty kształtują design i odwrotnie, warto też poruszyć temat wykorzystywania zastępczych treści. W jakich sytuacjach stosowanie wypełniacza się sprawdza, a kiedy lepiej poczekać na gotowe materiały?  

Oczywiście ilu grafików tyle opinii, ale naszym zdaniem tekst zastępczy - czyli nieśmiertelne lorem ipsum - na pewno jest przydatny przy regularnych układach w rodzaju formularzy, kafelków itd. Tam często microcopy dopisuje się później, bo sam kształt takich sekcji zależy mocno od makiet i testów, a z reguły bardzo krótka treść jest tam stała. Sytuacja wygląda inaczej, kiedy mówimy o blogu czy podstronie z aktualnościami. Takich miejsc nie projektuje się „na sztywno” pod określony tekst. Nie wymagają one konkretnego układu jednostkowego uwzględniającego semantykę, ale ustalenia ogólnego formatu, makiety w pewnym stopniu podobnej jak w przypadku makiet papierowych publikacji.

Projektanci różnie podchodzą do stosowania lorem ipsum także z innego względu - języka.

Ten powszechnie wykorzystywany łaciński tekst ma oczywiście swoje zalety. Jak wiadomo, przede wszystkim rozmieszczenie liter, ich kombinacje i spacjowanie sprawiają, że nawet bez znaków diaktrycznych dobrze naśladuje on prawdziwy język. Jednak niektórzy uważają, że lepiej wstawiać teksty o podobnym formacie i pisane w języku, w którym kontent docelowo będzie przygotowywany. Szczególnie jeśli mówimy o podstronach typowo do czytania. Trudno przecież do końca ocenić, jak zachowa się tekst, jak czytelny będzie, kiedy wrzucony materiał nie jest czymś podobnym do docelowej treści.

A jak Wy lubicie pracować? Jak często musicie stosować tekst zastępczy z powodu braku prawdziwych materiałów? Jak dużym jest to dla Was utrudnieniem?

Podsumowanie

Wszyscy zgodzimy się więc chyba, że teksty mają duże znaczenie w kontekście designu.  Zostawianie ich na sam koniec procesu projektowego lub tworzenie ich bez ścisłej współpracy z projektantem może osłabić stronę, bo ta nie będzie odpowiednio spójna. Grafikowi będzie trudniej o pomysłowe nawiązanie do kontentu, z kolei copywriter dostosowując się do gotowego projektu, nie skupia się tylko na jakości tekstów, ale też na konieczności dopasowania ich „pod ramkę”, co bywa problematyczne. W takim układzie znacznie wyższe jest też ryzyko poprawek. Z obu stron.

Wszystko sprowadza się więc do dobrej współpracy między copywriterem i grafikiem. Aby obaj byli plastyczni, potrafili wzajemnie dopasowywać swoje pomysły do tego, co będzie najlepsze dla klienta. Projekt to żywy organizm, dlatego raz to copywriter może przekonywać grafika do swoich racji, innym razem to projektant może mu zwrócić uwagę, że gotowy tekst po wrzuceniu w projekt wymaga jednak modyfikacji.

Współautor artykułu: Dagmara Kordulewska - projektant agencji interaktywnej Bloomnet.