Ta strona używa ciasteczek (cookies), dzięki którym nasz serwis może działać lepiej. Rozumiem
15.09.2021

Jak zaprojektować portal do korepetycji? - case study

Każdy projekt to inna historia, dlatego każda z nich wymaga indywidualnego podejścia.

Od samego początku pracy nad nowym projektem, ogromną uwagę przykładamy do tego, aby zrozumieć, kim będzie odbiorca danego produktu. Takie podejście pomaga nam stworzyć produkt “szyty na miarę” nie tylko biznesu naszego klienta, ale z którego z przyjemnością będą korzystać również użytkownicy końcowi. 

Historia, którą chcemy Wam dziś odpowiedzieć dotyczy serwisu łączącego korepetytorów, uczniów i ich rodziców. Jak to zrobiliśmy? Zobaczcie (a raczej przeczytajcie) sami! 
 

Korzyści z projektowania według praktyk UX oraz UI


Idea, która towarzyszyła nam przy pracy nad projektem, to przede wszystkim stworzenie przyjaznego miejsca dla wszystkich użytkowników - zarówno dla klientów (uczniów, studentów i rodziców), jak i partnerów biznesowych (korepetytorów) serwisu. Niewątpliwie dużym wyróżnikiem tworzonego serwisu jest posiadanie własnej bazy nauczycieli. Aby móc zapewnić profesjonalną bazę tutorów, właściciele serwisu przeprowadzają dokładną weryfikację nowego użytkownika, co niewątpliwie wpływa na jakość oferowanych usług. 

Kolejnym ważnym aspektem, o którym nie mogliśmy zapomnieć przy pracy projektowej, był fakt, że platforma kierowana jest do różnych grup wiekowych. Dlatego też, zależało nam aby każda z osób korzystających bez problemów umiała się na niej odnaleźć. Nie mieliśmy wątpliwości - postawiliśmy na prosty i intuicyjny projekt, odpowiadający potrzebom kilku różnych person. Dla starszych odbiorców przygotowaliśmy rozbudowaną pomoc i jasne, czytelne menu. Myśląc o najmłodszych skorzystaliśmy z tego co już znają - stylowanie czatu na wzór Messengera. Dodatkowo biorąc pod uwagę wiedzę, że smartfon to najpopularniejsze urządzenie codziennego użytku w grupie wiekowej 14 - 18 lat (raport: “Cyfrowi tubylcy. Co warto wiedzieć o pokoleniu online”), zadbaliśmy o funkcjonalną wersję mobilną serwisu, która jest niezbędna, aby zapewnić jak najlepsze doświadczenie użytkownikom odwiedzającym witrynę z poziomu telefonu
 

Ale od początku


Zanim przeszliśmy do części projektowej, chcieliśmy poznać rynek korepetycji online. Przeprowadziliśmy analizę danych zastanych w Google Analytics aby móc następnie zdefiniować typy użytkowników serwisu. 

Przede wszystkim zależało nam, aby sprawdzić kto korzysta z usług korepetytorów. Zwróciliśmy uwagę na to, w jaki sposób użytkownicy kontaktują się między sobą - czy korzystają z formularzy dostępnych na stronach, czy może kontaktują się ze sobą bezpośrednio, pomijając platformę? Ponadto, chcieliśmy sprawdzić, czy istnieje moment grozy, w którym “technologia przerasta użytkownika” wskutek czego użytkownik porzuca swoją wizytę na stronie. 

Następnie przyszedł czas na warsztat z klientem. Po intensywnej burzy mózgów, wyodrębniliśmy kilka protoperson korepetytorów. W warstwie wizualnej i funkcjonalnej opracowaliśmy natomiast trzy główne oznaczenia (badge) przyznawane profilom w zależności od kluczowych cech:
  • Profesjonalista - to grupa nauczycieli, doktorów i profesorów, którzy na co dzień zawodowo zajmują się uczeniem innych,
  • 5+ doświadczenia (pasjonat) - to wszystkie te osoby, które mają dar przekazywania wiedzy i minimum pięcioletnie doświadczenie w nauczaniu innych,
  • Zweryfikowany (sprawdzony-potwierdzony) -  grupa osób, która przeszła weryfikację pozytywnie, potwierdziła swoją tożsamość oraz osiągnięcia naukowe czy doświadczenie. 
 

Nowe logo


