Team Syntax SquadpresentFrame of Mind
Frame of Mind Demo Video
Express your creativity a little bit every day
Frame of Mind is a creative storytelling app that helps users to express their emotions through art. Users can draw solo or collaborate with others around the world to create comics made up of 8 panels, with each user contributing one panel. Once comics are completed, users can share their comics in the community hub, get inspiration from others' work and support each other. Through a streak-based system, users are motivated to return each day, and in the future we hope to implement a virtual art studio where users can purchase items with their points.
We created this app with the hope that 5 mins of creativity each day and the collaboration with others, will help to boost users’ mental well-being.
The Team
Holly Skinner
Kyle Noad
Harrie Teague
Thomai Christopoulou
Beau Vincent
Scott Girling
Technologies
We used: JavaScript, Firebase, React, Next.js, Rough.js, MUI, Figma, Phosphoricons, Perfect Freehand, PrimeReact Colour Picker, Random Word Slugs
We used Firebase for our backend as it allowed us to handle authentication, database management and notification handling.
In the frontend, we chose to use React and Next.js so that our app was compatible with web and phone usage. Next.js allowed us to optimise our file structure and streamline routing for a better UX.
Rough.js, Perfect Freehand and PrimeReact Colour Picker were used collectively to build our canvas functionality and were easily integrated to allow the smooth-running of our canvas feature.
Figma was used for designing the app wireframes and visualise our designs more professionally. MUI and Phosphoricons were utilised to maintain a consistent theme across the app and enable easy user navigation.
Challenges Faced
Whilst we met our MVP, we would have liked to implement our Virtual Art Studio as an added layer to the user rewards, and encourage users to engage across the app daily. As Firebase was a completely new technology, this presented a steep learning curve, especially in terms of the user authentication process, however this was implemented in the final product.
FAQs
Are there any other features you would add if you had more time?
As well as the Virtual Art Studio where users would purchase items with their points, we would also like to enable users to add other users as friends and speak in a chatroom (something we built in our spiking process). We also discussed the optionality of users to add audio to their comics and be able to download their comics to their devices.