Видеокурс CSS3 - эффекты, трансформации - DVD

Tytuł -"Kurs CSS3 poziom III – efekty, transformacje, przejścia"

Czas trwania - 8 godzin 10 minut

Poziom: zaawansowany

Czego się nauczysz?

Czy kiedykolwiek widziałeś na stronie internetowej ciekawą animację, a potem pomyślałeś: „ciekawe jak stworzyć taki efekt samodzielnie”? Wydaje Ci się, że to skomplikowane i potrzeba dodatkowych narzędzi? Nic bardziej mylnego, ponieważ tego typu ruchome elementy, animacje i efekty możesz wykonać zgłębiając tajniki CSS.

W tym kursie zrobisz kolejny, duży krok w CSS poznając możliwości animacji i efektów jakie oferuje CSS. Dzięki temu na Twojej witrynie możesz tworzyć niesamowite rzeczy, a wszystko zależy od Twojej wyobraźni. Ożywisz statyczną stronę, poprawisz wrażenia użytkownika. Tak więc jeśli znasz już podstawy CSS, to razem z tym kursem osiągniesz kolejny poziom wtajemniczenia. Pod koniec tego kursu będziesz w stanie zrozumieć, jak działa animacja na stronie internetowej i jak utworzyć ją stosując czysty CSS.

• Nauczysz się tworzyć efekty za pomocą CSS
• Wykonasz animowane elementy na Twoją stronę
• Nauczysz się stosować maski
• Dodasz filtry jak sepia, rozmycie czy skala szarości
• Nauczysz się łączyć filtry ze sobą
• Dowiesz się jak stosować tryby mieszania
• Wykonasz transformacje, skalowanie, obrót, pochylenie
• Zastosujesz transformacje w środowisku 2d oraz 3d
• Nauczysz się dodawać animowane efekty
• Dowiesz się, jak używać przejść i animacji klatek kluczowych

Dla kogo jest ten kurs?

• Kurs dla wszystkich twórców stron internetowych, którzy chcą opanować animacje i transformacje w CSS, by samodzielnie stosować

  kreatywne efekty.

• Szkolenie przeznaczone jest dla osób, które opanowały dwa poprzednie wydania naszych kursów o CSS oraz podstawy HTML.

Efekty

Kurs rozpoczniesz od poznania prostych efektów jak zmiana krycia elementu, utworzenie gradientu czy dodanie cienia. Idąc dalej, utworzysz bardziej kreatywne efekty na przykład stosując skalę szarości, sepię czy rozmycie na danym elemencie. Zobaczysz też jak manipulować kontrastem, jasnością i barwą stosując CSS. Dodatkowo pokażę Ci jak połączyć kilka filtrów na jednym elemencie.

Transformacje

Jednym z działów w kursie jest pojęcie transformacji CSS, które otwierają drzwi dla wielu kreatywnych opcji, od przesuwania elementów na stronie, po ich skalowanie i obracanie. Poznasz wszystkie funkcje przekształcenia, które możesz stosować w środowisku 2d oraz 3d.

Animacje

Następnie przejdziesz do najważniejszej części czyli animacji. Wykorzystasz wszystkie techniki i właściwości, których nauczyłeś się przy transformacjach i efektach. Zobaczysz jak stosować przejścia, stosować klatki kluczowe, określać procentowo etap animacji, tworzyć uruchamianie i zatrzymywanie animacji. Określisz liczbę powtórzeń oraz określisz kierunek poruszania się elementu. Zobaczysz jak śledzeić postęp animacji za pomocą JavyScript oraz poznasz bibliotekę Animate_css.

1. Wprowadzenie

1.1. Wstęp

2. Proste efekty

2.1. Krycie

2.2. Cień dla tekstu

2.3. Cień dla elementu

2.4. Gradient liniowy

3. Maski

3.1. Właściwość overflow o wartości hidden

3.2. Przesuwane tło elementu

4. Filtry

4.1. Filtry – wprowadzenie

4.2. Sepia

4.3. Grayscale

4.4. Saturate

4.5. Blur

4.6. Brightness

4.7. Contrast

4.8. Hue-rotate

4.9. Invert

4.10. Opacity

4.11. Łączenie filtrow

4.12. Backdrop-filter

5. Tryby mieszania

5.1. Wprowadzenie do trybów mieszania

5.2. Background-blend-mode

5.3. Mix-blend-mode

6. Transformacje

6.1. Transformacje – wprowadzenie

6.2. Transiotion w przestrzeni 2D

6.3. Skalowanie w przestrzeni 2D

6.4. Obrót w przestrzeni 2D

6.5. Pochylenie w przestrzeni 2D

6.6. Określenie punktu zero elementu

6.7. Łaczenie transformacji

6.8. Wstęp do transformacji 3D

6.9. Perspektywa

6.10. Korzystanie z backface-visibility

7. Animacja

7.1. Transition – wprowadzenie

7.2. Transition – oddzielne określanie składowych

7.3. Graficzna prezentacja podstawowych przebiegów

7.4. Transition – sekwencja

7.5. Transition – sekwencje podawane oddzielnie

7.6. Korzystanie z klatek w transition

7.7. Częste wykorzystywanie transition

7.8. Animation @keyframes – wprowadzenie

7.9. Procentowe określanie etapu animacji

7.10. Korzystanie ze słow from i to

7.11. Uruchamianie i zatrzymywanie animacji

7.12. Liczba powtórzen animacji

7.13. Korzystanie z animation-timing-function

7.14. Korzystanie z animation-duration i animation-delay

7.15. Łaczenie animacji

7.16. Określenie kierunku animacji

7.17. Korzystanie z animation-fill-mode

7.18. Śledzenie postępu animacji za pomoca JavyScript

7.19. Biblioteka Animate_css

8. Pożegnanie

8.1. Kilka słów na koniec

Sposób wyboru wersji kursu:

Kurs wideo dostępny jest w dwóch formach:

1. elektronicznej - jako link do pobrania spakowanego archiwum. Otrzymasz po zakupie link na maila. W tym przypadku szukaj aukcji oznaczonej jako wersja cyfrowa.

2. pudełkowej na DVD - zamiast linku do pobrania otrzymasz pod wskazany adres płytę DVD. W tym przypadku szukaj aukcji oznaczonej jako DVD.

Czy kurs będzie pasował do programu, który posiadam ?

Kursy tworzone są na różnych wersjach programu. Jednak w większości przypadków pasują do każdej wersji. Kursy tworzone są w taki sposób, by pasowały i były neutralne na starszych wersjach oprogramowania. Czyli jeśli posiadasz np. Photoshopa z roku 2019, a kurs jest tworzony na wersji Photoshopa 2020, będzie on pasował w 100%.

Czy z kursem otrzymam program?

Kursy to filmiki wideo pokazujące pracę w danym programie. Do żadnego z kursów nie jest dołączony program, w który należy zaopatrzyć się we własnym zakresie.