Wprowadzenie

Sketch to aplikacja, która w ostatnim czasie zdobyła serca wszystkich, którzy projektują UI czy UX, choć tak naprawdę Sketch to program, którego nauczyć może się każdy. Oprócz licznych zalet, Sketch posiada także jedną dużą wadę - dostępny jest wyłącznie na platformę Mac OS. Jeśli jednak jesteś szczęśliwym posiadaczem Mac'a - grzechem byłoby nie wykorzystać potencjału, który tkwi w pracy w Sketch'u. Zapewniam Cię, że praca z grafiką i projektowanie interfejsów jeszcze nigdy nie było tak szybkie i przede wszystkim - przyjemne.

• Ustawienia Interfejsu

• Przegląd ważnych technik i skrótów

• Tips & Tricks

• Eksport grafik

• Narzędzia wektorowe

• Kolory, Ikony i Typografia

• Praca z symbolami

• Praktyczny Projekt UI

Dlaczego Sketch?

Ponieważ to aplikacja, która została stworzona wyłącznie w jednym celu - pracy z grafiką wektorową pod kątem UI. To dlatego Sketch zyskał ogromną przewagę nad narzędziami takimi jak Pohotoshop czy Illustrator, które są przeładowane funkcjami, a co za tym idzie - praca w nich staje się mniej wydajna. To tak, jakby chirurg podczas operacji nie używał precyzyjnego skalpela, tylko scyzoryka Swiss z dziesiątkami narzędzi. Szybsza praca, mniejsze pliki, lepsza wydajność a także dedykowane dla UI narzędzia i setki przydatnych pluginów napisanych przez społeczność sprawią, że szybko uzależnisz się od Sketch'a! Nie wspominając już o cenie, która jest w zasięgu każdego i braku konieczności subskrypcji!

Co w Kursie?

Kurs opracowałem tak, abyś poznał Sketch'a od najlepszej strony, mogąc w pełni wykorzystać jego potencjał. Niektóre zagadnienia, jak eksport grafik, lepiej wypunktować w krótkich lekcjach teoretycznych, natomiast inne, jak przygotowanie pod tworzenie nowego projektu - w praktyce. Dlatego podzieliłem Kurs na dwie części - w pierwszej otrzymasz skompresowaną do granic pigułkę wiedzy z przeglądem setek ważnych technik i skrótów klawiaturowych, tipsów i trików. Ta część została nagrana z ekspresową narracją i dzieje się w niej tak dużo, że zapewne będziesz wiele razy zatrzymywał wideo... o to chodzi! Wracaj do tych lekcji, kiedy tylko będziesz potrzebował odświeżyć podstawowe informacje. Druga część jest w 100% praktyczna, gdzie koncentrujemy się na wykorzystaniu poznanych w teorii technik do zaprojektowania kilku ekranów aplikacji inteligentnego domu. Dopiero obejrzenie obu części gwarantuje efekt w postaci przyswojenia potrzebnej wiedzy z aplikacji, ale także tego, jak tą wiedzę przełożyć na codzienną pracę z projektami.

Nowa Era w Projektowaniu UI

Ten Kurs to esencja nowego podejścia do projektowania nowoczesnych interfejsów użytkownika. Z trudem mogę pohamować entuzjazm z powodu kierunku, który wyznacza materiał jaki dla Ciebie przygotowałem. Kurs jest uzupełniony dziesiątkami dodatkowych technik i materiałów - jego przerobienie zapewne sprawi Ci dużo frajdy, jednak dopiero kiedy dowiesz się, że to dopiero początek wspaniałej przygody z nowoczesnymi narzędziami dla UI i UX Designerów, zrozumiesz, że otwiera się dla Ciebie zupełnie nowy rozdział. Kolejno pochłoną Cię narzędzia do prototypowania, tworzenia mikrointerakcj, w końcu eksportowania designu do front-endu i aplikacji, od czego dzieli nas naprawdę niewiele! To, jak szybko przejdziesz na drugą stronę lustra zależy tylko od Ciebie i od tego, czy podejmiesz wyzwanie z tego Kursu.

Skompresowana Teoria

Część teoretyczna to kompendium niemal wszystkich narzędzi, skrótów, tipów i tricków w Sketch'u, które niczym niebieska pigułka w Matrixie napełnią Twoją głowę pomysłami i oswoją z aplikacją. Będziesz do niej często wracał, ponieważ prezentowane techniki to wiedza, niekiedy tajemna, w najczystszej postaci. Mimo, że to teoria, nie będzie nudno!

Interfejs Sketch'a i Narzędzia

Dowiesz się jak sprawnie poruszać się po interfejsie aplikacji, jak zorganizować swoje pliki w Page czy Artboard'y, jak wyciągnąć maksimum z możliwości organizacji warstw, grup czy symboli. Poznasz też narzędzia, z których będziemy korzystać w dalszych częściach kursu.

Eksport Grafik

Poznasz rozmaite warianty eksportu grafiki, czy to w postaci finalnych plików dopasowanych idealnie do nowoczesnych urządzeń, czy czystego kodu SVG czy CSS. Dowiesz się jak przygotować komponenty do eksportu w ten sposób, aby wszystkie rozmiary i niezbędne formaty eksportowane były automatycznie.

Narzędzia wektorowe

