Kreatywne kodowanie 2.0 w JS: animacja, dźwięk i kolor
Kurs prowadzi Bruno ImbriziKreatywny programista
Kurs prowadzi Bruno Imbrizi, Kreatywny programista
Poznaj zaawansowane techniki kreatywnego kodowania, by tworzyć wyjątkowy materiał wizualny w JavaScript łączący kolor, ruch i dźwięk
Kodowanie jest jak rozwiązywanie zagadek: to ciągły cykl uczenia się, błędów i powtórzeń, które można wykorzystać do stworzenia czegoś pięknego. Bruno Imbrizi jest wielokrotnie nagradzanym grafikiem, który ostatnie 10 lat swojej kariery poświęcił na opanowanie sztuki kreatywnego kodowania.
Używa JavaScript do tworzenia m.in. animacji, printów, elementów interaktywnych. Współpracował z takimi markami, jak Google, Spotify i Nike, i zdobywał nagrody, w tym Adobe Cutting Edge Award i FITC Best Digital Installation.
Co zyskujesz dzięki temu kursowi?
„Nauczę Cię kilku technik tworzenia atrakcyjnych wizualizacji za pomocą JavaScript.” * Nauczę się kodować efektowne wizualizacje wzbogacone dźwiękiem
- Nauczysz się kodować kompozycje pełne kolorów
- Stworzysz animacje własnych wizualizacji i wprowadzisz interakcję kursora
To jest drugi kurs prowadzony przez Bruna na platformie Domestika. Na swoim pierwszym kursie,_ Kodowanie kreatywne: twórz dzieła sztuki wizualnej za pomocą JavaScript_, uczy podstaw programowania i rysowania za pomocą kodu od podstaw.
Czego nauczysz się na tym kursie online?
llekcji: 28 & liczba dodatkowych zasobów: 20
Konfiguracja online
5 min, 4 sek.
Dystrybucja
4 min, 51 sek.
Dodawanie kolorów
8 min, 50 sek.
Maska przycinająca
6 min, 29 sek.
Dane obrazu
8 min, 53 sek.
Co obejmuje ten kurs?
Zaczniesz od dokonania przeglądu podstawowych narzędzi JavaScript. Następnie skonfigurujesz środowisko do uruchamiania kodu i tworzenia szkiców.
Dowiesz się, jak w całości rysować podstawowe kształty w kodzie, dodawać kolory oraz rozciągać lub pochylać swoje projekty.
Stworzysz krzywe dla różnych iteracji, od elementów projektu po wykresy, dodając wiele punktów wzdłuż segmentu, animując je i ucząc się interakcji kursora z obrazami.
Utworzysz wizualizację audio, odtwarzając pliki dźwiękowe, odczytując ich dane i wykorzystując częstotliwości do tworzenia animacji.
Poeksperymentujesz z cząstkami i nauczysz się dyktować ich zachowanie, stosując różne siły i zakłócenia, a także modyfikując ich rozmiar i kolor.
Jaki jest projekt kursu?
Opracujesz serię kompozycji przy użyciu koloru i dźwięku, które będą działać w przeglądarce internetowej.
Projekty uczestników kursu
Do kogo jest skierowany ten kurs online?
Ten kurs jest przeznaczony dla każdego, kto chce poszerzyć swoją wiedzę na temat kodowania, aby tworzyć unikalne animowane kompozycje.
Wymagania i materiały
Do tego kursu wymagana jest wcześniejsza znajomość kodowania.
Jeśli chodzi o sprzęt, będziesz potrzebować dostępu do urządzenia z JavaScript.
Oceny
- 4 miesiące temu
Polecam, fajna zabawa
- 8 miesięcy temu
Excelente! Buena fuente de inspiración para creativos incursionando en programación
- 9 miesięcy temu
I will recommend this to my friend who likes to know more on javascript designing
- 10 miesięcy temu
Recomendado para principiantes que quiera incorporar su lado artístico a la codificación.
- chillwill47PLUSrok temu
Just getting started into creative coding and this course is definitely a great point to begin at.
Z ponad 10-letnim doświadczeniem pracował w agencjach, studiach projektowych, firmach produkcyjnych i znanych markach, takich jak Dell, Adidas i Universal Music. Był opisywany w publikacjach internetowych, takich jak WIRED i Londonist i zdobył wiele nagród, w tym Adobe Cutting Edge Award i FITC Best Digital Installation.
Zawartość
- Cz.1
Wstęp
- O mnie
- Wpływy
- Cz.2
Ustawić
- Podsumowanie JavaScript
- Konfiguracja online
- Konfiguracja offline
- Płótno-szkic
- Cz.3
Pochylanie
- Rysowanie prostokąta
- Rysowanie skośnego prostokąta
- Dystrybucja
- Dodawanie kolorów
- Maska przycinająca
- Ustawianie losowego ziarna
- Cz.4
Krzywe
- Rysowanie krzywej kwadratowej
- Interakcja z kursorem
- Wiele punktów
- Tworzenie siatki
- Segmenty
- Animacja
- Cz.5
Dźwięk
- Naciśnięcie Odtwórz
- Analizator
- Częstotliwości
- Łuki
- Tworzenie plakatu
- Cz.6
Cząstki
- Rysowanie pojedynczej cząstki
- Stosowanie sił
- Dystrybucja cząstek
- Modyfikowanie skali i kolorów
- Dane obrazu
- PK
Projekt końcowy
- Kreatywne kodowanie 2.0 w JS: animacja, dźwięk i kolor
Kurs Domestika - czego możesz się spodziewać?
Nauka we własnym tempie
Radość z nauki w domu, bez wyznaczonych terminów. Szybko przyswajasz wiedzę, a swój plan zajęć układasz wedle uznania.
Nauka z najlepszymi ekspertami
Przydatne metody oraz ciekawe techniki przedstawione i wyjaśnione przez najlepszych specjalistów z branży kreatywnej.
Doświadczeni prowadzący
Wszyscy prowadzący są specjalistami w swojej dziedzinie. Przekazują wiedzę z pasją, tłumaczą zagadnienia w jasny sposób, a podczas zajęć kładą nacisk na praktyczne zastosowanie zdobytej wiedzy.
Certyfikaty
PLUSJeśli masz subskrypcję Plus, za każdy kurs otrzymasz spersonalizowany certyfikat podpisany przez prowadzącego. Udostępnij go w portfolio, w mediach społecznościowych lub gdziekolwiek chcesz.
Miejsca w pierwszym rzędzie
Wysoka jakość wideo sprawia, że nie umknie Ci żaden szczegół. Dzięki nieograniczonemu dostępowi możesz obejrzeć nagrania tyle razy, ile potrzebujesz, aby przyswoić nowe umiejętności.
Dzielenie się wiedzą i pomysłami
Zadawaj pytania, nie wahaj się poprosić o opinię czy poszukać rozwiązania. Podziel się swoimi wrażeniami z nauki z pozostałymi członkami społeczności, którzy tak jak Ty uwielbiają tworzyć.
Łączność z kreatywną społecznością z całego świata
Społeczność kilku milionów użytkowników z całego świata, pełnych ciekawości oraz chęci odkrywania i wyrażania swojej kreatywności.
Profesjonalna realizacja kursów
Domestika starannie dobiera prowadzących i produkuje wszystkie kursy we własnym zakresie, aby zapewnić wysoką jakość nauki online.
Często zadawane pytania
This course is designed for intermediate learners. Basic familiarity with JavaScript and coding concepts is recommended before enrolling to get the most out of the lessons.
You'll need access to a modern web browser, and tools like StackBlitz, CodeSandbox, Node.js, npm, and a code editor such as Sublime Text. No specialized hardware is required.
You'll learn foundational creative coding concepts, how to use JavaScript and Canvas APIs for interactive visuals, generative art techniques, project setup, exporting artwork, and integrating audio for visualization.
The course primarily focuses on 2D creative coding using JavaScript and Canvas APIs, but introduces 3D visualization concepts and frameworks like Processing and OpenFrameworks.
Yes, the course includes detailed instructions for setting up and using StackBlitz and CodeSandbox for browser-based development, making it easy to start coding without local installations.
You'll learn how to export your browser-based generative artwork as high-resolution PNG images, which can then be printed or shared online.
Yes, the course covers creating interactive visuals and animated sketches using JavaScript, the Canvas API, and Canvas Sketch, including frame-based logic and user input.