# Athena **Next Generation CMS Tooling Powered by AI**

## Inspiration

The inspiration for our project, Athena, comes from our experience as students with busy lives. Often, it isn't easy to keep track of the vast amounts of media we encounter (Lectures, webinars, TedTalks, etc).

With Athena, people can have one AI-powered store for all their content, allowing them to save time slogging through hours of material in search of information.

Our aim is to enhance productivity and empower our users to explore, engage, and learn in a way that truly values their time.

## What it Does

In Athena, we empower our users to manage and query all forms of content. You have the flexibility to choose how you organize and interact with your material. Whether you prefer grouping content by course and using focused queries or rewatching lectures with a custom-trained chatbot at your fingertips, our application Athena has got you covered.

We allow users to either perform multimodal vectorized searches across all their documents, enhancing information accessibility, or explore a single document with more depth and nuance using a custom-trained LLm model. With Athena, the power of information is in your hands, and the choice is yours to make.

## How we built it

We built our application using a multitude of services/frameworks/tools:

* React.js for the core client frontend
* TypeScript for robust typing and abstraction support
* Tailwind for a utility-first CSS framework
* ShadCN for animations and UI components
* Clerk for a seamless and drop-in OAuth provider
* React-icons for drop-in pixel-perfect icons
* NextJS for server-side rendering and enhanced SEO
* Convex for vector search over our database
* App-router for client-side navigation
* Convex for real-time server and end-to-end type safety

## Challenges We Ran Into

* Navigating new services and needing to read **a lot** of documentation -- since this was the first time any of us had used vector search with Convex, it took a lot of research and heads-down coding to get Athena working.
* Being **awake** to work as a team -- since this hackathon is both **in-person** and **through the weekend**, we had many sleepless nights to ensure we can successfully produce Athena.

## Accomplishments that we're proud of

* Finishing our project and getting it working! We were honestly surprised at our progress this weekend and are super proud of our end product Athena.
* Learning a ton of new technologies we would have never come across without Tree Hacks.
* Being able to code for at times 12-16 hours straight and still be having fun!

## What we learned

* Tools are tools for a reason! Embrace them, learn from them, and utilize them to make your applications better.
* Sometimes, more sleep is better -- as humans, sleep can sometimes be the basis for our mental ability!
* How to work together on a team project with many commits and iterate fast on our moving parts.

## What's next for Athena

* Create more options for users to group their content in different ways.
* Establish the ability for users to share content with others, increasing knowledge bases.
* Allow for more types of content upload apart from Videos and PDFs
## 💡 Inspiration

Whenever I was going through educational platforms, I always wanted to use one website to store everything. The notes, lectures, quizzes and even the courses were supposed to be accessed from different apps. I was inspired by how to create a centralized platform that acknowledges learning diversity. Also to enforce a platform where many people can **collaborate, learn and grow.**

## 🔎 What it does

By using **Assembly AI** and incorporating a model which focuses on enhancing the user experience by providing **Speech-to-text** functionality. My application enforces a sense of security in which the person decides when to study, and then, they can choose from ML transcription with summarization and labels, studying techniques to optimize time and comprehension, and an ISR(Incremental Static Regeneration) platform which continuously provides support. **The tools used can be scaled as the contact with APIs and CMSs is easy to *vertically* scale**.

## 🚧 How we built it

* **Frontend**: built in React but optimized with **NextJS** with extensive use of TailwindCSS and Chakra UI.
* **Backend**: Authentication with Sanity CMS, Typescript and GraphQL/GROQ used to power a serverless async Webhook engine for an API Interface.
* **Infrastructure**: All connected from **NodeJS** and implemented with *vertical* scaling technology.
* **Machine learning**: Summarization/Transcription/Labels from the **AssemblyAI** API and then providing an optimized strategy for that.
* **Branding, design and UI**: Elements created in Procreate and some docs in ChakraUI.
* **Test video**: Using CapCut to add and remove videos.

## 🛑 Challenges we ran into

* Implementing ISR technology to an app such as this required a lot of tension and troubleshooting. However, I made sure to complete it.
* Including such successful models and making a connection with them was hard through typescript and axios. However, when learning the full version, we were fully ready to combat it and succeed. I actually have optimized one of the algorithm's attributes with asynchronous recursion.
	+ Learning a Query Language such as **GROQ**(really similar to GraphQL) was difficult but we were able to use it with the Sanity plugin and use the **codebases** that was automatically used by them.

## ✔️ Accomplishments that we're proud of

Literally, the front end and the backend required technologies and frameworks that were way beyond what I knew 3 months ago. **However I learned a lot in the space between to fuel my passion to learn**. But over the past few weeks, I planned and saw the docs of **AssemblyAI**, learned **GROQ**, implemented **ISR** and put that through a \**Content Management Service (CMS) \**.

## 📚 What we learned

Throughout Hack the North 2022 and prior, I learned a variety of different frameworks, techniques, and APIs to build such an idea. When starting coding I felt like I was going ablaze as the techs were going together like **bread and butter**.

## 🔭 What's next for SlashNotes?

While I was able to complete a considerable amount of the project in the given timeframe, there are still places where I can improve:

* Implementation in the real world! I aim to push this out to google cloud.
* Integration with school-course systems and proving the backend by adding more scaling and tips for user retention.
## Inspiration

We are part of a generation that has lost the art of handwriting. Because of the clarity and ease of typing, many people struggle with clear shorthand. Whether you're a second language learner or public education failed you, we wanted to come up with an intelligent system for efficiently improving your writing.

## What it does

We use an LLM to generate sample phrases, sentences, or character strings that target letters you're struggling with. You can input the writing as a photo or directly on the webpage. We then use OCR to parse, score, and give you feedback towards the ultimate goal of character mastery!

## How we built it

We used a simple front end utilizing flexbox layouts, the p5.js library for canvas writing, and simple javascript for logic and UI updates. On the backend, we hosted and developed an API with Flask, allowing us to receive responses from API calls to state-of-the-art OCR, and the newest Chat GPT model. We can also manage user scores with Pythonic logic-based sequence alignment algorithms.

## Challenges we ran into

We really struggled with our concept, tweaking it and revising it until the last minute! However, we believe this hard work really paid off in the elegance and clarity of our web app, UI, and overall concept.

..also sleep 🥲

## Accomplishments that we're proud of

We're really proud of our text recognition and matching. These intelligent systems were not easy to use or customize! We also think we found a creative use for the latest chat-GPT model to flex its utility in its phrase generation for targeted learning. Most importantly though, we are immensely proud of our teamwork, and how everyone contributed pieces to the idea and to the final project.

## What we learned

3 of us have never been to a hackathon before!
3 of us never used Flask before!
All of us have never worked together before!

From working with an entirely new team to utilizing specific frameworks, we learned A TON.... and also, just how much caffeine is too much (hint: NEVER).

## What's Next for Handwriting Teacher

Handwriting Teacher was originally meant to teach Russian cursive, a much more difficult writing system. (If you don't believe us, look at some pictures online) Taking a smart and simple pipeline like this and updating the backend intelligence allows our app to incorporate cursive, other languages, and stylistic aesthetics. Further, we would be thrilled to implement a user authentication system and a database, allowing people to save their work, gamify their learning a little more, and feel a more extended sense of progress.