thaiwordgame

blog-patterns

Let’s RECAP!

Motivation:

The Thai Word Game app was born out of a personal motivation to create an interactive and engaging web app that would help my daughter learn daily Thai words and phrases while fostering a connection with her Thai heritage and family in Thailand. As a parent, I wanted to provide her with a fun and educational experience to facilitate language learning and strengthen our bond and cultural identity.

Technical Details:

Language and Framework:

I chose JavaScript as the primary language for the app’s front-end and back-end development. The UI was built with React and TypeScript, while Express.js powered the back-end. For database operations, I utilized the Knex query builder and initially employed SQLite for the development environment, with plans to transition to PostgreSQL for the production environment. User authentication will be implemented to ensure privacy and create personalized experiences tailored to each child’s learning journey.

User Experience Design:

To create a delightful experience for my daughter and other young learners, I followed the Google UX/UI process. I began by defining a problem statement, creating user personas, and developing wireframes to visualize the app’s interface. This process allowed me to iterate and refine the design based on the needs of children and parents.

Content Creation:

Drawing on extensive research, I curated a comprehensive database of commonly used Thai words and phrases suitable for young learners. Audio recordings accompanied each word to provide accurate pronunciation guidance, while visual representations were created to aid in word recognition. Recognizing that children often respond better to their parents’ voices, I use my voice to add a personal touch to the learning experience.

Gamification:

I incorporated gamification elements into the app to make language learning engaging and motivating. Children could track their progress and word count, earning rewards and unlocking achievements as they advanced their language skills. These features encouraged a sense of accomplishment and motivated continuous learning.

Progression:

From the initial concept to the final product, the project followed a clear progression:

  1. Planning and Ideation: The project began with a strong desire to create an app to facilitate language learning for my daughter. I defined the project’s objectives, identified the target audience, and determined the core features to support their learning journey. Wireframes and low-fidelity prototypes were created to visualize the user interface and establish the app’s structure.

  2. Development: The development process involved building various components and views, integrating audio and visual content, and implementing gamification features. I followed an iterative approach, regularly testing and incorporating user feedback to refine the app’s functionality and user experience.

Here’s a series of blog posts detailed behind-the-scenes of the development process, filled with challenges, triumphs, and everything in between!

  1. The beginning

  2. Breaking down work

  3. Setting up audio storage on AWS

  4. Utilizing Pattern

  5. Restructure my container and components