Sketch w całości opiera się o wektory. Tworzenie ikon i praca z kształtami jest prosta, szybka i przyjemna. Atut takiego podejścia to możliwość wyeksportowania projektu na dowlone urządzenie i skalę. Poznasz dobre podejście do pracy z wektorami a także najważniejsze techniki i skróty, które zapewnią wysoką wydajność.

Kolory, Ikony i Typografia

W pracy z praktycznym projektem dowiesz się jak stworzyć Style Guide z kolorami, typografią czy jak wykorzystać ikony w taki sposób, aby były reużywalne w projekcie i abyśmy mogli zachować spójność, co jest niezwykle ważne w tworzeniu profesjonalnych interfejsów.

Praca z Symbolami

Symbole w Sketch to reużywalne komponenty, dzięki którym możemy budować złożone, spójne aplikacje w rekordowym czasie. To jedna z najbardziej potężnych funkcji nowych wersji Sketch'a, a zagnieżdżanie Symboli i ich zaawansowane ustawienia jak Override'y wykorzystamy w praktyce w naszym projekcie. Dzięki Symbolom praca w konwencji tzw. Atomic Design, czyli atomów, molekułów i organizmów - nabiera sensu i jest niezwykle wygodna, a eksport do CSS czy SVG jest w zasięgu ręki.

Praktyczny Projekt UI

W drugiej części Kursu skupimy się na stworzeniu kompletnego projektu w schemacie Mobile First. Na jego przykładzie poznasz konkretne zestawienia technik wykorzystywane w kontekście projektowym. Zaczniemy od konfiguracji Grida i ustawień Artbordów, przez projektowanie ikon i Symboli aż do gotowych plansz aplikacji. Ta wycieczka po konkretnych funkcjach Sketch'a nie tylko pozwoli Ci uporządkować wiedzę z części teoretycznej, ale także zrozumieć właściwe praktyki płynące z wielu projektów wykonanych w tej aplikacji.

Działający Prototyp

Na koniec, w oparciu o prostą metodę (tzw. Rapid Prototyping) i darmową aplikację Marvel App, stworzymy działający prototyp, który będziesz mógł wysłać np. z pomocą SMS na telefon, na którym można będzie go uruchomić. Zaplanujemy przejścia plansz oraz animacje, a wszystko to zrobimy w rekordowym czasie!

Prototypowanie w Sketch!

Nowość - kurs został rozszerzony o lekcję, w której dowiesz się jak działają funkcje prototypowania w aplikacji Sketch, które pozwalają szybko stworzyć działający, interaktywny prototyp aplikacji. Metoda, którą wykorzystujemy to tak zwane Rapid Prototyping, czyli szybkie prototypowanie w oparciu o przejścia plansz i hotspoty, na razie nie możemy natomiast tworzyć bardziej złożonych animacji czy mikrointerakcji. Na potrzeby prezentacji flow w naszym projekcie jest to jednak świetne rozwiązanie, a możliwość zaprezentowania takiego prototypu przez udostępnienie go w chmurze Sketcha czy podgląd na urządzeniu z pomocą aplikacji Sketch Mirror pozwala na przetestowanie Twojego projektu jeszcze w Sketchu!

Dla kogo jest ten kurs?

Sketch jest narzędziem, którego może (i powinien;) nauczyć się każdy użytkownik Mac'a. To prosta aplikacja, w której możesz pracować zarówno z grafiką wektorową, jak i edytować bitmapy. Osoby bardziej zaawansowane mogą zadać pytanie - po co się go uczyć, skoro to tak proste narzędzie. Okazuje się jednak, że pełny potencjał tego fantastycznego programu tkwi głębiej, a kolejne odkrywane techniki sprawią, że przeżyjesz wiele - 'a więc to tak można!' - momentów. Zdecydowanie jest to materiał, który zadowoli także osoby bardziej zaawansowane w projektowaniu UI, a nawet tych z Was, którzy już od jakiegoś czasu korzystają ze Sketch'a!

Sketch tylko na mac OS?

A co z użytkownikami systemu Windows? Cóż, to prawda, że Sketch dostępny jest tylko na komputery firmy Apple - istnieją jednak sposoby, aby korzystać z dobrodziejstw systemu mac OS również na PC i laptopach wyposażonych w bardziej popularny system Windows. Więcej o takich możliwościach przeczytacie tutaj. Nie jest to proste rozwiązanie i nie możemy polecać go dla każdego, ale wysiłek może okazać się wart zachodu - szczególnie, że większość nowoczesnych narzędzi do UI i UX designu dostępnych jest w wersjach na system mac OS.

Dlaczego wybrać właśnie ten kurs?

1. Kurs wideo to najbardziej efektywna a zarazem najprzyjemniejsza forma nauki. Jest on tak prowadzony, byś cały czas mógł go śledzić z zainteresowaniem i zaangażowaniem, a także czerpać satysfakcję ze zdobytej wiedzy!

2. Wiedza, którą otrzymujesz w tym kursie, to nie tylko sucha teoria, ale również wskazówki od praktyka z wieloletnim doświadczeniem, dzięki którym dużo łatwiej będzie Ci opanować materiał i pracować efektywniej.

3. Uczysz się na praktycznych przykładach. Kurs, który masz przed sobą to esencja praktycznej wiedzy i doświadczenia a także wzorów, które oszczędzą Ci godziny pracy i poszukiwań.