-
-
Home page
-
Expected Chat UI (Translation and Grammar fix)
-
Current Chat
-
Updates Message with input (J is me and R is a different person who has signed up)
-
Profile Page, This is when user is logged in, you can see the header has changed by the token
-
registering account (Invalid email case due to regex)
-
User forgotton his username/password
Inspiration
With international travel being shut down and borders being closed there has been unscratchable itches to travel throughout society. To help scratch that itch, we were thinking of ways to help promote inclusivity in society by facilitating cultural exchange and language learning. We were inspired by spontaneous group interactions between international students at university, the idea of Omegle and the auto-translate and grammar correction features in 1-on-1 language learning applications like HelloTalk.
What it does
CrossChat was planned to provide 1-on-1 conversation or group chat of 4 people, cross-matching them based on the languages they are confident in and interested in. The communication will be through real-time text chat. They would be able to randomise the set conversation topic in the app, auto-translate (with Google translate) others' messages, and point out grammar corrections (also using a third party API). There would be a feature that allows users to report inappropriate behaviour.
How we built it
We designed the UI in figma, developed with React.js, and using multiple libraries, and the firestore API.
Challenges we ran into
Time management: we spent too much time tweaking the design and fixing visual bugs.
Accomplishments that we're proud of
The design turned out better than expected! The Earth and clouds animation on the home page was done without JS, in plain CSS and HTML.
What we learned
To better plan our time in tackling projects next time with more focus on project management.
What's next for CrossChat
We plan to fully implement planned features (Translation and Fix Grammar for other person) and add video or voice chat options since having spoken conversations is crucial when it comes to learning a new language.
First, the user will be needed to log in to join the chat.
Log in or sign up for Devpost to join the conversation.