CF

Up and Running With PixiJS

2h 8m 52s
English
Paid

PixiJS is a fast 2D graphics library for the web. You can draw shapes, load images, and build smooth effects with simple code. In this course, you learn the core parts of PixiJS so you can add clear and polished visuals to your projects.

Course Overview

This course shows you the main tools you need to start with PixiJS. You learn how to set up a scene, use sprites, and build simple animations. By the end, you can create small visual demos and build on them as you grow.

About the Author: Envato Tuts+

Envato Tuts+ thumbnail

Envato Tuts+ (formerly known as Tuts+ and now part of the Envato family) is one of the longest-running creative-tech tutorial publishers on the open web, dating back to 2007. The platform covers an unusually wide span of disciplines — code (the technical track), design (Photoshop, Illustrator, Figma), photography, video editing, music production, and the broader creative-craft topics adjacent to digital work.

The course catalog includes contributions from a large roster of independent instructors across each discipline. Material is structured for self-directed adult learners filling in specific technical or creative skills, with both individual courses and longer learning paths.

The CourseFlix listing under this source carries 5 Envato Tuts+ courses spanning the catalog's range. Material is paid; Envato Tuts+ historically ran on a monthly / annual subscription on the original platform.

Watch Online 13 lessons

This is a demo lesson (10:00 remaining)

You can watch up to 10 minutes for free. Subscribe to unlock all 13 lessons in this course and access 10,000+ hours of premium content across all courses.

View Pricing
0:00
/
#1: 1.1 Welcome to the Course
All Course Lessons (13)
#Lesson TitleDurationAccess
1
1.1 Welcome to the Course Demo
00:38
2
1.2 The “Why” and “How” of PixiJS
07:17
3
2.1 A Basic PixiJS Application
13:33
4
2.2 Animated God Ray Image
10:37
5
2.3 Colored Spotlight Mask
14:04
6
2.4 Custom Cursor
06:16
7
2.5 Text Style
11:34
8
2.6 Containers and Displacement
11:27
9
2.7 Using Video
07:21
10
2.8 Parallax Movement
20:45
11
2.9 Gradients and Canvas2D API
11:17
12
2.10 Blend Modes and Flicker Effect
10:44
13
3.1 Wrapping Up
03:19
Unlock unlimited learning

Get instant access to all 12 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.

Learn more about subscription

Related courses

  • Scalable TDD & Testing thumbnailUpdated 1y ago

    Scalable TDD & Testing

    By: Logic Room
    Enhance your JavaScript UI testing skills with scalable methods independent of frameworks. Boost development speed, improve code quality, and increase
    2h 56m
  • Object-oriented Programming in JavaScript thumbnailUpdated 2y ago

    Object-oriented Programming in JavaScript

    By: Mosh Hamedani (Code with Mosh), Udemy
    Object-oriented programming (OOP) is a popular programming paradigm or style of programming. It’s been around since ‘70s, but unlike tools and frameworks that c
    3h 53m5/5
  • Youtube clone thumbnailClassic

    Youtube clone

    By: Nomad Coders
    Learn to create a comprehensive YouTube clone covering front-end and back-end with JavaScript, Node.js, and MongoDB. Enhance your developer skills by building
    15h 41m5/5

Frequently asked questions

What are the prerequisites for taking this course?
This course does not list specific prerequisites, but a basic understanding of JavaScript and web development would be beneficial. Familiarity with 2D graphics concepts can also help in grasping how PixiJS operates within a web environment.
What projects will I be able to create by the end of this course?
By the end of the course, you will be able to create small visual demos using PixiJS. These include setting up a basic application, creating animations like an animated god ray image and colored spotlight mask, implementing a custom cursor, and applying effects like gradients and blend modes.
Who is the target audience for this course?
The target audience includes web developers and designers interested in enhancing their projects with 2D graphics using PixiJS. It is also suitable for individuals looking to learn how to implement visual effects and animations on web pages.
How does this course compare in depth to other PixiJS courses?
This course focuses on the core parts of PixiJS, providing foundational knowledge to set up scenes, use sprites, and build simple animations. It is an introductory course and may not cover advanced topics or complex applications found in more comprehensive PixiJS courses.
What specific tools or platforms will I use in this course?
This course specifically uses the PixiJS 2D graphics library. Lessons cover various features such as sprites, containers, displacement, and using video within graphics projects. No additional tools or platforms are specified in the course material.
What topics or tools are not covered in this course?
The course does not cover advanced PixiJS features, 3D graphics, or integration with complex web frameworks. It focuses on basic setup and simple animations rather than comprehensive application development or advanced graphics techniques.
How much time should I commit to this course?
The course consists of 13 lessons, but the total runtime is not specified. To fully benefit from the material, consider dedicating time to experiment with the examples and build on the demos provided to reinforce learning.