Four-Project Series
Creative Coding with p5.js you own this product
- prerequisites
- basic JavaScript • basics of p5.js
- skills learned
- p5.js canvas and coordinate system basics • p5.js drawing primitives and transformations • p5.js draw loop and animation basics • p5.js audio playback and movie rendering
pro $24.99 per month
- access to all Manning books, MEAPs, liveVideos, liveProjects, and audiobooks!
- choose one free eBook per month to keep
- exclusive 50% discount on all purchases
lite $19.99 per month
- access to all Manning books, including MEAPs!
team
5, 10 or 20 seats+ for your team - learn more
You don’t need to be a painter or a sculptor to express your creative side! The p5.js coding environment and graphics library let you turn your coding skills into imaginative creations, as well as quickly prototype interfaces and applications, visualize data, express creative ideas, or just play with code.
The projects in this series put the fun back into coding, inspiring you with creative JavaScript programming tasks that combine your creative abilities with computational thinking. As you work through each fun and engaging p5.js project, you’ll master design skills such as creating vibrant images from simple visual elements, animating artwork or photography, and even generating visuals for music. If you find your joy for code dwindling, let the exciting challenges in this liveProject revitalize your passion—and your JavaScript skills!
These projects are designed for learning purposes and are not complete, production-ready applications or solutions.
Manning author Mathias Funk shares what he likes about the Manning liveProject platform.
here's what's included
Project 1 Abstract Art Logo
In this liveProject, you’ll use p5.js to draw and animate abstract logos by combining simple visual elements in new ways. You’ll use color gradients to create vibrant icons, design complex shape-based logos, and combine the two techniques into stylistic and interesting logo art.
Project 2 Contemporary Visual Art
In this liveProject, you’ll work with p5.js to create and animate modern artwork. You’ll see how you can use code to replicate the abstract colors and shapes of Russian artist Kazimir Malevich and animate your reproduction into a moving 2D image, then explore the work of American sculptor Alexander Calder and see how it can be reproduced in both 2D and animated 3D.
Project 3 Animate an Image
In this liveProject, you’ll use p5.js to animate still photos or artwork. You’ll start by animating simple object images with interaction techniques, then animate landscape photos using layers and transparency. Finally, you’ll extend these techniques to creative drawing on images.
Project 4 Sync to Music
In this liveProject, you’ll use p5.js to link and synchronize visual assets with audio material. You’ll start by simulating a 3D landscape, then animate a camera flight through the landscape, before cohesively setting your movie to music to create a music video.
choose your plan
pro
monthly
annual
$24.99
$249.99
only $20.83 per month
- access to all Manning books, MEAPs, liveVideos, liveProjects, and audiobooks!
- choose another free product every time you renew
- choose twelve free products per year
- exclusive 50% discount on all purchases
-
![]()
Creative Coding with p5.js project for free
Creative Coding with p5.js project for free
team
monthly
annual
$49.99
$499.99
only $41.67 per month
- five seats for your team
- access to all Manning books, MEAPs, liveVideos, liveProjects, and audiobooks!
- choose another free product every time you renew
- choose twelve free products per year
- exclusive 50% discount on all purchases
-
![]()
Creative Coding with p5.js project for free
Prerequisites
For JavaScript programmers interested in developing or rediscovering their creativity with easy visual computing techniques.
TOOLS
- Basic JavaScript
- Basics of p5.js
- Basic debugging
- Basic math such as linear algebra (vectors and vector addition) and geometry
you will learn
In this liveProject series, you’ll expand your perspectives on programming and turn a professional craft into a fun activity once again. By revisiting computational concepts from a creativity-inspired angle, you’ll learn how code can be an expressive and explorative tool instead of just a problem solver.
- p5.js canvas and coordinate system basics
- p5.js drawing primitives and transformations
- p5.js draw loop and animation basics
features
- Self-paced
- You choose the schedule and decide how much time to invest as you build your project.
- Project roadmap
- Each project is divided into several achievable steps.
- Get Help
- While within the liveProject platform, get help from other participants and our expert mentors.
- Compare with others
- For each step, compare your deliverable to the solutions by the author and other participants.
- book resources
- Get full access to select books for 90 days. Permanent access to excerpts from Manning products are also included, as well as references to other resources.
