Social Interaction Simulator Game for 2024 SCU Hack for Humanity

Inspiration

Many children face challenges in developing social skills which are crucial for personal growth and success, especially after the pandemic. We wanted to create a fun and interactive way for children to practice these skills in a safe environment, where they can learn from their mistakes without the fear of rejection, gaining confidence for their interactions with real people. Additionally, the low-stakes environment assists those who are not fluent in English understand the linguistic nuances without fear of judgement. Overall, our goal is provide a new resource for parents, care providers, and anyone else who wishes to improve their verbal communication ability.

What it Does

Social Sim is a game with whimsical characters that encourages users to chat! We accomplish this by providing the user with a unique prompt generated by the OpenAI API, then having a short conversation with them based on their responses. After the end of the conversation, the program uses the messages sent by the user to grade how well they performed in the conversation, and provides them suggestions if anything they said during the conversation came off as strange or offsetting.

How We Built It

The foundation of our product is the OpenAI API. Using this, we are able to create unlock seemingly infinite conversation options, with each line of dialogue being remembered to invoke a fluid sense of discussion. Additionally, we made an express.js server to host our node.js, hmtl, and css based web app, with the phaser.js game engine and javascript on the backend to manage the flow of data and appropriately utilize the API calls.

Challenges

While creating Social Sim, we struggled with version control and learning new JavaScript concepts such as promises and async/await. None of us had much JavaScript experience coming in, so we had to learn on the fly through trial and error. Another aspect we struggled with was the layout and design of the game UI. We had to strike a balance between spending time on frontend elements, like the chat box and animations, and making sure the backend worked properly.

Accomplishments

  • Integrated OpenAI API backend with Phaser game engine frontend
  • Created grading system for user's responses, and provide them with suggestions
  • Utilized Phaser's UI elements and animations to create a smooth user experience

What We Learned

All of us working on the project learned a lot about how to use git and got a decent grasp of how JavaScript works, especially the asynchronous aspects of the language. We also learned how to split up tasks between frontend and backend so that we could collaborate more efficiently, which most of us were not familiar with before the event. The division of tasks also resulted in much cleaner and more manageable code, which is a good paradigm to follow for future endeavors. Finally, we learned about the development of a text-based game with menus, sprites, and a specific visual style.

What's Next for Social Sim

Going forward, we would like to add more levels to the game to train users to tackle more complex conversations about deeper topics. Other than additional features, we also aspire to modify our backend to be more scalable and ship the product.

Share this project:

Updates