Od naszego klienta dostaliśmy jeszcze jedno, (nie)łatwe zadanie - stworzyć nowe, proste, ale wyróżniające się logo firmy. Wydawać by się mogło, że to tylko mały niepozorny znaczek, jednak w rzeczywistości ma przecież dużo większą moc. Dobrze zaprojektowane logo może skutecznie zwiększać rozpoznawalność marki, a co za tym idzie - pozytywnie wpływać na efektywność marketingu. Dodatkowo, wyznacza dalszy kierunek designu. Wszystko musi być spójne i zgrane. 

Tak więc projektując identyfikacje wizualne dla naszych klientów, kierujemy się takimi zasadami: prostota, spójność z marką, ponadczasowość i... element zaskoczenia. Oczywiście nie chodzi nam tutaj o to, aby nagle wyciągać królika z kapelusza, ale w końcu chcemy, żeby identyfikacja wizualna klienta wyróżniała się od innych i była łatwa do zapamiętania. 
P101229522222 (1)-min

Projektowanie strony


Swoją prace nad projektem zaczęliśmy od zaprojektowania widoku strony startowej. Dzięki stałemu kontaktowi z klientem, mogliśmy na bieżąco zbierać feedback i od razu się do niego odnosić. Mając już zaakceptowane nowe logo i widok strony głównej, wiedzieliśmy, w którym kierunku chcemy zmierzać. Przeszliśmy więc do zaprojektowania najważniejszych, pod względem funkcjonalnym, podstron serwisu: wyszukiwarki korepetytorów oraz indywidualnej strony korepetytora.

Projektując wyszukiwarkę trzeba pamiętać zarówno o potrzebach różnych grup odbiorców, jak i oczekiwaniach klienta. Chcieliśmy, aby proces poszukiwania idealnego nauczyciela z jednej strony był nieskomplikowany, przystępny i szybki (konwersja!), a z drugiej dostarczał najpotrzebniejszych i wystarczająco szczegółowych informacji. Dlatego dla szybkiego zweryfikowania korepetytorów i ich doświadczenia, wprowadziliśmy wyróżniki. Jak to działa? Aby rozpocząć proces wyszukiwania wystarczy, że użytkownik wybierze przedmiot oraz poziom. Lista wyników pokaże dodatkowe informacje, takie jak doświadczenie, miejsce lekcji, cena i krótki opis “O mnie”, a po kliknięciu w zdjęcie nauczyciela, można zapoznać się z krótkim autopromocyjnym filmikiem. Dla bardziej wnikliwych użytkowników zadbaliśmy również o możliwość skorzystania z rozbudowanych filtrów, które umożliwiają szukanie idealnego kandydata po dostępności, doświadczeniu czy lokalizacji. Pamiętając przy tym wszystkim, jak ważna jest warstwa graficzna, postawiliśmy na jasne kolory i czytelne ikony.
Tutot-search (1)
Przechodząc do widoku strony korepetytora, zależało nam przede wszystkim na tym, aby informacje były przejrzyste i uporządkowane według kategorii: 
  • harmonogram zajęć - umożliwia sprawdzenie dostępności danego korepetytora 
  • i bezpośrednią rezerwację lekcji na stronie, 
  • o korepetytorze - wizytówka danego nauczyciela, zarówno w formie pisanej, jak i video, 
  • przedmioty i obszar działania - tu znajdują się wszystkie najważniejsze informacje związane już bezpośrednio z prowadzeniem lekcji, takie jak miejsce zajęć, przedmioty i doświadczenie,
  • opinie o korepetytorze - miejsce na komentarze uczniów, którzy mieli już doświadczenie z danym nauczycielem.
Dodatkowo z poziomu strony korepetytora uczeń (lub jego rodzic) może zamówić lekcję albo skontaktować się bezpośrednio z nauczycielem.   

Kolejnym ważnym aspektem, była kwestia rejestracji. Podzieliliśmy rejestrację na dwie ścieżki, w zależności od celu w jakim użytkownik trafia na stronę. Aby zarejestrować się jako uczeń, bądź rodzic wystarczy podać email i ustawić hasło. 
Rejestracja dla przyszłych korepetytorów jest nieco dłuższa i bardziej szczegółowa. Klientowi zależało na tym, aby w swojej bazie mieć sprawdzonych, wykwalifikowanych nauczycieli. Dlatego każda nowa osoba, chcąca zostać nauczycielem musi przejść dokładną weryfikację. Aby nie przerazić tutorów ilością potrzebnych do uzupełnienia informacji, podzieliliśmy rejestrację na trzy, niezbędne do wypełnienia, etapy: najpierw informacje personalne, potem zakres działalności wraz z koniecznością wgrania dokumentów potwierdzających kwalifikacje oraz uzupełnienie swojej wizytówki w postaci filmiku zapoznawczego. Ostatni etap rejestracji polega na zweryfikowaniu umiejętności i wiedzy potencjalnych nauczycieli przez administratora serwisu. 
Tutor-Registration

