Elementy UI na stronie socjomania.pl

Poniżej zamieszczam podgląd paru rozwiązań projektowych zaimplementowanych na nowej stronie firmy Socjomania.

O procesie jej powstania przeczytacie w dedykowanym temu artykule.

Strona zbudowana jest z czterech głównych kolorów, które są przypisane do głównych usług Socjomanii:
• Konsulting—czerwony
• Szkolenia Otwarte — fioletowy
• Szkolenia dedykowane—zielony
• Strategia digital—żółty

Każda podstrona usługi głównej, składa się z dwóch kolorów: koloru głównego oraz koloru uzupełniającego.

Kolor uzupełniający wykorzystywany jest do elementów takich jak hover color czy kolor ikon na podstronie.

Kolorem głównym pozostałych podstron jest kolor czerwony.

👉 Widok listy z opisem

Używany do przedstawienia oferowanych usług lub jako lista kroków (1,2,3…) procesu współpracy.

Pomysł na skondensowany opis oferowanych usług

👉 Latające kropki jako nowy „klucz wizualny”

Nowym kluczem wizualnym strony i identyfikacji stały się latające kropki, które nawiązują do animacji reakcji w live wideo na Facebooku.

Karuzela z konsultantami i latającymi kropkami–nowym kluczem wizualnym identyfikacji.

👉 Moduł do prezentacji przykładowych tematów Szkoleń Dedykowanych

Alternatywny moduł do prezentacji oferty Szkoleń Dedykowanych

👉 Moduł FAQ

Umieszczany jako zajawka” pełnej podstrony z FAQ. Pytania w tym komponencie są wybierane indywidualnie, w zależności od usługi, przy której jest umieszczony.

Moduł FAQ, pokazujący odpowiedzi na parę najczęstszych pytań, który przenosi do podstrony z wszystkimi pytaniami, na temat wszystkich usług.

👉 Interaktywna stopka

Nad stopką znajduje się wizualizacja „idei firmy”, która pokazuje usługi Socjomanii, jako etapy. Ma to na celu pokazanie, że oferta firmy jest spójną ścieżką.

Stopka z interaktywnym elementem.

👉 Karuzela z zespołem i opisem ich osobowości

Karuzela ze zdjęciami i opisem zespołu na podstronie Zespół

👉 Alternatywny moduł do przeglądania zespołu

Możliwość przeglądania zespołu przez przypisane im tagi.

👉 Filtry w Szkoleniach Otwartych

Możliwość filtrowania szkoleń ze względu na poziom, miasto i temat.

Filtrowanie szkoleń

👉 Harmonogram szkoleń

Widok wszystkich szkoleń w danym miesiącu, jako alternatywny widok dla listy szkoleń.

Harmonogram szkoleń

👉 „Inne terminy”

Szybki link pozwalający na przeglądniecie innych terminów szkoleń.

👉 Mini koszyk

Mini koszyk pozwala na zmianę liczby uczestników oraz terminu.
Wyciemnienie tła ma na celu wyeksponowanie elementu i skupienie uwagi użytkownika.

Mini koszyk

👉 Rejestracja przez koszyk

Rejestracja przez koszyk

Chętnie poznam Wasze wrażenia i opinie na temat nowej strony lub przedstawionych tutaj rozwiązań

Zapraszam do wymiany słów na LinkedIn lub Facebooku. 👋