P5 JS Interactive Animation Demo & The Flatiron School’s Access Labs Program
Originally published on LinkedIn, March 22nd, 2018
JavaScript P5 Animation Demo
https://github.com/TheMitchWorksPro/FlatIronLearningCode on my GitHub provides you with three iterations of code, each building on the previous. Two were created during a free class from Access Labs that I attended. In the class, students are walked through step-by-step how to set up a P5 animation canvas and create a static circle within a square upon it. A few simple concepts like RGB and random number generation are introduced. Then, by the end of class, students have built a simple animation in which the circle grows, obliterating the square, and ultimately filling the entire canvas. Then the circle resets and does it again. If a user clicks on the animation, the color of the circle changes to a randomly generated color.
Out of personal interest, I researched and modified the code further once class was complete. My version arranges this animation in a reusable function and generates a grid of four of them on the canvas. I made certain aesthetic changes to how the animation works. I enhanced the random color generation code with a simple check that reduces the risk of the same color being chosen twice in a row. Lastly, my experimentation came up with 6 different minor behavioral variations for the animation that I integrated into URL parameter-controlled settings. This is beginner code but never having worked in P5 before, it was an enjoyable experience to take what they showed me and run with it. Feel free to obtain the code from my Git project and play with it yourself. Comments in the JavaScript file provide instructions for testing the different parameter variations. Hyperlinks are also provided on the main page of the project that you can click on to see all the variations of the code in action.
Background: Access Labs
The Flatiron School recently opened a new program at their new WeWork space called “Access Labs.” The program is a boot camp founded on the principal that the ever-expanding code based professions should not be inaccessible to the talented, but financially disadvantaged. Students owe no tuition until after they graduate and land their first job. While the minimum salary at which the students have to begin paying back is rather low, they ensure the program is affordable, and if work is not found within a reasonable timeframe than the student owes nothing. Whether you are just starting out or just trying to break in, this brings the possibility of computer programmer training within reach to many who otherwise could not afford it. The school markets the program as software engineering. However, the concepts explored in their first demo class seem more relevant to web design or UI/UX. Regardless of what specific type of coding career the program truly prepares its students for, the goals of the program seem noble, the workspace looks well put together, and the school offers free events like the one featured in this write-up. If you are considering whether this program is right for you or someone you know, consider checking out the reviews on course reports. The flatiron website also offers a kind of “try it before you buy it” approach. You will find free introductory online classes you can take under no obligation to the school, and then decide whether or not to attend later. You can also get on their mailing list by attending a free event, and sit in on classes like the one described here.
The Flatiron School Free 2 Hour JavaScript P5 Class
The class was hosted in beautiful DUMBO Heights, Brooklyn at what should be the new site of Access Labs. The class was clearly targeted at an audience who has never coded before. They provided a handy URL for building and testing code hands-on (no setup required). The teacher did an excellent job of explaining everything necessary without sounding like he was explaining everything. Even for more knowledgeable coders and programmers, you may want to check out their events and attend any that are in languages or technologies which you are currently unfamiliar with.
Feel free to post your comments with what you know about getting started in P5, The Flatiron School, or Access Labs along with this post. Your comments may be helpful to others reading it. Thanks for reading my post.