MyCMH
A website and mobile app designed for kids to experience Museum activities at home.
Background
What is MyCMH?
The goal of the MyCMH project is to create a website and native app for kids to watch videos, personalize playlists and access their favorites on the go. During the COVID-19 pandemic, the Children’s Museum Houston began creating more content for kids to access at home to help them stay engaged and connected.
What makes MyCMH unique?
MyCMH is designed for personalization. Every child is able to create their own profiles and customize their profiles to suit their needs. The website and app are designed using Mendix, a low-code app development software.
Roles & Responsibilities
Designed a prototype of the native app using Figma. Work with software engineers at Phillips66 and Mendix to develop the back-end of the website/native app. Build the user interface using front-end development softwares, Microsoft Visual Studio Code and Calypso.
Problem
During the COVID-19 Pandemic, the Children’s Museum Houston needed a way to reach children in the Houston community. Although they created videos on YouTube, they needed a way to reach families directly.
Proposed Solution: Develop a website that provides a personalized experience for children and parents. The website will not only allow them to watch videos, but it will allow them to save their favorites and create playlists.
Research
To better understand a child’s perspective, I researched websites and apps commonly used by children to watch videos. YouTube, PBSKids, and National Geographic kids are the top websites that have a good design. Using those sites, I chose the most user-friendly elements and implemented them into my prototype.
Prototype
Using Figma, I designed a prototype of how the MyCMH app would function from a user’s perspective. There are key design elements I emphasized throughout the prototype. Since this app is designed for children, it was important we used more visual elements because our primary audience are children under 15 years old and their parents. Kids should be able to browse the app without knowing how to read.
Development
Mendix Studio Pro is used primarily for the back-end web development of MyCMH. It contains the web and native app pages and the microflows/nanoflows with logic. To design the front-end, I used Visual Studio Code to edit the HTML, CSS, Sass, and Javascript. A problem I faced while developing MyCMH is that I couldn’t create complex microflows and nanoflows since they required knowledge in software development, something I did not study. I connected with employees from Phillips66 to help me in developing the microflows. Since the native app doesn’t have the capabilities to process microflows, I worked with a software engineer at Mendix to help me construct nanoflows for the native app. The website is now live, while the native app is in its final development stage.
User Testing
Before MyCMH is released for public use, it was important for the educators to access the website first to upload their videos. I created a user guide to assist educators through their uploading process. They also served as our in-house testers.
In the following weeks, I contacted children who volunteered during the initial phase of our project. I also contacted parents who are a part of the museum’s Kids Committee to assist in user testing. All tests were conducted through Zoom with parental consent to record the session. Their feedback helped me pinpoint features that needed fixing.
Conclusion
As of September 2021, the website is officially launched and open to the public. The native app is still developing with the assistance of an external development company.
Final Thoughts
This project is my first professional experience designing a native mobile app. One of the major challenges I faced was creating microflows and nanoflows within Mendix. Mendix provides a powerful tool for creating websites and native apps, however, I don’t have much background experience in coding and back-end development. I learned Mendix during the first couple of weeks when I started this position. It was important that I stay in contact with software engineers to help me in the challenges I faced.
