Code with Curiosity
Published: 2024-03-08 15:56:18

One of the most exciting things about embarking on the journey to learn to write code is the idea that I can build things that I dream up. As an artist, taking my vision and capturing it on paper beautifully has been nothing short of life changing for me and that desire to create is part of what led me to the program I am currently attending at [Flatiron School](https://flatironschool.com/) for software engineering.

Part of my objective in writing these posts about learning to code is to bridge the gaps that may have gotten me learning to code sooner and connect with friends who are curious. In learning how programs are made I am starting to get a sense of what has always been mystifying to me. How does code go from that green text scrolling down the screen to a functional application? 

Much like art, a lot of making an application happens before the work actually starts. In this case I am examining how I went from an idea to learn and connect my artistic ideas to practicing writing code with a visual output I found interesting. 

My art in the printmaking world has connected organic flowing shapes, islamic geometry, and optical illusion which got me thinking, these are all rooted in math. There has to be a way to translate that into code, right? Enter GPT. How does math converge with islamic geometry? What mathematic principles visually explain tessalating patterns? Of course there were ways to make this work.

[The python graph gallery?](https://python-graph-gallery.com/) Mind. Blown. 

It's worth noting that the work of [Refik Anadol](https://refikanadol.com/) as the pinnacle of the convergence between art, code, and data is one of my favorite artists in the world right now which is another breadcrumb in this idea. 

![Refik Anadol Machine Hallucenations on Las Vegas sphere](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bcp1cmdahuwl7wy91ktt.png)

So many application ideas emerge from solving a problem the creator currently has or sometimes an attempt to improve code within an existing application can start with approaching the issue with curiosity. Another way art and writing code seem similar to me. 

As I poked around trying to find the inflection point between python, math and some kind of visualization the usage of [Pygame](https://www.pygame.org/) emerged as an interesting option. 

Now I had a tool in my tool kit to potentially make something visual! What could that look like? The basic demo for Pygame was simply to draw  a circle in a box. Could there be multiple circles? Could they move? Have color? Now we're off to the races. 

![circles on a white background with corresponding code](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rt28kfxkxxhtxefxxcwq.png)

Obligatory alliteration break: the process for arriving at a particular tool and the importance of preparation, play, and practice in building software is paramount. 

That said, my next step was to play with the structure I had started. 

I iterated through one ball, multiple balls, multiple balls bouncing, multiple colorful bouncing, all by adjusting the math within the pygame code watching how it affected the output on the screen. 

![Colorful spheres in a python visualization](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ggaqy41bmubjdsighvqu.png)

I clearly needed a front end for this adventure. I was excited. Here is where the lesson learning starts to come in. In my haste to apply my thinking I rushed off to make a react UI without entirely considering how all of this might connect functionally. 

![React inputs](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/iaqct63hljq2mq48h9nf.png)

While in theory it might be able to be functional to pass information via an API from a react front end to the python visualization code it isn't a terribly practical solution for sharing this kind of application.

An evening spent noodling on connectivity, reminding chatGPT that I was fully aware a React front end connecting to a Python back end as a user facing app was not the best option, and a lot of trial and error ultimately resulted in me giving up on bringing this idea to a web interface, for now. 

I decided to revisit my current Python learning to add a command line interface to control what inputs I had to wrap the idea up into its current state. 

![Command line interface inputs](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0upd59g74b4mmqfoj42i.png)

Using a CLI gave a pretty satisfying little route to make adjustments to the code and re-run the visualization without issue. That was enough for me for this first experiment to button it up and get to writing this blog. 

If you'd like to play around with my creation it is currently on [GitHub](https://github.com/KentRiggs/bouncy-balls). Fair warning, it is very much an idea with novice level execution, so far. 

That said, It was a lot of fun to make and explore which has piqued my curiosity to build more. I plan to continue to iterate with making the code more modular for other visualization options and to see where my imagination takes me next.