ColourMash

Pattern Therapy for Alzheimers and Dementia Patients

Comment

Inspiration

One of our team members has a grandmother with Alzheimer's. He noticed that color-based therapy and pattern recognition exercises could help trigger memories and improve cognitive function. This inspired us to create a game that makes memory training fun and engaging for people with Alzheimer's and dementia.

What it does

ColourMash is an interactive memory game that helps users practice pattern recognition. Players follow sequences of colors that flash on the screen and then replicate the sequence using physical cards detected through their device's camera. The app tracks progress, provides immediate feedback, and encourages users to continue practicing to strengthen memory and cognitive skills.

How we built it

We built ColourMash using Next.js and React for the frontend, with TypeScript ensuring type safety. The game leverages the Web Camera API to detect colors in real time and the Canvas API to process image data for color recognition. State management and game logic are handled through React hooks (useState, useEffect, useRef) to keep the gameplay smooth and responsive.

Challenges we ran into

One of the main challenges was implementing the webcam functionality reliably across different devices and browsers. Additionally, creating a unique and engaging visual design that balances simplicity with accessibility was challenging. Ensuring that the game logic, camera input, and visual feedback all synced properly also required careful planning and testing.

Accomplishments that we're proud of

We successfully implemented the webcam integration and built the core game logic, allowing users to play the memory sequence game interactively. The combination of camera detection and color sequence logic was a key achievement, making the game feel responsive and engaging.

What we learned

We gained valuable experience programming as a team and tackling real-world problems using JavaScript and TypeScript. We also learned how to integrate device hardware (camera) with web applications and how to structure interactive, responsive frontend applications with React.

What's next for ColourMash

In future updates, we plan to implement AI-driven feedback to provide personalized advice and guidance for users. We also aim to introduce new game modes to keep the experience engaging and help users practice different cognitive skills in novel ways.

Built With

Share this project:

Updates