Gemini Gallery

Gemini Gallery, Where Art Meets Accessibility.

Comment

Inspiration

Our team is inspired everyday by art that can be found online, through friends, and even from ourselves. We understand the concern surrounding accessibility when it comes to the challenged truly appreciating the beauty of art, and we also can see that artist's spaces are limited. With the rise of generative AI without proper legal measures to protect the rights of artists, our team looks to find a non-intrusive way of collaborating the importance of both arts and technology. When artists have a space to share their work, the medium becomes that much more enjoyable for everyone.

What it does

With Gemini Gallery, users can caption and describe an uploaded image in concise detail using Google Gemini AI in a click of the button. The idea is that a user will upload a file (preferably png/jpg) and the platform will automatically generate a sentence-long caption. Alongside that, the program will generate a brief description describing the image in more detail.

How we built it

Using HTML, CSS, and JavaScript, we made our basic framework and styling for the website. Javascript was our backend too, using Node.js (for server side work), Express.js (for its RESTful APIs) and connecting to the most important part, Gemini AI. The files themselves are very compact on VSCode. We used Git for version control with GitHub as our main collaboration tool. Python also became vital as we began looking into a local server without using LiveServer.

Challenges we ran into

Our most prominent issue was the consistent refreshing of our page when running our VSCode on the LiveServer extension. We had never encountered issues with LiveServer before, so we had assumed there was significant issues with the code leading to the errors. After exhausting all options, we visited the Genius Bar. Moody was extremely helpful, trialing with us for over an hour until we finally found the issue, and it wasn't our code. LiveServer's primary function revolves around constant refreshing, which is usually great for seeing the frontend of our project. However, real-time updates can impede on the rest of our program since it needed to fetch the image uploaded, but if the uploaded image was not saved and the application is refreshed, the program would fail to caption the image. Thankfully, we could avoid LiveServer all together in favor of a local Python server for running instead. Unfortunately, we did not have time to make the images uploaded display on the screen, but we would love to add it later.

Accomplishments that we're proud of

Seeing as we are all beginners, the majority of us attending our first hackathon, creating a working web app that has its own domain is already a big milestone for our team. An accomplishment that we are most proud of is definitely getting the connection between the frontend and backend running as it was a long-running issue, and a small but important one. The website publishing and the bouncing button hovers are also honorable mentions!

What we learned

As beginners and freshmen from WVU, we came in without much knowledge on source control, software development, and hacking in general. This was a great experience with each of us gaining unique skillsets. From frontend, we've learned CSS and HTML. For backend, we have Javascript (and js frameworks) and Gemini, and in general, we've started GitHub accounts with basic Git functions, VSCode extensions, and general coding standards! This experience has been a great first, and we're excited to continue in our hacking journey.

What's next for Gemini Gallery

If we had more time, we would like to implement many more functions (most of which are visually included through Figma!).

  1. Pictures are uploaded and saved as a portfolio on an account
  2. Searching bar that can use keywords from the generated caption and find similar images
  3. Creating a 3d image of an uploaded 2d image This is meant to be a platform for artists with the accessibility necessary for the visually impaired! Everyone should be able to appreciate the visual arts.
Share this project:

Updates