Consentful Interface

Objective

Revise your Assignment #6 Experimental Camera by adding a consentful interface.

Flow Chart of Consent

NOTE: The camera functionality central to this sketch doesn't appear to work when the sketch is running on this site. Click to see the code and try running it in the p5js webeditor. That should fix it!

Description

I wanted to build in core functionalities where the user could opt in to starting the main program and opt out at any time.This was primarily due to the fact that the program uses a lot of particles, and can be pretty hard on the computer. Also I wanted to give the user consent with regards to thier image and starting/stopping the sketch. I think it was sucessful in stopping the core program, and that in itself gives the user a lot more agency than they had previously. However, I wasn't able to get the camera to only run if opted in. When I tried calling it in draw, if was called constatly and slowed the program to the point that it was no longer useable. I tried builfing a function but unfortunately ran into the same issue. As a result, currently the camera is always running when the sketch is running, as opposed to the player being able to start or stop the camera. This is probably one of the biggest shortcomings of this assignment for me. The sketch uses checkboxes. I tried implementing a start button, but it was constantly registering as 'true', this really took away the agency of the user and for that reason I scrapped the button. I did try out several DOM elements in a seperate sketch for this project, so you can see more of them demonstrated here:

Extra Notes on DOM elements- File Uploads and Color Pickers

For my 7-in-7 I used a DOM element to upload a custom image to a sketch, and programmed my own colorpicking functionality. The p5js colorpicker doesn't actually work as an eyedropper tool, you can't sample colors from your screen. I found this really annoying. So, I used getcolor to code my own colorpicker that works with an uploaded image. The sketch below uses multiple color samples to generate the MULTIPLY blend mode used to shade a given base color to a given resulting color. I wanted to share this as an additional example for working with custom images and DOM elements