Kontakt  –  Aktuelles  –   Drucken

Zurück zur Übersicht

PixiJS for Artists - Sarah Sole (Ferguson)

Saturday, 26 January, and Sunday, 27 January, 2019, 10-4pm                   Registration deadline: Mon, January 16, 2019                                              
bbk-bildungswerk, Köthener Str. 44, 10963 Berlin                                    (3. Etage, Seminarraum, Fahrstuhl)
70 €

0 / 6

PixiJS for Artists

In this workshop you will learn how to publish still images, frame animations, text, and audio/video elements on the web in unique and unusual ways. You will learn how to turn your browser into a stage on which elements move, interact, and change states. And you will learn how to incorporate whatever you create for this stage into an existing website or publish to a new site.

Who is this workshop for?

-Artists who want to create new works in the medium of the web and publish those works online.
-Artists who want to take full control of the presentation of their work online.
-Video artists (or artists who rely on video documentation of their work), who seek an alternative to third-party platforms (Vimeo, YouTube) for publishing their works.
-Artists working in frame animation who seek a simple and immediate way to animate frames in the browser and publish directly on a website.
-Artists who use Photoshop for digital composition and want to arrange layers, apply blend modes and/or animate layers in the browser and publish directly on a website.

In order to composite digital elements in the browser, we have to speak in the language of the browser, which is JavaScript. In this course we will use the graphics library PixiJS to write the JavaScript for us. PixiJS is the fastest 2D (webGL) renderer and works seamlessly with GSAP, another library for timing movement and states. Tasks such as loading and arranging hundreds of frames (jpgs), animating masks, solids and text, timing video, and synching audio can be accomplished in a couple lines of code. Furthermore, the same code that sets up one project can be used for any other project with only minor changes.

A list of topics we will cover is below. Depending on the interest of the participants, certain topics may be skipped or emphasized. I have set up a website of “demos” to illustrate each topic here:[https://sarahsole.video/pixijs]
1. Sprites
2. Animated Sprites (Frame Animation)
3. Cropping Textures
4. The Animation Loop (RAF)
5. Pixi Filters
6. Video Textures
7. GSAP Timeline
8. Animating Text with RAF
9. Animation Text with GSAP
10. Putting it all Together (Demo #1)
11. Blend Modes I
12. Blend Modes II
13. Pixi Graphics
14. Masking With Shapes
15. Masking With Sprites


We will be using a code editor and a dedicated browser on our laptops to run animations in realtime. I suggest “Visual Studio Code” for the code editor and Chrome or Firefox for the browser.


Visual Studio Code - [ https://tinyurl.com/ycovjc67]
Chrome -[https://www.google.com/chrome/]
Firefox - [https://www.mozilla.org/de/firefox/new/]
Once “Visual Studio Code” is installed, the extension called “Live Server” will also need to be installed. This can be done within “Visual Studio Code” under the menu item View —> Extensions. Search “Live Server” and follow the instructions to install.
No knowledge of HTML or JavaScript is required.

4 applications needed

This program is supported by funds of the European Social Fund (ESF)
These subsidies are the basis for low participation fees and for the lecturers’ fees.
Therefore, prior to the event each participant must provide
some personal information, confirmed with a signature.
A multiple-choice test is an integral part for the ESF-evaluation purposes.
All your data are subject to data protection and passed on depersonalised to the
responsible ESF administration in order to fulfil the evaluation and reporting obligations.


bildungswerk des bbk berlin GmbH
Köthener Straße 44
10963 Berlin

Prof. Dr. Frieder Schnock – Geschäftsführung (Bildungsprogramme)
tel 030 230 899-10

Florian Schöttle – Geschäftsführung (Vermögensverwaltung)

Michael Nittel – Veranstaltungskonzeption
tel 030 230 899-49

Kerstin Karge – Veranstaltungsorganisation
tel 030 230 899-40

Lucy Teasdale – Veranstaltungsorganisation
tel 030 230 899-43