Connections Lab: Project II

Links:

Github: https://github.com/KatJPark/Bouquet-Blocks

Glitch: https://sheer-alpine-dill.glitch.me/

Key Concept or Intentions Driving Project:

I’ve been interested in an app that allows people to send each other bouquets of flowers with nice notes on them. During COVID, a lot of people had babies, moved away, got promotions, new jobs, etc. and we couldn’t get together to celebrate, etc. and a lot of the “sign this card!” kind of website was really ugly. I have always liked arranging flowers or making bouquets for special occasions, and I thought it would be nice to have something like that where people could contribute to making a bouquet and sending nice messages with it.

This is obviously a prototype “proof of concept” of that idea, and in no way fleshed out. Some basics to get through were things like: client side interaction (arranging things, sending that arrangement, and then seeing other arrangements) and server side (getting the arrangement image, storing it, and displaying it somewhere). I descoped from flowers, notes, and sending a private email of the bouquet, to just arranging blocks, capturing it, and storing it.

Production Decisions

Another point I was interested in beyond the “product” was a deeper understanding of the client/server relationship and how someone would approach architecting this. There are obviously some inefficiencies and according to Brian, security issues, with this approach, but it was enough to get me to understand the set up of a project like this.

Production Planning: https://www.figma.com/file/yTfXlbEXhnmYVPGhuU1TqI/Connections-Lab-Project-2?node-id=0%3A1

It was relatively easy to do the production of this because it was already descoped quite a bit, we did consider adding things like Socket.io so people could arrange together, but since I wanted to continue this project for the final, we decided to leave it out.

I usually like very simple and graphic designs, so I took some notes from this cover of Pelican Books “The Common Sense of Science”, while I was working with the “blocks” it occurred to me that just asking people to arrange blocks, while not as emotional as arranging flowers, was an interesting project as well since I am curious about how people would approach just freely arranging blocks. I probably shouldn’t have called it “Bouquet” because it prompted everyone to try to make something pretty. https://hbfs.files.wordpress.com/2010/05/common-sense-of-science.jpg?w=140&zoom=2

We used p5, neDB, node, express.

Challenges

Other than my inexperience and technical inability, none. :D I actually think it was nice to work a with someone in a different time zone based off of a plan that we mutually agreed on up front. I think that upfront work saved a lot of trouble. It would kind of happen that I would write some code, push it to Github, send Jaye a text, go to sleep, and wake up to a text from and more code from Jaye, and then add my own, push, text, go to sleep, and wake up to more, etc. It felt very efficient bc one person would stop as another person started, so there wasn’t enough overlap to confuse us, and we had a clear idea of where 1 person was working and another needed to fill in blanks. I know Jaye had some medical emergencies, but she very impressively pulled through! I was never that worried~

Lessons Learned

There are a lot of different solutions for a lot of different problems once you get into the architecture. I’m not sure this is a solution, but just doing something that seems straightforward enough and pushing it through as a proof of concept once helped me learn a lot about what or how I might do it differently the next time. So as much as all the architecting and diagramming beforehand made me feel empowered to understand this on a theoretical level, doing certain things over and over again was also helpful. It’s kind of nice to charge ahead without knowing any better, I think this project would have been painful if I knew about p5 Play because then I would have gotten really into the idea of making it look and act “perfectly” using that. But getting to just hammer out a lame version was probably more educational than struggling and hacking my way through something complex. I kind of want to do this exact project again for the Final just to make sure I understand it well enough.

Relevant Resources/References

Brian Ho’s Brain

Nun’s Draggable Code: https://editor.p5js.org/icm/sketches/BkRHbimhm

This Book Cover: https://hbfs.files.wordpress.com/2010/05/common-sense-of-science.jpg?w=140&zoom=2

Any other resources I think I left in comments in the code so I can see it when I need it.