Prosta, ale przykuwająca oko strona internetowa? Oto, jak kilkoma kreatywnymi trikami stworzyłam projekt, który nadał stronie CodeCraft wyjątkowy charakter.
Wytyczne – świeże spojrzenie
Firma CodeCraft zgłosiła się do mnie w trudnej sytuacji — poprzedni grafik, u którego zamówili oni projekt swojej nowej strony, niestety nie spełnił ich oczekiwań, dlatego potrzebowali świeżego spojrzenia. Wymagania co do stylistyki były jasne: nowa strona miała być minimalistyczna, ale przykuwająca wzrok. Jako firma działająca w sektorze IT, CodeCraft chciało, aby ich strona była nowoczesna i skierowana do młodych, ambitnych klientów. Główne cele strony to budowanie zaufania do marki oraz zachęcenie do skorzystania ze sklepu z materiałami edukacyjnymi. Projekt miał być zrealizowany na Wordpressie przy użyciu Elementor Pro.
Odważny design system
Pracę jak zawsze rozpoczęłam od stworzenia design systemu odzwierciedlającego założenia marki. Wybrałam kolorystykę oddającą minimalistyczny charakter — biel i szarości — z akcentami limonkowej żółci, która przykuwa wzrok do buttonów oraz banerów reklamowych. Dla przełamania monotonii dodałam jasnobłękitne elementy. Dodatkowo wybrałam siedem pastelowych odcieni z całej gamy barw, które posłużyły jako subtelne wyróżniki dla elementów takich jak tagi na blogu.
Przy projekcie standardowo zastosowałam 12-kolumnowy podział pozwalający na bezproblemowe zbudowanie responsywnej strony.
Projekt kluczowych zakładek
Na podstawie wypracowanego design systemu stworzyłam projekt trzech kluczowych zakładek: strony głównej, oferty oraz bloga. Znalazły się tam sekcje takie jak:
- Oferta kursów,
- CodeCraft w liczbach,
- Opinie kursantów,
- banery reklamowe zachęcające do przejścia do sklepu.
Kolor limonkowy użyłam przede wszystkim przy buttonach oraz banerach, które jako elementy zachęcające użytkownika do podjęcia działania, powinny najbardziej rzucać się w oczy.
Zdjęcia koncentrują się na zadowolonych klientach, podświadomie budując pozytywne skojarzenia i zaufanie do marki. Aby urozmaicić ich wygląd, zastosowałam cienkie ramki i zaokrąglone narożniki, które nawiązują stylem do przycisków.
Baza wiedzy
Na szczególną uwagę zasługuje “Baza wiedzy”. Przygotowane wcześniej pastelowe kolory akcentowe znalazły tutaj zastosowanie przy tagach — mają one za zadanie wyróżnić konkretne tematy postów, jak również urozmaicić wizualnie podstronę. W bocznej kolumnie umieściłam baner reklamowy zachęcający do przejścia do sklepu — subtelne, ale skuteczne rozwiązanie zwiększające wyświetlenia sklepu.
Podsumowanie
Cały proces, od pierwszego kontaktu, przez projektowanie i modyfikacje, aż po dostarczenie pliku w Figmie, zamknął się w tygodniu. Efekt? Nowoczesna, minimalistyczna strona internetowa, która przyciąga uwagę i wzmacnia charakter marki CodeCraft.
