We wanted to create an interactive game that could represent different cultures and diversities by educating players with other languages and encouraging active engagement with learning.
What it does
Each individual player, located anywhere in the world, can access the webapp and be presented with an image and a word. The image is a prompt that can be found in all cultures or countries, from prompts such as Family and Smile to objects like Fruit or Car. Along with this randomly chosen image, a translation of the word is given.
The key part of the program is that each image comes from another player, and each word is in the official language of the country that the image was taken in. This way, players can exchange cultures with other players and learn new words in other languages.
How we built it
Our web app uses Node.js, React, and Gatsby.js for the frontend. The backend uses Node.js, Express.js, and MongoDB for the database. We implemented AWS S3 and AWS EC2 to host the server, and we used Amazon Rekognition to identify user-submitted photos through machine learning and match them across the database with specified parameters.
Challenges we ran into
One of the biggest challenges we ran into was auto-deploying our server API for front-end to work on. We tried to incorporated AWS CodeDeploy with Lambda and EC2. However, after a couple of hours, we still couldn't set up the permissions and keys. We concluded that for prototyping, we don't need to have a complex setup. We solved this problem by settling for manual code deploying on an EC2 Linux Machine.
Accomplishments that we're proud of
We are proud of challenging ourselves to use new services, such as AWS S3, AWS EC2, and Amazon Rekognition.
What we learned
We learned a lot about error handling in APIs, deploying node servers, using Amazon Web Services, and implementing NoSQL databases.
What's next for Picture The World
We hope this game can inspire players to make the choice to learn a new language or remind them to open their minds to other cultures.