Dwujęzyczna strona internetowa dla malarki — case study Monnciart

Po latach prowadzenia firmy i wychowywania dzieci Pani Monika wróciła do swojej pierwszej pasji — malarstwa.

Potrzebowała profesjonalnej strony internetowej, która pokaże jej twórczość pod marką Monnci Art zarówno polskiej, jak i zagranicznej publiczności.

Powrót do malarstwa i potrzeba profesjonalnej strony

Pani Monika rysowała, odkąd pamięta. Jako dziecko zamieniała zwykłe kartki papieru w małe, kolorowe historie. Rysunek był dla niej naturalnym sposobem wyrażania emocji.

Potem przyszło dorosłe życie. Rodzina, dzieci, prowadzenie firmy, która przez lata dawała stabilność. Sztuka zeszła na dalszy plan — choć nigdy nie zniknęła.

Gdy dzieci dorosły i założyły własne rodziny, Pani Monika wróciła do malarstwa. Nie jako hobby na boku, ale jako główną twórczą przestrzeń pod marką Monnci Art.

Powrót po latach przerwy oznaczał start od zera również w internecie. Potrzebna była strona, która:

  • pokaże obrazy i wystawy w sposób godny profesjonalnej galerii, nie prywatnego bloga,
  • dotrze nie tylko do polskich odbiorców, ale i zagranicznych kolekcjonerów oraz kuratorów,
  • pozwoli samodzielnie dodawać nowe prace i informacje o wystawach, bez czekania na programistę przy każdej aktualizacji.

Gotowe szablony motywów WordPress nie dawały takiej elastyczności. Wymagały kompromisów w układzie galerii, w obsłudze dwóch języków i w sposobie prezentacji wystaw. Zapadła decyzja o budowie motywu od podstaw, dopasowanego dokładnie do tego, jak Pani Monika chce pokazywać swoją twórczość.

Autorski motyw WordPress zamiast gotowego szablonu

Prace nad motywem zaczęły się od szkieletu — pustej struktury, na której później powstało wszystko inne. Fundamentem stał się framework UIkit 3, a zarządzanie treścią oparto o ACF (Advanced Custom Fields).

Pierwsze tygodnie to nawigacja: sticky header, menu mobilne w formie offcanvas, przełącznik języka widoczny od pierwszego ekranu. Drobny szczegół, ale to on decyduje, czy zagraniczny odwiedzający w ogóle zauważy wersję angielską.

Kolejnym krokiem był system opcji motywu w WordPressowym Customizerze. Zamiast na stałe wpisywać kolory, czcionki i teksty w kodzie, Pani Monika dostała panel, w którym może je zmieniać sama — bez znajomości programowania i bez proszenia o pomoc przy każdej drobnej korekcie.

Budowa motywu trwała od końca marca do połowy czerwca — niespełna trzy miesiące pracy prowadzonej etapami:

  • fundament i nawigacja,
  • design system w Customizerze,
  • typy treści na wystawy, aktualności i galerię,
  • dwujęzyczność,
  • dopracowanie szczegółów i test przed startem.

Sam czas trwania w dużej mierze wynikał z projektu graficznego, nie z kodowania. Pani Monika, jako malarka, miała bardzo konkretną wizję tego, jak strona ma wyglądać — i słusznie nie chciała iść na kompromisy. Projekt graficzny wykonała pracownia Oria Design, dopracowując układ i szczegóły wizualne do momentu, aż w pełni odpowiadał tej wizji.

Taki podział pozwolił oglądać efekty na bieżąco, zamiast czekać na jedną dużą premierę na końcu. Każdy etap dało się przetestować i poprawić, zanim powstał kolejny — mniej niespodzianek tuż przed uruchomieniem strony.

Pełna wersja polska i angielska

Dwujęzyczność brzmi prosto — dopóki nie trzeba jej wdrożyć w praktyce. Do tłumaczeń użyto Polylang w darmowej wersji, co oznaczało kilka twardych ograniczeń do obejścia ręcznie w kodzie.

Pierwszy problem: slug adresu URL dla wpisów z niestandardowych typów treści (wystaw, aktualności) w wersji angielskiej. Polylang Free nie robi tego automatycznie — trzeba było dopisać własną logikę, która rozpoznaje tłumaczenie wpisu i buduje poprawny angielski adres.

Drugi problem dotyczył nagłówków i etykiet. Część tekstów na stronie nie pochodziła wprost z treści wpisu, tylko z opcji motywu albo z automatycznych fallbacków. Trzeba było zadbać, żeby każdy z tych tekstów też miał swoją wersję angielską — łącznie z podpisami przy udostępnianiu w mediach społecznościowych.

