Strony WWW z SystemFlow

Wstęp do kursu

Koszyk Koszyk
  • Opis
  • Recenzje
  • Autor
  • Transkrypt
  • Pytania i odpowiedzi
  • QA

0 ocen

Wprowadzenie

SystemFlow to framework stworzony z myślą o niezwykle wydajnej pracy w Webflow. Jeśli tworzysz strony dla klientów i chcesz znacznie przyspieszyć swoją pracę w Figma oraz Webflow - ten kurs powstał właśnie dla Ciebie! Omawia on wszystkie ważne składowe i koncepcje SystemFlow, pokazując podejście systemowe do projektowania. Sam SystemFlow zawiera dziesiątki gotowych do użycia komponentów i ponad 1000 klas CSS, które pomogą Ci zapanować nad prostymi i bardziej złożonymi projektami. Sam SystemFlow oraz dostęp do Webflow czy Figmy należy wykupić osobno, ale w kursie znajdziesz kupon o wartości około 100 zł, którym obniżysz cenę SystemFlow przy jego zakupie.

  1. Omówienie dokumentacji SystemFlow
  2. Praktyczny Case Study - Tworzenie strony
  3. Praca z UI Kitem w Figma
  4. Live Componenty
  5. Korzystanie z klas i tokenów
  6. I wiele więcej!

Tworzenie prostych stron i Landing Page'y

Duża część naszej pracy sprowadza się do projektowania prostych stron - wydarzeń, małych sklepów, ofert, landing page'y. SystemFlow znacznie upraszcza i przyspiesza naszą pracę w tym zakresie, oferując szereg gotowych komponentów, sekcji i template'ów, które możesz wykorzystać do poskładania takiej strony w kilka minut.

Od Figmy do Webflow

SystemFlow jest w całości zmapowany na Figmę, co znaczy, że otrzymujesz kompletny UI Kit dla Figmy, z pomocą którego możesz projektować. Następnie, stworzone w ten sposób projekty w prosty sposób przeniesiesz do Webflow, korzystając z tych samych nazw komponentów, tworząc z tego gotowy, działający projekt strony.

Design Tokeny - Kolory, Fonty, Spacing

W SystemFlow masz możliwość zdefiniowania własnej stylistyki całego systemu - globalne zmiany do typografii oraz swatchy kolorystycznych sprawią, że fonty i kolory zmienią się na przestrzeni całego Twojego projektu! W ten sposób łatwo przygotujesz strony, które stylistycznie znacznie odbiegają od pierwotnej koncepcji framework'u i są dopasowane do identyfikacji Twojego klienta.

Żyjący Design System

Plik Webflow, na którym pracujesz z Frameworkiem, zawiera pełną dokumentację, która zmienia się na żywo, w trakcie projektowania. Oznacza to, że po publikacji samej strony w Webflow, otrzymujesz kompletną referencję z design tokenami, wyglądem formularzy, przycisków, komponentów i innych elementów, którą możesz przekazać klientowi. Przykład dokumentacji wygląda tak: https://systemflow-v-1-1-51e1ee81-49590199e0f65.webflow.io/style-guide/about/overview

Pracuj Sprytniej

SystemFlow powstał w jednym celu - aby pomóc nam tworzyć projekty dla siebie i naszych klientów znacznie szybciej, wydajniej, w sposób zorganizowany. Ponadto, aby wykorzystać Webflow jako najlepszy edytor, dający nam łatwy dostęp do zmian w ramach uporządkowanej struktury, obsługę CMS, E-Commerce, a klientowi możliwość edycji elementów strony z przeglądarki. Z drugiej strony, wykorzystaliśmy Figmę czyli najlepsze narzędzie do projektowania UI z masą dodatków i pluginów, które usprawnią Twoją pracę!

Dla kogo jest ten kurs?

Ten kurs przygotowany jest z myślą o osobach, które w swoich firmach tworzą wiele stron, na przykład marketingowych i chcą czy to do tworzenia finalnych stron czy prototypów, wykorzystać Webflow i ewentualnie Figmę. Kurs nadaje się też doskonale dla Freelancerów którzy oferują swoje usługi tworzenia stron w Webflow, a także agencji kreatywnych, które mogą znacznie przyspieszyć swoją pracę dzięki SystemFlow!

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ń.
25 minut

