Inspiration

As a group, we wanted to focus on the mental health and well-being of our fellow students. The real inspiration came from the pun, “seal of approval”, as we approved our idea for an affirmation project.

What it does

Seally is a collective memory project that provides a safe space for better mental health where you can write and receive affirmations or jokes. Self-care is an important part of mental health, taking time to affirm yourself and laugh can make a big difference!

How we built it

Our design process started with brainstorming, where we wanted to do a collective memory project related to self-care and affirmations for better mental health. Next, we worked on user research, where we conducted a few user interviews where we got to better understand the user and their experience with affirmations and self-care. After the user research, we ideated and sketched out what the interface could look like. From there, we worked on translating that into Figma as low-fidelity and mid-fidelity prototypes. After that, we conducted a usability test on the mid-fidelity prototype on Figma, where we observed the participant completing tasks. From those observations, we pinpointed some pain points that we later fixed in the coded version of the website. While we ran the usability tests, the other members started coding the front-end code for the website using GitHub. We stored the form data and user input data in back4app using JavaScript. All three of us shared tasks from making graphics, and layout through CSS and functionality through js.

Challenges we ran into

Throughout the project, we faced multiple challenges that we spent time overcoming. To begin with the background gradient with the bubble animation needed jquery to work the way we wanted and this took extended research and learning how to use jquery. As we worked on the same repository, merge conflicts became a frenemy and messed with our code when we pushed and pulled but we learned to dissolve and prevent them. We also had some difficulty working with back4app and enabling it to push form information to and from the website. We ended up spending a bit of extra time working with back4app to get it set up.

Accomplishments that we're proud of

Our main accomplishment is successfully executing the idea we had and working through all the challenges we ran into within the time constraint. Another accomplishment was figuring out the animations for the bubbles. The bubble animations took a lot of time and learning code we were previously unfamiliar with, but it was a big accomplishment to have completed in the end.

What we learned

We learned a lot about working as a team on a web project simultaneously. We learned about delegation of work in order to make the overall process run smoothly even though we still ran into a few hiccups here and there, especially with GitHub collaboration. In the end, we found a good workflow that we could all be productive with at the same time, which was very helpful with the given time constraints of the project. Overall, this project taught us a lot about working as a team and increased our teamwork and communication skills.

What's next for Seally

In future iterations, we hope to add more interactive elements to the bubbles with the seals with them. We also would run more usability tests on the current iteration of the coded website in order to gain a better understanding of the user and catch any pain points the website currently has. We also would like to add login information and features so that the users can see the affirmations and jokes they themselves have submitted. We would further like to add a celebrative feedback display for when you receive a joke or an affirmation. Based on user research, we also hope to add the ability to sign up to receive emails or text messages on random days containing the affirmations or jokes they’ve written to themselves.

Built With

Share this project:

Updates