What's Gemino?

Learning a new language can be a daunting task, but with the right tools and resources, it can become an enjoyable and rewarding experience. If you've ever dreamt of mastering the German language, Gemino can be of great help to you.

Gemino is a free and open-source AI-powered platform designed to make the journey of learning German fun, engaging, and effective.

Gemino is a combination of an ed-tech platform, a full-stack social-media experience, a friendly learning community full of healthy challenges, and a powerful AI-powered learning integration.

Whether you're a complete beginner or looking to refine your existing German language skills, Gemino offers a seamless learning experience.

Here's a quick overview of what Gemino has to offer:

• 50+ Interactive Levels: Gemino has a library of over 50 interactive levels that will guide you through the German language-learning process. These levels are powered by AI and are designed to keep you engaged while you progress in your language journey. We are constantly adding more and more levels each and every week.

• AI-Powered Tutor: Gemino has Bob, a 24/7 AI-powered tutor. Bob is there to assist you at any time, day or night. Have questions, doubts, or need help with past mistakes? Bob is just one message away. With Bob, you'll never feel alone on your language-learning journey.

  

  User's custom data like their progress, their mistakes, and their performance on the Gemino platform is fed to the bot so that it has more details about the user and helps them out in a better way:

  

• Study AI-Generated Flashcards: Gemino takes personalization to the next level by generating exclusive flashcards tailored to your learning style and past mistakes. Use these flashcards to revise your errors and grasp new concepts with ease. User's progress and the mistakes they make are fed to the AI engine to generate exclusive flashcards for them:

  

• Gemino Dictionary: No more leaving the platform to look up unfamiliar terms! Gemino integrates a dictionary directly into its interface, accessible anytime, anywhere across the platform.

• 

You can even search for commonly used phrases in German and get meaning for them, straight away!

And there's a lot more, you'll be amazed to see once you try Gemino yourself!

What makes Gemino exciting?

The internal architecture has various features that keep the user engaged and help them learn in an interactive and fun way.

Some of them are:

• Gemino Gems: With each level completed, the user earns points based on correct answers, 10 points per answer. Achieving a perfect level yields 150 Gemino Gems. Gemino Gems determine their global leaderboard position, with more Gems leading to a higher rank. This encourages the user to keep learning and improving their skills.

• Gemino Streak: To motivate the user and develop a sense of consistency, we have a streak system. The internal architecture tracks every day the user logs in and learns. If the user does not complete at least one level in a day, their streak is broken. The streak is displayed on the dashboard as well as on the global leaderboard.

• Gemino Tags: As the user progresses through the levels, they are awarded tags based on their performance. These tags are generated based on the user's performance in the levels. The tags are displayed on the dashboard as well as on the global profile of the user.

• Global Leaderboard: Gemino has a global leaderboard that displays top users based on their Gemino Gems and performance. This motivates the user to keep learning and improving their skills and also helps them compare their performance with other users in a friendly manner:

Note that some of the usernames as shown in the above image are for sample only so as to demonstrate real-like leaderboard standing, and clicking on them will take you to a 404 page. Once we have a great data set of real users, I'll remove the sample users.

The Creative Tech-Stack powering Gemino:

Gemino is built using efficient and powerful technologies to make the user experience smooth and fun. I cannot be more thankful to the developers and the community behind them for the amazing work they offer.

Gemino is built using:

• Front-End: Next.js

• Styling: TailwindCSS + shadcn/ui + HyperUI

• Database: PostgreSQL

• Interface for Database: Outerbase 🌟

• Graphics and Vector Images: Popsy.co

• User Authentication + Management: Clerk

• Email integration: Resend

Super thankful to this repository that has provided a JSON of the English-German dictionary that powers the Gemino dictionary.

The Magical AI Integration:

Gemino uses a magical AI integration to help the user learn better. Gemino appreciates OpenAI offerings and uses their models to generate questions and verify questions, power the AI Chatbot (Bob), and generate AI flashcards.

In particular, we have used the GPT-3.5 model and concepts like OpenAI Functions and on-the-fly flashcard generation to make the user experience more interactive, fun and exclusively unique.

With the help of Outerbase Commands, the AI Integrations have custom-tailored data of the user and their performance on the platform, on-demand, so as to provide custom and exclusive content for them

The Vercel AI package offers better integrability of OpenAI offerings by providing a smooth architecture and features like streaming, caching and edge runtime to make the application fast, better and smooth to use.

Since AI Integration is expensive, we have some limits set up. There might be instances of incorrect/no results when a lot of users are accessing the resources. Though this is very rare, a refresh to the page or retrying the action will solve this.

