Faculty of Design

Graphic Design

Olivia Pasian

Community Garden

I created this website as a part of my capstone project about designing my own version of the web with the goals of collaboration, community, creativity, and craft. This website was built and designed from scratch by me, using Socket.IO, JavaScript (p5.js), HTML, and CSS. This website is a community garden, where on your phone, you can use sliders to design your own flower, which is then named and sent to the desktop version which houses the full garden. Everyone's flowers start as a sprout and grow over the course of several days. There are 5 stages of growth which update every 17 hours, until at stage 5, it displays the user's designed flower. The flowers need water every 3 days or they turn brown and can be returned to life by using the water button. Socket.IO allows all changes to appear instantly on the page for all users, no need for refreshing.My goal with this project was to create a similar experience of being a part of a community garden but in an online space that can be used anywhere. I wanted to use my own interest in plants and plant growth to create something that people would want to come back to and feel proud of their communal progress. I created several animations of animals and added different states based on time of day, so when you return to the garden it will look different and give you a reason to come back. It is a quiet, slow space on the web, contrary to the fast, ad-pushing web we usually see.Check out the desktop and mobile versions of the site here: https://botanical-bytes.glitch.me/