Instagram Filter - Image Processing Tool
Released March 2022
Student Solo Graphics Programming Project
This is an image processing tool that allows you to apply 10 different filters to a preset image. It contains a border, vignette, and a radial blur, as well as sliders and checkboxes to allow the user to adjust the image.
It is a tool I made for a graphics programming course at the University of London using p5.js from the ground up. The image on the left is copied and displayed on the right. Then each filter is created by looping over every pixel in the copied image and, applies a function using a specific matrix to change the red, green, blue, and alpha values of each pixel.
Features include:
- Able to switch between 10 filters
- Multiple sliders to dynamically change effects
- The threshold value can be changed for the threshold filter
- The border can be adjusted
- Blur can be toggled on or off - recommend toggling off to speed up program and see other filters and sliders update quicker
- Blur size can be changed with the min and max sliders
- Different color effects can be created by changing the red, green blue, and alpha values when blur is turned on. I like turning on the edge detect filter, and having red 1, green 2, blue 3 for instance
Technologies used:
- JavaScript
- p5.js
- Image provided by UoL
Note: For this particular university project, I am unable to show my code to the public due to plagiarism concerns. If you would like to see the code for this, please contact me.