LocalChat

Choose a language
Choose a topic
Enter LocalChat
Example ChatBot Window

Inspiration

As an international student from China, when I first started chatting with my new friends here on social media like Instagram or TikTok, sometimes I found it hard to understand what my friends were talking about. For example, when he was saying "ngl" or "lwk", I had no idea what these things stood for. Under these circumstances, my team was inspired to make our foreign language study website, LocalChat, to teach non-native speakers to express themselves in a natural and accurate way while also understanding the meaning of the other party.

What it does

LocalChat allows you to learn foreign languages under the setting that you wanted. Our current version provides English, Chinese, and Japanese to choose from, and uses English as the default language. When a user wants to learn a certain language, they can customize the topic and person they are talking with. For example, if I'm an English speaker and want to learn Chinese, I can customize LocalChat as a Chinese college student, and I can also set the background as talking about a college club application. After finishing the settings, you can start typing in either the language you speak or the language you choose. LocalChat will answer you in both languages and provide personalized feedback on the message you sent.

How we built it

We built the frontend with React, JavaScript, and Vite, using Codex to help us prototype and iterate. We built the chat functionality with Node.js and the Gemini API, and used ChatBotify for the chat interface.

Challenges we ran into

We went through numerous documentations and websites related to chatbot components in React. Eventually, we utilized Chatbotify as our chatbot component. However, simply using Chatbotify is not enough because we also want to integrate Gemini AI into our chatbot. Then, we incorporated the LLMConnector plugin to do that. We spent some time connecting documentations from these plugins to let all plugins work as expected, and it did create some challenges when putting all components together.

Accomplishments that we're proud of

By integrating Gemini API into language learning, LocalChat helps learners better understand other cultures and languages. We hope that this could bring people and cultures around the world closer together.

What we learned

We learned about methods of integrating API and multiple components/plugins. We also learned about modifying LLM prompt to improve its response accuracy.

What's next for LocalChat

We plan to support more languages and improve how the AI adapts to different conversation settings and proficiency levels. We also want to create personalized learning paths that help users build confidence over time. Finally, we hope to deploy LocalChat publicly so people can use it beyond the hackathon.