A team of three: Name, Cy and I worked together on creating and maintaining the weather band database from a weather station in East Village in NYC made by Yeseul. Name and Cy did most of the server side while I worked on the API demo and visualization for the client side. For more information of the backend for the server, please see Name’s post here. Check out our official github here.
UI design by me on Figma
Name’s UI wireframe
This is when I finished the basic UI design as well as the functionality for each button at the beginning of the week.
getting the data from one file to another
I tried to use export and import but it gets too complicated and keeps giving me error. Then I followed this tutorial and decided to use sessionStorage and it works!
But then once I kept the playing with the code as below,
it keeps showing true when I am clicking the variable. So I ended up combining the code in one file.
Input in html
Input is amazing. I get to choose the format for it by following the tutorial.
Collaborating is quite fun.
We collaborated remotely through GitHub as well as p5.js to build the client side. Cy used the code to put a callback function to make sure the json data is loaded before it is being processed by the sketch. She also helped to get the json data to connect with the option select events.
Name also made visualizations on the side so it is more visually pleasing.
In the meantime, I combined all the code they wrote and fixed bugs such as
- images drawing on top of each other
- not being able to reset everything
- not showing the default value upon loading
You can find the final code here on my github.
I used several generators to speed up my process.