Webflow Tips and Tricks

Przyspiesz swoją pracę w Webflow

Zobacz najciekawsze triki i techniki pracy w Webflow, z pomocą których budowanie stron WWW będzie jeszcze prostsze, a przede wszystkim - szybsze! Na przestrzeni tylko 25 minut, Grzegorz pokaże Ci ponad 40 praktycznych technik, o których być może jeszcze nie słyszałeś. Przyjrzymy się między innymi najważniejszym skrótom klawiaturowym upraszczającym pracę, poznasz też przykłady technik z zastosowaniem obrazków, polepszania wydajności Twojego projektu, korzystania z zewnętrznych wtyczek i narzędzi czy organizacji klas. To materiał obowiązkowy dla każdego, kto już pracuje w Webflow bądź zaczyna uczyć się tego narzędzia, dzięki czemu wejdziesz na zupełnie nowy, zoptymalizowany poziom pracy!

Grzegorz Róg

1 godzina 40 minut

Strony WWW w Rekordowym Czasie

Dzięki Webflow i SystemFlow

Czy da się zarobić 10.000 zł na stronie wykonanej w 2 godziny? Jak się okazuje - tak, trzeba tylko poznać najnowsze technologie no-code i ich praktyczne zastosowania. Już wkrótce zmieni się na dobre to, jak podchodzimy do tworzenia stron WWW oraz front-endu a klasyczne podejście w przypadku wielu projektów odejdzie w zapomnienie. Będziemy pracować szybciej, skuteczniej i lepiej. Wymaga to jednak zmian - w myśleniu twórców, freelancerów, agencji, klientów. Okazuje się, że często osoby bez dużego doświadczenia są w stanie tworzyć i dowozić projekty lepiej i szybciej, niż zespół developerów. Jednak i jedni i drudzy zdecydowanie zyskają na nowym podejściu, które chcę Wam pokazać. W ramach Warsztatu wykonamy praktyczny projekt prostej strony, która z pewnymi modyfikacjami została w rekordowym czasie wdrożona dla klienta... za rekordową cenę. Najważniejsze jest jednak, że wszyscy byli zadowoleni. Zobacz, że to możliwe i zacznij uczyć się właściwych technologii!

Grzegorz Róg

3 godziny 52 minuty

Kurs Webflow

E-commerce

Profesjonalny sklep z autorskim layoutem w kilkanaście godzin? Tak właśnie wyglądała droga do tworzenia źródeł do tego kursu. W tym kursie dowiesz się, jak z pomocą Webflow i jego nowego modułu e-commerce, przygotować w pełni funkcjonalny sklep internetowy - dla Ciebie, lub Twojego klienta. Naszym zdaniem Webflow to godna uwagi alternatywa dla WooCommerce czy Shopify, posiadająca wiele zalet jeśli chodzi o elastyczność, skalowalność i profesjonalizm tworzonego rozwiązania. Ma jednak na razie także kilka wad, które należy rozważyć podczas realizacji konkretnego projektu. Zapraszamy na kurs, w ramach którego Grzegorz krok po kroku przeprowadzi Cię przez budowę kompletnego sklepu dla marki odzieżowej w Webflow.

Grzegorz Róg

4 godziny 45 minut

Kurs Webflow

Techniki Zaawansowane i CMS

Dzięki Webflow możesz tworzyć strony WWW bez konieczności kodowania - zarówno statyczne, jak i dynamiczne, z wykorzystaniem CMS oraz bazy danych. To narzędzie, które zmienia sposób, w jaki tworzymy internetowe serwisy, pozwalając nam pracować wydajnie jednak w zgodzie ze standardami. Naszym zdaniem to narzędzie, które zasługuje na miano "kolejnego WordPress'a". W tym Kursie dowiesz się jak przygotować kompletny system blogowy z wykorzystaniem CMS w ramach Webflow. Jeśli jeszcze nie masz podstaw Webflow, zachęcamy do skorzystania wcześniej z kursu podstawowego.

