Inspiration
The main problem we saw in built-in tools like Screen Time and Digital Wellbeing dashboards were that they were too passive – they present data but don’t do much to inspire meaningful change from the user. From our own experiences and friends, including students who with otherwise healthy routines, we found that these tools were rarely checked and often ignored even when their results were concerning. The idea was also inspired by Genshin Impact’s Paimon, an ever-present NPC who guides the user through tasks and adventures which is why she is used in our prototype. Extensions for digital pets already exist but they simply just do that–exist on the screen; they aren’t used to promote health and wellness. That’s why we saw an opportunity for these digital friends to do more, and thus Moti was created.
What it does
The app's character would encourage breaks along with other healthy activities and reminders like journaling, drinking water, exercising, goal setting, and sleeping. We hope that over time this would allow the user to build healthy habits leading to less stress, digital burnout, and other side effects of the online world. Since this app is so customizable and user-oriented with how often the user wants reminders, when they are feeling the most stressed, and what their goals are, it can fit to a diverse set of lifestyles. We believe that Moti has a lot of potential in creating a tool to help anyone looking to build healthier digital habits.
How we built it
This prototype is built entirely on Figma. For the UI we looked to other app interfaces for inspiration. We compiled a few and picked the ones we liked to incorporate our own layouts, color palettes, and designs. Then we used Figma's tools to wireframe our designs in a way that made sense. For example, the "x" at the top right would allow the user to exit out a page and return to the Home Screen, there's buttons at the bottom of the screen to let the user jump to the journal or home, clicking on the extension would take you to the app.
Challenges we ran into
We were all beginners and were largely unfamiliar with Figma. Our biggest challenges were the learning curve and the short amount of time for us to put together a UIUX design. One of us was also in LA so we communicated over calls and messages. Luckily, we worked together pretty seamlessly.
Accomplishments that we're proud of
I'm proud of learning how to create a scroll bar, a mesh gradient, a slider, and a counter. Kaitlyn is proud of her icon designs, making a smiley face that nods, and her UI composition. Grace is proud of her dropdown menu, an interactive jar of balls that dispenses a quote, and her add column button for the agenda tool.
What we learned
We learned how to use figma more effectively with assets such as a counter and drop down menu, the importance of spacing and centering, building an app around a specific target audience, how to utilize shapes to create our own objects, and color theory. All of these are significant in consistency for theme, which in our case was a friendly and wellness app. This influenced all our decisions from color shades to font sizes and shades to visual design.
What's next for Moti
We believe Moti to be a powerful and much needed tool especially in an ever-evolving world where people are becoming more reliant on technology. Technology is wonderful; it is because of the tools we have we are able to create this app prototype to help others, but it can also be harmful when overused. We hope to build more tools such as breathing exercises and guided meditation to allow for deeper customization, allowing users to shape their wellness journey even further. Progress tracking is also another feature that we plan to implement so that the user can celebrate their wins.
Built With
- figma
- lovable
Log in or sign up for Devpost to join the conversation.