Trzeci problem to strony archiwalne — listy wszystkich wystaw czy aktualności. Bez dodatkowej pracy pokazywałyby wpisy w złym języku albo mieszankę obu. Rozwiązaniem był własny filtr zapytań, który sprawdza aktualny język strony i pokazuje tylko pasujące wpisy.

Rezultat tej pracy nie widać na pierwszy rzut oka — i o to chodziło. Odwiedzający z zagranicy przełącza język i dostaje stronę, która wygląda, jakby od początku była pisana po angielsku, a nie doklejona później jako dodatek.

Zarządzanie wystawami i galerią bez programisty

Strona opiera się na dwóch własnych typach treści: Wystawy i Aktualności. Każda wystawa to osobny wpis z własnym opisem, datą i zdjęciami — nie jeden długi artykuł, do którego trzeba dopisywać kolejne akapity.

Galeria prac początkowo działała jako osobny, trzeci typ treści. W praktyce okazało się to niepotrzebnym rozdrobnieniem — prace z galerii i tak najczęściej wiążą się z konkretną wystawą. Padła decyzja o refaktoryzacji: galeria trafiła do zwykłego szablonu strony, powiązanego z wystawami przez pola ACF. Mniej miejsc do zarządzania, prostszy panel administracyjny.

Do galerii doszły też filtry — ikony pozwalające przełączać widok, przygotowane osobno dla polskiej i angielskiej wersji językowej. Paginację, czyli podział długiej listy prac na strony, przeniesiono do opcji motywu, żeby Pani Monika mogła sama zmienić liczbę pokazywanych elementów bez ingerencji w kod.

Dzięki temu dodanie nowej wystawy wygląda tak samo prosto, jak napisanie nowego wpisu na blogu: tytuł, opis, zdjęcia, zapisz. Bez telefonu do programisty, bez czekania na wolny termin, bez dodatkowych kosztów przy każdej aktualizacji. To był jeden z głównych celów całego projektu — i dokładnie do tego motyw został zaprojektowany.

Dostępność i dopracowanie przed startem

Wystawy sztuki odwiedzają też osoby z niepełnosprawnościami, dlatego strona dostała własny system etykiet dostępności — informacji o tym, jak przystosowane jest dane miejsce czy wydarzenie. Kolory i przezroczystość etykiet można dowolnie dostroić, od pełnej przejrzystości po pełne nasycenie barwy, a same treści etykiet edytuje się w opcjach motywu, bez dotykania kodu.

Podobnie potraktowano formularz kontaktowy. Zamiast gotowego wtyczkowego okienka, powstał modal kontaktowy dopasowany kolorystycznie i stylistycznie do reszty strony — spójny szczegół, który łatwo pominąć, a widać jego brak.

Przed samym uruchomieniem strona przeszła runda porządków: przegląd SEO, sprawdzenie wydajności, weryfikacja wszystkich linków i działania galerii. Dopiero po tym etapie strona trafiła do publikacji.

Dziś Monnci Art to strona, która:

  • prezentuje wystawy i prace w dwóch językach bez kompromisów w żadnym z nich,
  • pozwala Pani Monice samodzielnie dodawać nowe wystawy i aktualności,
  • informuje o dostępności wydarzeń dla osób z niepełnosprawnościami,
  • rośnie razem z jej kalendarzem wystaw — bez potrzeby przebudowy przy każdej zmianie.

Powstała dokładnie taka strona, jakiej szukała artystka wracająca do malarstwa po latach przerwy: profesjonalna, dwujęzyczna i w pełni jej własna.

Opinia klientki

Strona w pełni spełnia moje oczekiwania — jest estetyczna, przejrzysta i funkcjonalna, a przy tym została starannie dostosowana do moich wymagań, wybranej kolorystyki oraz wszystkich zgłaszanych przeze mnie sugestii. Ułatwia mi samodzielne dodawanie nowych wystaw, aktualności i prezentowanie prac. Współpraca przebiegała bardzo sprawnie, z dużym zaangażowaniem, cierpliwością i zrozumieniem potrzeb artysty. Zdecydowanie polecam taką współpracę z panem Pawłem innym osobom z branży twórczej, które chcą profesjonalnie zaprezentować swoją działalność w internecie.

Potrzebujesz podobnej strony dla swojej twórczości lub firmy?

Napisz do mnie i opowiedz o swoim projekcie.

Ten adres pocztowy jest chroniony przed spamowaniem. Aby go zobaczyć, konieczne jest włączenie w przeglądarce obsługi JavaScript.