Kodowanie kreatywne: twórz dzieła sztuki wizualnej za pomocą JavaScript
Kurs prowadzi Bruno ImbriziKreatywny programista
Kurs prowadzi Bruno Imbrizi, Kreatywny programista
Naucz się podstaw programowania i dowiedz się, jak tworzyć, rysować i animować obrazy i tekst za pomocą kodu
Eksperymentowanie z kodowaniem kreatywnym nigdy nie jest nudne, zawsze jest coś do odkrycia, nowe techniki do nauczenia lub nowe obrazy do stworzenia. Bruno Imbrizi połączył w dziedzinie kreatywnego kodowania swoją pasję do animacji i wizualizacji z programowaniem. Pracował dla małych studiów projektowych i znanych marek, takich jak Dell, Adidas czy Universal Music.
W tym kursie Bruno podzieli się swoją wiedzą ekspercką, aby pomóc Ci w tworzeniu ciekawych wizualizacji z wykorzystaniem kodowania. Poznaj zasady programowania i naucz się rysownia za pomocą kodowania kreatywnego w programie JavaScript.
Chcesz poszerzyć swoją wiedzę o kodowaniu? Sprawdź drugi kurs Bruno, Kodowanie kreatywne: twórz dzieła sztuki wizualnej za pomocą JavaScript, aby odkryć bardziej zaawansowane techniki tworzenia zakodowanych kompozycji z kolorem, ruchem i dźwiękiem.
Czego nauczysz się na tym kursie online?
llekcji: 21 & liczba dodatkowych zasobów: 39
Środowisko do szkicowania
12 min, 39 sek.
Siatka
7 min, 51 sek.
Hałas
6 min, 40 sek.
GUI
11 min, 12 sek.
Tekst
9 min, 26 sek.
Mapa bitowa
10 min, 34 sek.
Co obejmuje ten kurs?
Rozpoczniesz kurs od poznania prowadzącego: jest nim kreatywny koder Bruno Imbrizi. Opowie o początkach swojej kariery w dziedzinie projektowania graficznego oraz o tym, jak udało mu się połączyć pracę z pasją kodowania. Następnie przedstawi ulubione platformy i wyjaśni powody, dlaczego lubi z nich korzystać. Opowie również o osobach, które miały wpływ na jego prace.
W tym kursie poznasz podstawy kodowania. Bruno pomoże Ci w dobraniu odpowiednich ustawień Twoich narzędzi zanim przejdzie do omówienia pojęć związanych z kodowaniem, takich jak zmienne, funkcje, tablice i pętle. Następnie pokaże, jak zoptymalizować ustawienia zanim przejdziesz do szkicowania.
Stworzysz nowy cyfrowy szkic wykorzystując przekształcenia canvas. Następnie nauczysz się, jak wykorzystać trygonometrię, aby rozmieścić kształty wokół koła. Dowiesz się, jak skalować szkice i zobaczysz, jak wykorzystywać funkcje, aby ułatwić sobie pracę nad kolejnymi projektami. Ukończysz szkic rysując łuki i bawiąc się różnymi wartościami parametrów.
Zaprojektujesz animowany szkic z ruchomymi agentami w obszarze kanwy. Nauczysz się, jak narysować pomiędzy nimi linie w oparciu o ich odległość. Jak eksportować swoją animację jako plik wideo, który możesz udostępnić online.
Dowiesz się, jak dostosować siatkę, aby była bardziej elastyczna i wydajna. Następnie użyjesz generatorów szumu do jej wzmocnienia. Stworzysz mały panel kontrolny, który umożliwi aktualizację szkiców w czasie rzeczywistym.
Na koniec nauczysz się pracy z tekstem w swoich kompozycjach. Bruno pokaże Ci, jak narysować, zmierzyć i ustawić parametry czcionek zanim przejdzie do wyjaśnienia, jak zaktualizować literę wykorzystując tylko jeden klawisz klawiatury. Na zakończenie kursu dowiesz się, jak odczytać wartości koloru i dopracujesz ostatnie detale końcowego szkicu.
Jaki jest projekt kursu?
Zaprojektowanie kreatywnych kompozycji wizualnych, które mogą być zastosowane w przeglądarce za pomocą kodu.
Projekty uczestników kursu
Do kogo jest skierowany ten kurs online?
Dla każdej osoby zainteresowanej programowaniem i nauką tworzenia wizualizacji za pomocą kodu.
Wymagania i materiały
Zalecane są podstawowe umiejętności matematyczne.
Zalecane są podstawowe umiejętności matematyczne. Będziesz potrzebował komputera z Node.js, a także dostępu do przeglądarki internetowej i edytora tekstu.
System operacyjny:
⦁Linux ⦁SmartOS ⦁macOS 10.7 lub nowszy ⦁Windows 2008 lub nowszy
Wymagania systemowe:
⦁4 GB pamięci RAM ⦁10 GB wolnego miejsca
Oceny
- 2 miesiące temu
Great course, I wish I’d had a stronger foundation in coding before taking it.
- 3 miesiące temu
Excellent introductory course
- 3 miesiące temu
Great course!!!
- 4 miesiące temu
I loved this! I learned a lot and I sincerely recommend this course.
- 5 miesięcy temu
Ótimo curso. O professor entende do assunto em profundidade e sabe transmitir muito bem o conteúdo. É uma excelente oportunidade como porta de entrada para a programação criativa.
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
Podstawy
- Ustawiać
- Zmienne i funkcje
- Tablice i pętle
- Środowisko do szkicowania
- Cz.3
Transformacja szkicu
- Przekształcać
- Kąty
- Funkcje użytkowe
- Łuki
- Cz.4
Agenci szkicu
- Przedmioty i klasy
- Animacja
- Linie
- Wyjście wideo
- Cz.5
Szum szkicu
- Siatka
- Hałas
- GUI
- Cz.6
Typ szkicu
- Tekst
- Asynchroniczny
- Mapa bitowa
- Glify
- PK
Projekt końcowy
- Wprowadzenie do kodowania dla projektantów wizualnych
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
Kreatywne programowanie to wykorzystanie programowania do artystycznej lub wizualnej ekspresji. Ten kurs nauczy Cię, jak używać JavaScript, HTML i Canvas do tworzenia interaktywnych wizualizacji i generatywnej sztuki poprzez praktyczne eksperymenty z kodem.
Kurs jest przeznaczony dla użytkowników na poziomie średniozaawansowanym. Zalecana jest podstawowa znajomość JavaScript i tworzenia stron internetowych, ale kluczowe koncepcje i narzędzia są wyjaśniane krok po kroku dla osób z pewnym doświadczeniem w kodowaniu.
Będziesz potrzebować edytora kodu, takiego jak Sublime Text lub Visual Studio Code, Node.js, npm oraz nowoczesnej przeglądarki internetowej. Kurs obejmuje również instalację i konfigurację wszystkich niezbędnych narzędzi do projektów kreatywnego programowania.
Nauczysz się tworzyć generatywną sztukę, interaktywne wizualizacje i prototypy za pomocą JavaScript, Canvas i technologii webowych. Tematy obejmują rysowanie kształtów, transformacje, animacje, eksport grafiki oraz korzystanie z bibliotek takich jak Canvas Sketch.
Kurs nauczy Cię korzystać z metod API JavaScript Canvas, takich jak fillRect, arc i fillStyle, aby rysować i stylizować prostokąty, koła i inne kształty bezpośrednio w przeglądarce.
Tak, nauczysz się eksportować swoje generatywne szkice jako obrazy PNG lub pliki wideo za pomocą Canvas Sketch CLI, wraz z poradami dotyczącymi wysokiej jakości eksportu.
Przeprowadzimy Cię przez instalację Canvas Sketch, inicjalizację projektów, zarządzanie dynamicznymi wymiarami canvas oraz uruchamianie szkiców w przeglądarce lub terminalu.