Project Outcome
Tracking Success
Following the completion of this project, I posted about it on social media. While my post received a good amount of support, I wanted to be able to actually track playse’s usage and visits post-launch.
To do so, I utilized Cloudflare’s built in web analytics to track key technical data like page load time, page views, and site visits by location. On top of that I also used Cloudflare’s KV Workers tool to be able to track and summarize data reflecting the success of the project. I configured this to track the number of plays, total listening time, and what songs users added to their library. All of these metrics are summarized daily and are also summed to create a total tally of all usage. At the time of writing this, the site has received 1321 plays, elapsed over 40 hours of listening, and 54 songs have been saved to libraries.
However, these numbers are likely smaller than what is actually true. I’m using a free tier of Cloudflare that can only record so much data per day. Almost every day, I receive an email saying that I’ve reached 100% of my usage, meaning that there is more listening happening than what is actually being recorded. That said, I would say that these numbers reflect a successful product that users continue to come back to.
Key Learning
Leveraging AI
This project was a great introduction to vibe coding for me. It taught me a lot about building websites from scratch and gave me the skills to level up my work from Figma prototypes to working products.
ChatGPT was a super helpful tool for learning all the technical aspect of building this project and did a relatively good job at generating code. However, I found that it has a annoying amount of “confidence” in the answers it gives even when it’s wrong or it’s code is flawed. If it could go back in time, I would have opted to using Claude’s superior coding skills and ability to integrate with Figma and Visual Studio Code to more seamlessly and efficiently build this product.
Moving forward, I’m excited to continue to utilize AI and Figma to easily turn effective design solutions into engaging and tangible products.