IPS — Design Tool

A simple design tool that allows you to create dynamic pixel sorting effects based on an image. Built with Javascript & P5.js.

This is a work in progress but you can try it out here

Some examples images created using the tool

Features

• Interactive canvas with P5.js for image manipulation
• Image upload via file input or drag & drop
• Customizable pixel sorting effects:
  • Adjustable pixel position and speed
  • Image scaling and visibility toggle
• Export options:
  • Save as PNG
  • Save as animated GIF

Tech Stack

• TypeScript
• P5.js for creative coding
• Tweakpane for GUI controls
• Vite for development and building

Export your creation as a PNG or animated GIF

Notes

This is currently a work-in-progress as I'm working on a custom toolbar for the UI

Credits

This project was heavily inspired by The Killing of a Sacred Deer Digital Campaign Poster Graphics by Marvin Schwaibold and Watson DG.