Potara

Shape up your drawing potential

Comment

From a blank canvas 📋 - Inspiration 🤩

Getting together after opening ceremony, our goal was to use the power that artificial intelligence brings to enhance, rather than hinder, human creativity. In our own experience, AI has helped us to deconstruct complex ideas, and that got us thinking... 🤔

We want to augment the skills that artists already have, and also provide tools that can help build your creative toolbox 🧰, leading us to, ✨ Potara ✨

Sketching it out ✏️ - What is Potara 💫

When drawing, one incredible skill experienced artists have in their toolset is the ability to break down a complex figure into basic shapes, making it easier to draw. 🟦🔴 Potara hones in on this skill and creates visualizations based on a reference image, assisting users in simplifying objects! Potara provides both outlines & filled in shapes, decomposing difficult shapes and making it easier for artists to learn how to both identify and draw these shapes on their own.

Once Potara has provided you with the building blocks, you can use the in-app canvas to draw! ✍️ As you're drawing, Shelly, your AI Artist Mentor will give you some feedback! Once you're done, you can download your drawing to save it to your account, making it a great way to see your progress! 📈

Picking the colors 🎨 - How we crafted Potara 🔨

Potara's infrastructure is containerized with Docker Compose, ensuring a reproducible, scalable environment for our four core services.

  • Vite and React Frontend - For our handcrafted, cozy user interface
  • Node.js and Express Backend utilizing the Prisma ORM - For our API
  • MinIO blob storage - To store generated references & drawings
  • PostgreSQL Database - Storing our users, feedback, reference data & drawing data

The entire app is hosted on a Digital Ocean VPS, with Nginx acting as a reverse proxy and SSL encryption through Certbot. The UI was designed in Figma and our development workflow was charged by a Github Actions CI/CD pipeline to provide seamless, automated deployments.

Finally, the pièce de résistance, integration with the Google Gemini API which powers the shape generation, outline generation, and the live feedback generation! 🤯

The happy little accidents 🖼️ - Challenges we ran into ⚠️

One technical challenge we encountered was architecting the client-side drawing canvas. The main goal of Potara is the robust references, but we still wanted to provide users with the option to draw on the site itself. It was a difficult balancing act between focusing on the core of Potara and implementing a feature-rich web canvas. ⚖️

On the backend, it took a lot of trial and error to get a clean shape and outline generation. We walked an incredibly fine line between too many shapes which didn't simplify the image enough or too basic of one, which didn't match the reference well. We overcame through a commitment to getting it just right. 🔬

Live feedback was also a tough implementation, with lots and lots of bugs, but it ended up being an extremely cool and helpful feature that we're so excited to provide!

Reflecting on a beautiful work 🖌️ - Accomplishments that we're proud of 🥹

We're incredibly proud that we were able to bring a full stack application with as many moving pieces as Potara together. We worked incredibly hard to sketch out a solid foundation 🧱, and it was a marvelous experience bringing to life each piece and seeing it come together.

Our integration with the Google Gemini API exceeded our expectations. Without the level of customizability and intelligence that it provided, Potara would have lacked the polish and performance that it has today. 🏎️

We are extremely proud of our work on the live feedback engine used to help users draw out the shapes, Shelly is such a fun companion and we felt so happy seeing her come to life. 🐚

What we learned 🎓

Our key takeaway this hackathon was the advantages provided by focusing on DevOps in our first day. We invested a large portion of our early time in system design, charts, diagrams, and our CI/CD which saved us precious hours when it came to building the rest of our application. 🧐

This was the first time we used a VPS to manage an environment and it provided all of us incredibly deep insight into network configuration, process management, and security that usually gets abstracted by cloud services. Now having this understanding, we feel more confident in our ability to use both server and serverless approaches in our future work. ☁️

The next masterpiece 🔮 - What's next for Potara ⏭️

With Potara's reproducible and scalable design, there is no doubt that we can take this project to undeniable lengths. Looking forward, we plan to further enhance the in-app canvas with more creative options as well as create a feature that allows users to upload their very own drawings to Potara. Additionally, We hope to one day give Potara the ability to analyze animation, breaking down the physics and structure behind live animated visuals and helping a variety of artists nourish their unique skills. ⭐

Built With

+ 6 more
Share this project:

Updates