top of page

Overview

By this time in the course of taking BIMD 250 - Introduction to Media Design I had learned much more about both JavaScript and understanding how to use data for visualizations and not only evaluation. The goal of this project was simply to begin practicing separating code into modules and create classes. Classes in most programming languages refer to the recognition of a set of properties, defined by modules, as a type of object. This concept is used in Object Oriented Programming languages such as Java which I  have some brief experience with.

This work was done mostly using the ideas from the last project because the use of 3D modeling can be used in these conditions without being affected. I decided to include a second shape as well called a torus.

process

Process

For this microproject I spent some time drawing out what a grid looks like to me. Fluidity in both the design of the code and the result were important to me. The concept that I aimed for was essentially a series of events all happening within a contained space. Modularity in design allows for a range of flexibility through standardization of components for reuse which is logic for this program.

Each object on screen is generated with relation to the previous one using the noise() function. The translation, position of the origin, is adjusted with respect to the value returned when querying the noise() function. The other result from having this relation is for each new generation of objects, they are related only to others generated at a similar time.

The pattern always begins very similar to the previous but over time can take a very different routine depending on when the mouseClicked and mouseDragged functions are triggered. The inspiration for this logic was mostly from the chapters on Time and Motion and being able to see the pattern develop into something different each time. The boxes in the middle of each torus help to create a second effect as well, because they rotate very slowly in the opposite direction as the object they're inside. It can make the torus objects look almost static when they line up for a few frames.

reflection

Reflection

In reflection, this project was slightly less challenging in concept because I was already familiar with the concept of creating modules to contain functions and classes to contain those modules. However, having this knowledge allowed me to refine the program I had written. The result was more time spent on the details of the program and gaining a much better understanding on how exactly the code was being handled by the browser. A challenge that I faced during this was to not get distracted by previous knowledge of programming languages such as Java and keep an open mind to the fact I am learning a new language with different rules. 

Moving forward with this project, I think I will revisit the code and attempt to implement some of the modules in the final project I did for this same course. The use of my code to scale the cubes inside the toruses I believe may helpful for scaling the asteroids in my final project.

project repo

Project in Action

Repository

Animation

cubes in toruses 2
bottom of page