W ciągu 10 godzin, zrozumiesz kluczowe techniki projektowania najważniejszych komponentów, na które składa się wiedza o: kolorach, przyciskach, formularzach, typografii, ostępach, przestrzeni, elementach typu checkboxy, polach, lischt i tabelach.

Kolory

Spory rozdział kursu został poświęcony kolorom. To tutaj dowiesz się jak od podstaw zaprojektować palety kolorów mając wybrany tylko jeden, główny kolor. Utworzysz do niego odcienie oraz paletę szarości. Pokażę Ci również jak ten proces zautomatyzować.

Dowiesz się jak tworzyć nowoczesne, subtelne cienie, ustawiając odpowiednie parametry. Poznasz 3 rodzaje cieni jak: Umbra, Penumbra, Ambient. Zobaczysz również jak tworzyć dobrze wyglądające gradienty.

Przyciski

To elementy, dzięki którym kupujesz lub zapisujesz się do newslettera, czy pobierasz ebooka. Poznasz ich hierarchię oraz podział. Zobaczysz jak projektować stany przycisków oraz ustawić typografię i odpowiednie odległości.

Formularze

Jednym z ważniejszych elementów projektów są formularze. Warto zadbać o prawidłowe zaprojektowanie, ponieważ często to w głównej mierze od nich zależy konwersja. Na początek poznasz anatomię formularza, gdzie zobaczysz czym jest etykieta, kontenery, pola zastępcze, podpowiedzi.

Zobaczysz jak dobierać kolory na potrzeby formularza, jak ułożyć tekst pomocniczy oraz etykiety. Idąc dalej nauczysz się tworzyć stany pól formularza.

Checkboxy, pola, switche

W kursie poznasz zasady projektowania oraz stosowania opcjonalnych komponentów jakimi są checkboxy, pola wyboru, switche czy listy rozwijane. Zobaczysz jak podjąć decyzję, kiedy zastosować pole, a kiedy checkbox.

Zobaczysz jak dobierać kolory na potrzeby formularza, jak ułożyć tekst pomocniczy oraz etykiety. Idąc dalej, nauczysz się tworzyć stany pól formularza.

Tabele

Projektowanie ui, to często też wizualizacja danych. Tutaj warto posiąść wiedzę na temat projektowania tabel. Dzięki temu możesz zaprojektować listę produktów w sklepie czy wyniki filtrowania i sortowania.

Ostępy i przestrzeń

Dobry projekt charakteryzuje się odpowiednio ustawioną przestrzenią. Pokażę Ci, jak pracować z wolną przestrzenią, zarówno całego projektu jak i wewnątrz poszczególnych komponentów, jak karty, przyciski, ikony. Zobaczysz jak ustawić padding i marginesy.

W tym rozdziale przekażę Ci wiedzę na temat wykorzystania wizualnych separatorów oraz rodzajów siatek.