How Outerbase acts as the backbone of Gemino:

Before moving forward, let's talk about Outerbase:
Outerbase streamlines database operations, enhancing productivity. It facilitates real-time team collaboration for accelerated task completion. Utilizing EZQL, the natural language of SQL tool, makes data querying a hassle-free process.

Outerbase serves as the gateway to our database. This gateway helps Gemino in two-route transactions of data between the database and the user.

In a broader overview, the user can send a request to the database through the gateway where the back-end-ish magic happens and the further request gets data from the database, and then back to the user.

Gemino utilizes the magic of Outerbase in the following manner:

Outerbase Commands:

Here's a quick fun fact, Gemino utilizes a whopping 25 Outerbase commands across the project for the continuous and smooth flow of data and various operations upon them.

Different commands use different logic using a combination of Javascript & PostgreSQL query nodes across different HTTP methods.

Here's a list of some examples of the commands I've used to utilize Outerbase as the backend:

• Registering User to Database: This command is activated via a webhook from Clerk that passes a payload of information about the user who's just registered to the Gemino, which is then registered to the Database in the corresponding schema under the table signups. Further, this command registers the user in a user_progress table that will be later used across the platform and has stock values about the user's performance.

• Get User's Stats: This command fetches data about a user like their username, image, progress, points, level etc. and then updates the UI accordingly.

• Update User's Stats: This command updates information about the user in the database and then further populates respective data.

• Get Level Data: This command gets information about a certain level from the database which is then further processed in an interactable manner, to make the user learn words and sentences.

• Get What User Must Revise: This command helps in getting information about the mistakes and errors user has made in their past tests, and then further process it to feed the UI, generate AI-powered flashcards, and update the AI Tutor's knowledge.

• Get User Rank: This command helps in getting a user's rank based on their overall standing across the database when compared to other users, and then updates the UI in their profile section, as well as their dashboard.

• Get User Profile: This command helps in getting relevant information about the user and updating the UI at various places across the platform.

• Get Current Streak: This command helps in just getting the streak of the user while updating the record with the most relevant record.

• Update Streak: This command dynamically updates the user's streak by performing relevant operations and calculations.

• New Report Request: A user can easily report another user on the platform if they feel anything suspicious about them or if they feel they are using malicious practices. All report requests are fed in a separate table, to which, a support team member can deal with.

• New Support Request: This command is used to get support requests from the user which are then fed in a separate table, and have corresponding payload data about various parameters required to deal with a support request with relevant information.

• Update User Image: This command is triggered by a webhook from Clerk, when a user updates his/her profile image from the front end, and a database query runs that updates the information in the database with the new image's URL.

Collectively, they work with each other and provide a smooth flow of data from the database and the user, while maintaining a smooth session at the client side.

Outerbase Plugins:

The support request architecture workflow is designed in such a way that it is of utter importance to the developer, as well as being capable of providing clear status to the user about their raised tickets.

The user can visit the support page from within the app, and fill out the form based on the type of request they would like to raise:

Once the user submits their request, they receive the following confirmation email, acting as an acknowledgement of their request:

The internal support team receives the following email in realtime indicating about the opening of a new support request on the platform:

To have an overview of the pending and completed, the support team or admin can navigate to the Outerbase dashboard and apply the Support Ticket View plugin over the table:

They get a straightforward, minimal and clean overview of what is already done, and what has to be done, making this a clear and easy process of support resolution.

Thus, the Outerbase plugin environment has made support resolution on Gemino a breeze and has proven to be a super easy way to handle requests.

Code, Demo & Deployment:

You can access the repository for Gemino at https://github.com/ishaanbedi/gemino.

You can access the live deployment at https://gemino.ishn.codes/

Here's a live demo video of the project:

Here are the demo credentials, in case you don't wish to create an account yet:
Username: gemino_demo

Password: gemino_demo

I request fellow readers to not change the password or associated email with the demo credentials.

I will have a look at the demo account from time to time to make sure nothing is being compromised and they map as specified above.

And this was Gemino, my presentation for the Outerbase + Hashnode Basejam. It was so much fun throughout the month coding this amazing piece of tech, and learning so many new things and technologies.

Thankful to Hashnode for bringing up such an amazing event, and super thankful to the amazing people at Outerbase who supported all the participants throughout the event and helped us in every way possible, round the clock.

Again,

GitHub Link: https://github.com/ishaanbedi/gemino

Deployment Link: https://gemino.ishn.codes/

Thank you for reading this far!

#Outerbase #OuterbaseHackathon