Projektowanie UI: Przyciski w interfejsie

0:00Cześć! Nazywam się Natalia Bienias i na co

0:02dzień pracuję w firmie projektowo badawczej Mobeedick, a także jestem autorką bloga i

0:07kanału na YouTube by Zebza poświęconego projektowaniu.

0:11W tym kursie opowiadam o często używanych komponentach interfejsów graficznych.

0:16Oglądając realizacje innych projektantów i agencji, testując rozwiązania

0:21zainstalowane w naszych telefonach widzimy skończoną całość.

0:26Ale zanim przejdziemy do zaprojektowania

0:27całego ekranu czy wielu ekranów składających się na aplikację, dobrze jest

0:32poznać podstawę, czyli najmniejsze klocki, z których są zbudowane.

0:36Wiedza i świadomość tego, jak działają i po co są używane.

0:40Pewne rozwiązania pozwalają projektantom bardziej dopasowywać je do swoich potrzeb

0:45i planować, jak będą wyglądać nie tylko w podstawowym stanie.

0:50Tworząc statyczne projekty w programach do

0:52projektowania łatwo zapomnieć, że interfejs jest bytem dynamicznym,

0:57zmieniającym się pod wpływem działań użytkownika.

1:00A to oznacza, że musimy przewidywać, jak

1:03będzie się zachowywał pod wpływem tej interakcji, jak zmieni się wygląd

1:06komponentów i gdzie będą te zmiany się pojawiać.

1:10Komponenty interfejsu są bazą do

1:12mądrzejszego projektowania użytecznych interfejsów.

1:16Ta wiedza jest niezbędna dla projektantów interfejsów, osób zajmujących się web

1:21design'em, ale także projektantów UX czy frontend developerów, którzy chcą

1:26poznać tworzenie produktów również od tej wizualnej i funkcjonalnej strony.

1:31W kursie pokazuję rozwiązania stosowane na stronach internetowych i w aplikacjach

1:35desktopowych, a także na urządzeniach mobilnych, dotykowych.

1:39To także przykłady bazujące na popularnych design systemach, takich jak Material

1:44Design, Human interface guidelines od Apple, Carbon Design z IBM czy Flaunt od Microsoftu.

1:51Pokazują też przykłady z frameworków, z których mogą korzystać

1:55deweloperzy, z którymi przyjdzie nam, projektantom pracować.

1:59Oczywiście w tak krótkim kursie nie da się

2:01pokazać wszystkich różnic między systemami, ale wskazuję źródła, z których

2:05możemy czerpać informacje i szukać dalszych wytycznych.

2:09Jeżeli projektujemy rozwiązanie na

2:11konkretny system, w pierwszej części przechodzimy przez przyciski.

2:15Pokazuję na co zwrócić uwagę projektując

2:17je i z jakimi typami przycisków możecie się spotkać.

2:20Kolejna część to formularze, czyli jeden z

2:23powszechniejszeych elementów stron i aplikacji.

2:26Poznacie tu podstawowe kontrolki, z

2:28których można złożyć prosty i bardziej skomplikowany formularz.

2:32Opowiadam o dobrych praktykach i zwracam uwagę na często spotykane błędy.

2:36Następnie omawiamy zakładki tak zwane taby

2:39i wspominam również o alternatywnych rozwiązaniach dla tego komponentu.

2:44Poznacie tu również kilka ciekawych wniosków z badań nad sklepami online,

2:48które mogą wpłynąć na to, w jaki sposób będziecie je tworzyć.

2:52Kolejne lekcje to listy i tabele.

2:54I choć nie brzmią zbyt fascynująco, to

2:56znów wzorce, które stosujemy na wielu, nawet prostych stronach.

3:01Tu dowiecie się jak można zaprojektować tabelki w wersji mobilnej.

3:05Wspominam również o takich wzorcach jak sortowanie i filtrowanie treści.

3:10Na sam koniec zostawiłam temat wyskakujących okien.

3:13I niech nie zmyli was nazwa nie będę mówić o irytujących wyskakujących reklamach, ale

3:18poruszam tu kwestie dotyczące komponentów, których zachowanie polega na pojawianiu

3:22się nad główną treścią, by przekazać dodatkowe informacje.

3:26To okienka modalne, tooltip'y i komponenty wykorzystywane do notyfikacji.

3:31Na końcu każdej części przygotowałam również zadanie domowe.

3:34Żaden kurs nie sprawi, że nagle nauczymy

3:36się projektować, żeby tworzyć skuteczne i dobre projekty.

3:40Oprócz zrozumienia podstaw i nauczenia się

3:42teorii, musimy również przejść do praktyki i przećwiczyć zdobytą wiedzę.

3:46Czasami jednak brakuje pomysłów, co stworzyć.

3:48Dlatego gotowe zadania możecie wykorzystać

3:50właśnie do ćwiczeń czy uzupełnienia swojego portfolio.

3:54Nie przedłużając, zacznijmy od pierwszej części, czyli przycisków.