Experiment 1: Eidolon — Melissa

Project Description

Project on GitHub

ezgif-com-optimizeEidolon is a looped animation of two snakes with geometric form rotating around a planet-like sphere. I used p5.js to model the snakes, apply transformations, create the environment/scene, and render the animation. The reason I used p5.js, besides the fact that is a beginner-friendly program, is that it is the only program I am comfortable with. While I have used Processing in the past, I have no experience with languages besides Javascript, HTML, and CSS, and my skills in Processing are limited. I took advantage of the fact that we were taught p5.js in class, and though I occasionally applied methods I knew from Processing, I ultimately relied on p5.js to create this sketch.

This project began as a tattoo design. A friend of mine, who over the years has owned approximately nine snakes and six other reptiles, wanted a tattoo of a small ball python around her ankle. To design this tattoo was my original intent, but due to the limitations on drawing that exist when coding rather than using traditional materials, I took the theme of snakes, and went in a different direction.

The role snakes play in mythology peaked my interest while I was researching types of snakes. Due to their ability to shed their skin, they were often associated with immortality and healing, which has carried on to this day, at least to the extent that entwined serpents are the symbol for medicine/physicians. Snakes are often representative of the underworld, as well, and the mythical. From dragons to Medusa, snakes play a key role in monsters, magic, and ethereality. These are the themes that became the foundation for the project, Eidolon, which itself means an apparition or ideal.

Continue reading “Experiment 1: Eidolon — Melissa”

Experiment 1 – Tyra & Ola




For our game, we wanted to make the game Snake out of p5.js only. Our final (current) version achieves this, as you move the player with the arrow keys, avoiding touching the walls and yourself, as you collect points in the form of cats. The game was made mostly to challenge ourselves to use this new program and try out things we had not done before.

After making most of the code, we found a snake demo from p5.js, but the coding methods were completely different, so we simply used it to ensure we had the core elements of the game. (https://p5js.org/examples/interaction-snake-game.html)

https://www.google.com/search?q=snake – an example of Snake, via a Google built-in game

https://www.youtube.com/watch?v=XINAniQCh8Y – more examples of Snake

The final cat for the game
The final cat for the game
some inspiration

Aesthetically, we wanted something very cute and soft, so all the edges are rounded, and the colours are very pastel and muted. This was inspired by the Pusheen emotes, seen in applications such                        as FaceBook messenger.

These different emotes also played a role in why we chose cats as the point system.

more inspiration

We used the concepts we learned in this class and previous classes to build the code from nothing. Concepts such as collision detection, movement, sound, and random spawning locations for the cat were from this class. However, we did find a video that helped us stay organized and understand the code as we made the game. (Coding Challenge #3: The Snake Game) In the end, we called upon the CSS code we learned in Intro to Computer Science to tie the browser together aesthetically.

If the enemy spritewe had more time, we would add levels or difficulty, such as adding enemies (in the form of bees) and faster speeds. We also discussed changing the spawn parameters for the cats so they stay entirely on canvas, via a grid system of sorts. Other possible wants would be to add a restart or pause button, as mentioned                                                        during critique.

Hello world!

Welcome to OCAD University Blogs. This is your first post. Edit or delete it, then start blogging! There are tons of great themes available for you to choose from. Please explore all of the options available to you by exploring the Admin Toolbar (when logged in) at the top of the page, which will take you to the powerful blog administration interface (Dashboard), which only you have access to.

Have fun blogging!