Inspiration

Everyone struggles with self-care. Whether it's defining what it means to you or balancing it with increasingly long to-do lists. We wanted to create an app that can support anyone through the process of self-care, and specifically people with mental health conditions.

We understand first hand the impact that self-care can have on our mental health and vice versa. We wanted to create something that could help end that cycle.

What it does

Zood is an awesome (and cute) app! It's designed to bring delight to the user and encourage them to focus on all the progress they are making. Users collect hearts for every self care card they complete, can team up with other users, and combat negative thoughts through games.

How we built it

The Zood app was first built fully as a single page web application, using React. Knowing we were attempting to hit a mobile target, we built the application mobile first.

Once the need for permanent storage capabilities became apparent, we expanded the shell Express server from a static content service into a backend application with full MVC capabilities, using SQL (MySQL in particular) for our storage medium.

There is no CSS pre-processor in the system (other than the minimal processing that WebPack provides with the css-loader), and no React component libraries were used, except for the map portion of the system, where a library called react-canvas was used in order to draw to the canvas that displays the map.

Once the application was stable, an Android wrapper was generated by wrapping the localhost application inside a WebView, with some integration code to ensure correct interaction with the underlying mobile system. Further integration would include payments, Google Play integration, etc.

Knowing the application was destined for mobile, the login/authentication system is designed around this, not requiring users to actually setup an account manually, but rather generating the user automatically based on an arbitrary code. This code would, in a production environment, be derived from the device or user account itself (either using the Google Play account, which is unique to the user account on the phone, or using identifiers on the device itself to generate a unique identifier). The security in this particular application would be improved upon if development continues, but the underlying principle of authentication would stay roughly the same.

Challenges we ran into

The initial stages of the project were a delicate balance between design and development. Because of the nature of a hackathon, and our amazingly speedy developer, we had to rapidly prototype and communicate designs and development bugs. We did run into some logistical issues with the daily card swipe (and some of those still persist).

We were able to user test our app a little and it was really insightful (as users usually are!) We realized that our initial point system for Zoodies didn't quite make sense and adjusted it. We also had to change the structure of certain screens, some onboarding, and edit the copy quite a bit. It was too late to change huge chunks of how the app is structured itself, but we did find (and fix) bugs in the code.

Accomplishments that we're proud of

  • Completing as much of the design as we did
  • Coming up with a powerful concept that can really make a difference
  • Animating the Zoods to bring delight to the user
  • The app sparks joy (even after 48 hours of Zoods)
  • Managing to have a user-test
  • Working together in a high-pressure environment successfu

What we learned

The entire process was realy enriching for us all and we’re so glad we were able to participate from California! We learned how to cooperate in a high pressure environment, how to communicate designs with minimal prototyping, and how to let go of having a perfect product and just have fun with it.

We conducted a usability test and that taught us a lot about our app. We found out that we had skipped several important frames which caused confusion for the user. We also found out that we had not explained certain components of the app in a way that was not confusing for the user to understand. We are proud that we were able to take in some of this feedback!

What's next for Zood - Your Self-Care Companion

Must Haves

  • Accessibility requirements
  • Screenreading / Narration User testing, User testing, User testing
  • Refine Care Cards system, introduce carousel and time
  • Standardize and refine design system
  • Conduct interviews Additional Features
  • Leaderboard, Co-op settings
  • Add more games (Reduce and Remember) are two games to help prioritize when feeling overwhelmed and to help people struggle to remember things
  • Add monetization and reward system
  • Integrate with Calm, Headspace, and Spotify
Share this project:

Updates

posted an update

Link to view the project:

https://levelup-2021-xinx.herokuapp.com/

Notes:

  • This application is meant for mobile view, and should be viewed in a browser that is roughly 400 pixels in width or less (https://developer.chrome.com/docs/devtools/device-mode/#viewport)
  • The heroku project may go to sleep if not used for long periods of time. This may cause the application to timeout on first load. Just reload the page and it should come up.
  • This application is tied to a free database (https://www.freesqldatabase.com/) that has extremely limited space. If you are noticing issues please leave a comment.

Log in or sign up for Devpost to join the conversation.