ChitChatChampion

ChitChatChampion aims to facilitate engaging ice-breaker games and conversation starters for various social settings, with a focus on customisation and user interaction. Its objectives include fostering connections, breaking the ice, and making social gatherings more enjoyable through tailored ice-breaker activities. They are meant to be played in-person, with a phone or laptop as a companion to the activity.

URL: ChitChatChampion

Group Members and Contribution

A0234693X

Name: Izz Hafeez Bin Zek Hazley
Role: Frontend Engineer
Contributions:

  • Set up Vue project components
  • Set up Google authentication and client-side caching
  • Design and engineer the Bingo game
  • Engineer the CSC and BB games
  • Integration
  • Product logo & themes
  • Styling
  • Set up SEO
  • Report (first draft)

A0244120Y

Name: Jason Christopher
Role: Frontend Designer
Contributions:

  • Design UI on Figma
  • Set up Tailwind CSS styling
  • Frontend design for CSC and BB
  • Product hunt
  • Google analytics
  • Landing page

A0164584W

Name: Kevin Chua Kian Chun
Role: Backend Engineer
Contributions:

  • Implement websockets for game modes
  • Initial backend setup
  • CSC Backend routes
  • Prompt engineering
  • Migration from Flask to Quart

A0221849Y

Name: Neo Jing Xuan
Role: Integration
Contributions:

  • Database schema design, setup and integration
  • BB, Bingo Backend routes
  • Prompt engineering
  • Report
  • Product Name

Project setup

Package installation

npm install

Compiles and hot-reloads for development

npm run serve

Environment Variables

VUE_APP_BASE_URL: For the server.

Set up backend

Head to our server and clone the repo. Then, follow the instructions on the README.

Resources Used

Frontend

  • JavaScript
  • Vue.js
  • Google OAuth
  • Tailwind CSS
  • Fontawesome
  • Primevue
  • Sweetalert
  • Axios

Backend

  • Python
  • Quart.py
  • Motor
  • MongoDB