Grzegorz Róg

5 godzin 47 minut

Kurs Webflow

Strony WWW bez Kodowania

Webflow to obecnie najlepszy wizualny edytor stron WWW. To prawdziwa rewolucja jeśli chodzi o projektowanie i wdrażanie zarówno statycznych, prostych stron, jak i witryn zawierających dynamiczne treści a nawet gotowych systemów e-commerce. Z wykorzystaniem technologii no-code publikacja stron jest szybsza i łatwiejsza niż kiedykolwiek. Ten kurs ma za zadanie wprowadzić Cię w Świat stron bez kodowania z pomocą Webflow, adresując najważniejszy element - layout. W skrócie, poznasz wszystkie techniki które pozwalają na wykonanie dowolnego projektu w Webflow, od czystej kartki, aż po działającą, statyczną witrynę. To świetny wstęp dla tych z Was, którzy jeszcze nie mieli do czynienia z Webflow, chcą ugruntować podstawy, bądź stworzyć swoją pierwszą stronę!

Grzegorz Róg

Autor: Grzegorz Róg

**Idea Architect**

Od wielu lat projektuje serwisy internetowe, dużą wagę przykładając do ich funkcjonalności a także skutecznych technik promocji. Swoje umiejętności praktyczne zdobywa projektując grafikę oraz strony www dla wiodących polskich i zagranicznych agencji reklamowych. Współpracuje między innymi z Adobe, Microsoft, Wacom. Jako trener i spiker prowadzi szkolenia oraz eventy i warsztaty. Posiada szereg uprawnień i certyfikatów eksperckich. <br><br> W wolnych chwilach stara się przekazać Ci całą praktyczną wiedzę, pasję i doświadczenie. Zapraszamy do kursu - gwarantujemy, że ta świetna zabawa przyniesie Ci mnóstwo satysfakcji!

eduweb.pl
@grzegorzrog

Ten kurs nie posiada jeszcze transkryptu. Choć bardzo się staramy, wygenerowanie transkryptów do wszystkich kursów jest bardzo czasochłonne. W wielu przypadkach wymaga zaangażowania drogiego oprogramowania i godzin pracy przy poprawianiu transkryptu tak, aby był on możliwie jak najlepszy.

Zależy nam na tym, aby przygotować transkrypty do wszystkich naszych treści. To jedyny sposób dla osób niedosłyszących, aby mogły wygodnie uczyć się technologii. Poza tym, transkrypty ułatwiają skanowanie kursu w poszukiwaniu informacji i jego indeksowanie.

Szukamy osób, które mogłyby nam pomóc w poprawianiu transkryptów. Jeśli masz chwilę wolnego czasu i interesuje Cię dany kurs, w zamian za taką pomoc chętnie udostępnimy Ci wybrany materiał. Wyślij swoje zgłoszenie tutaj, jeśli możesz pomóc nam rozwijać platformę.

  • Informacje
  • Lekcje

Autor: Grzegorz Róg

Czas: 4 godziny 22 minuty

Wersja: SystemFlow 1.0+

Aktualizacja: 29.03.2021

  • Certyfikat w ramach Ścieżki
  • Dostęp z urządzeń przenośnych
  • Licencje dla firm i szkół
Podaruj w prezencie

Wprowadzenie

  • Wstęp do kursu

  • Dokumentacja

  • Strona Customize

SystemFlow dla Webflow

  • Komponenty Webflow

  • Praca z Klasami

  • Typografia

  • Jednostki w Typografii

  • Kolory

  • Praca z Ikonami

  • Marginesy i Padding

  • Przyciski

Live Components

  • Wprowadzenie do LC

  • Countdown

  • Temporal

  • Notyfikacje Cookie

  • Confetti

SystemFlow dla Figma

  • Wprowadzenie do Figma

  • Auto Layout

  • Warianty

  • Komponenty

  • Style i Tokeny

  • Przenoszenie do Webflow

Showcase

  • Projektowanie w Figma

  • Wdrożenie w Webflow

Extra

  • Licencje i zgłoszenia

  • Praca z różnymi wersjami

}