Tożsamość wizualna zaczyna się od kontrastu: ciemna, nastrojowa sekcja hero eksponuje duży, czytelny nagłówek i oddziela przesłanie powitalne od jaśniejszych treści poniżej. Niebieskie wyróżnione karty stają się powracającym akcentem na tle szerokiej fotografii kościoła, z kolei morski turkus tworzy wyrazistszą płaszczyznę w warstwowej sekcji powitalnej. Białe karty i jasne obszary treści dają wytchnienie dla wzroku pomiędzy nasyconymi polami barwnymi.
Ciepłe fotografie sprawiają, że paleta nie wydaje się chłodna ani czysto instytucjonalna. Sekcja hero, zdjęcie kościoła, nakładający się kolaż powitalny, kompozycja poświęcona społeczności online oraz trzy panele fotograficzne wykorzystują zdjęcia jako spójny emocjonalny wątek. W części prezentującej liderów podejście to staje się bardziej osobiste dzięki trzem zaokrąglonym portretom ułożonym w równym rzędzie. Jednolite kadrowanie i układ kart zapewniają treściom skupionym na ludziach tę samą dyscyplinę projektową, co szerszym ujęciom wspólnoty.
Typografia dopełnia tożsamość. Duże nagłówki bezszeryfowe wyraźnie akcentują sekcje powitania, misji, liderów, wspólnoty, pytań i kontaktu, a obfite odstępy chronią kompaktowe karty i praktyczne wskazówki przed wrażeniem wizualnego ścisku. Ciemna stopka nawiązuje do kontrastu z początku strony i tworzy wyraziste domknięcie kompozycji. W połączeniu paleta, styl zdjęć, zaokrąglone sylwetki, akcenty kart i skala nagłówków tworzą gościnny język projektowy kościoła, który zachowuje czytelną rozpoznawalność na powiązanych podstronach, bez względu na to, czy prezentowane treści dotyczą misji, duszpasterzy, FAQ czy danych kontaktowych.
Korzystając z Kreator projektów stron internetowych, będziesz mógł dostosowywać kolory, czcionki, nagłówek i fooer, układ, kolumny i inne elementy projektu, a także zawartość i obrazy.
Użyj Ustawień motywu, aby określić wizualne podstawy witryny na wszystkich jej stronach i sekcjach. Ustaw globalne kolory, czcionki i typografię, aby witryna podążała za tym samym kierunkiem projektowania, zamiast stylizować każdą stronę osobno.
Wybierz schemat kolorów i kombinację czcionek, które pasują do charakteru witryny, a następnie dostosuj nagłówki H1-H6, zwykły tekst, linki, przyciski, cytaty, listy i inne style typograficzne. Spójne stosowanie tych ustawień pomaga stworzyć przejrzystą hierarchię wizualną i sprawia, że powtarzające się elementy projektu są rozpoznawalne w całej witrynie.
Użyj Efektów animacji, aby nadać witrynie bardziej dynamiczny i interaktywny wygląd. Elementy i kontenery mogą korzystać z efektów takich jak „Uruchom przy wyświetlaniu”, „Animacja po najechaniu kursorem” i „Synchronizacja animacji z przewijaniem”, aby wprowadzać treści w miarę poruszania się użytkowników po witrynie lub reagowania na interakcję użytkownika. Predefiniowane ustawienia animacji zapewniają gotowe efekty, które można dostosować do stylu wizualnego witryny.
Zastosuj ten sam kierunek projektowania do współdzielonych elementów witryny, takich jak nagłówek, menu i stopka. Panel ustawień motywu łączy w sobie wspólne elementy sterujące stylami dla całej witryny, ułatwiając zachowanie spójnego wyglądu w miarę rozszerzania witryny na wiele stron.
Dzięki takiemu obiegowi pracy szablon staje się użytecznym punktem wyjścia do tworzenia witryny internetowej o spójnej identyfikacji wizualnej, skoordynowanych kolorach i typografii, współdzielonych zasadach projektowania oraz interaktywnych efektach na wszystkich stronach.