Inspiration

As we embarked on this project, frustrated by the opaque nature of terms and conditions agreements, we envisioned a solution. Our goal was simple: to create a website that deciphers these complex legal documents into plain language summaries. We wanted users to understand what they were agreeing to and why it mattered. With each line of code, we felt a sense of empowerment, knowing that we were contributing to a more transparent online environment. By providing users with the information they need, we can foster a culture of digital literacy and accountability.

What it does

The website is designed to simplify and highlight crucial aspects of terms and conditions agreements, focusing on user privacy and security. First, the user will copy the terms and conditions segment from a host website and paste it into our website. Our website will start by offering a concise explanation of general terms, covering user rights, content ownership, and platform access rules to the user. Then, it dives into the privacy section, emphasizing data collection practices, sharing protocols, and security measures. The website specifically identifies clauses that may compromise user privacy or security, such as third-party data sharing or lack of encryption protocols. By categorizing the summary into sections, it ensures easy comprehension.

How we built it

We developed our project using Next.js 14 paired with Tailwind CSS for efficient web development and sleek design. Before deployment, we integrated Google's generative AI library to access the Gemini Pro API seamlessly. Before deploying on Vercel, we implemented a Prompt mechanism to ensure accurate outputs, especially concerning terms and conditions. This approach facilitated dynamic content generation based on user interactions. Vercel's platform, tailored for Next.js applications, provided hassle-free deployment and hosting. Overall, this combination enabled us to create a responsive and feature-rich website for our hackathon project.

What we learned

During the project, we honed our skills in advanced web development with Next.js and Tailwind CSS, mastering server-side rendering and responsive design. Integrating Google's generative AI API enhanced our understanding of API integration. Implementing a dynamic Prompt mechanism improved user interaction.

Challenges we ran into

  1. Formatting Output: Difficulty in obtaining output in a specific pattern, particularly JSON format, required to convey the significance of terms and conditions points through UI elements like color coding (red for most important, yellow for medium, green for general), which wasn't directly supported by the Gemini-API.
  2. Inconsistent Output: Facing issues where the output received didn't match the expected format, occurring in about 30% of cases.

What's Next for TermSavvy: Know Before You Click

  1. Addressing Formatting Issues: We'll explore alternative methods to achieve the desired output format, particularly JSON, ensuring that terms and conditions points can be effectively conveyed through UI elements like color coding.
  2. Google Chrome Extension Development: In parallel with addressing the technical challenges, we'll initiate the development of a Google Chrome extension to provide users with convenient access to the enhanced terms and conditions summary feature. This extension will streamline the process of reviewing and understanding website policies, thereby promoting digital literacy and consciousness among users.

Built With

  • google-genarative-ai
  • google-gimini-api
  • next.js-14
  • rehype-raw
  • remark-gfm
  • tailwind-css
Share this project:

Updates