Projektowanie dashboardu


Kolejnym ważnym krokiem ścieżki użytkownika jest to, co czeka na niego zaraz po zalogowaniu się na konto. Tak więc projektując dashboard zależało nam, aby był przyjazny i zachęcający do dalszej wizyty. Nie zapominając o różnych potrzebach odbiorców serwisu, stworzyliśmy dwa różne widoki panelu użytkownika - dla uczniów bądź rodziców oraz dla nauczycieli. 

Zacznijmy od panelu ucznia: logując się na swoje konto, użytkownik ma dostęp do najważniejszych informacji dotyczących jego lekcji czy korepetytorów. Z poziomu panelu użytkownika można wyszukać, jak i zarezerwować lekcje. W wolnej chwili może również uzupełnić swoje dane, łącznie ze zdjęciem, jak również podpiąć kartę płatniczą, co z kolei upraszcza proces płatności - nie trzeba wpisywać za każdym razem numeru karty, uff! 
Dodatkowo, z poziomu panelu użytkownika istnieje możliwość wykupienia pakietu lekcji, co jest dużym ułatwieniem dla heavy userów serwisu. Zamiast płacić za każdą lekcje osobno, można zapłacić tylko raz i korzystać z różnych nauczycieli, a informacja o tym, ile lekcji pozostało, wyświetla się na dashboardzie. Zebranie wszystkich najważniejszych informacji w jednym miejscu sprawia, że proces rezerwacji zajęć jest maksymalnie prosty, a w dodatku nie zajmuje dużo czasu.
Harmonogram (2)

Dla korepetytora najważniejsza jest lista zgłoszeń chętnych uczniów, dlatego zależało nam, aby informacja o zgłoszeniach była wyeksponowana i łatwo dostępna. Kolejną pomocną rzeczą w pracy nauczyciela, którą dodaliśmy do panelu użytkownika, jest niezawodny kalendarz. Inspirowany systemem Kanbanowym, możliwy do samodzielnej edycji, znacznie ułatwia proces rezerwacji lekcji. Co ważne, informacja o dostępności jest również widoczna dla potencjalnie zainteresowanych uczniów. Dodatkowo z panelu użytkownika, tak samo jak w przypadku uczniów, istnieje możliwość edycji profilu.
Harmonogram (3)

 

"W ramach zawartej umowy, firma JCD.PL wsparła nas w procesie rebrandingu marki, tworząc projekt identyfikacji wizualnej, dostarczając nam nowe logo i realizując na podstawie audytu eksperckiego projekt graficzny nowej wersji strony Edualy.com. Współpraca z przedsiębiorstwem należy do bardzo udanych, ze względu na najwyższą jakość dostarczonych projektów. Należy pochwalić starania i zaangażowanie wykonawcy, by oferowane przez niego usługi były na najwyższym poziomie.
Przedsiębiorstwo doskonale spełniło się w zakresie terminowości usług. Prace świadczone przez firmę zostały wykonane zaskakująco sprawnie i z wyprzedzeniem terminów. Z pełnym przekonaniem rekomenduję firmę JCD.PL jako wartościowego i solidnego partnera."

Tomasz Sasinowski
Prezes Zarządu TS Group sp. z o.o.


Podsumowanie


Zakończyliśmy tę historię całkiem rozbudowanym projektem, w którym pierwszoplanową rolę gra odbiorca. Łączenie ze sobą celów biznesowych klientów z potrzebami użytkowników i w dodatku ubranie tego w przyjemny dla oka interfejs, to podstawowe wyzwanie w tego typu projektach.

W przypadkach, takich jak tutaj, gdy kluczowe grupy odbiorców różnią się między sobą potrzebami, szczególnie ważne jest strategiczne podejście w projektowaniu UI i UX. Uwzględnienie wielu punktów widzenia i praca zespołowa: projektanta, researchera, stratega, wraz z aktywnym udziałem klienta w procesie projektowym, pozwala osiągnąć zamierzone efekty oraz zapewnić wartość dla użytkownika
 

Udostępnij:
Aleksandra Bajtek

Marketing & Project Manager

Stwórzmy razem coś niesamowitego!

Napisz do nas!