Hello there! 🙂
In the previous article (link), I discussed our research process for improving the user experience of individuals with mental disorders. In this article, I’ll be delving deeper into how we developed the application, and the design process we used.
After defining the value proposition and creating a storyboard to better visualize the process we wanted to implement, we moved on to the next step: creating navigation and user flows.
To begin, using the Whimsical platform to design a tasks flow, we created a task flow that allows users to log their current mood within the app. Next, we created another additional user flow enabling users to easily request a medical appointment.
We then created a workflow that illustrates the process from the user’s first access to the application to the moment he arrives at the main page.
Next, we proceeded to create the information architecture for the application. Working together as a team, we thoroughly analyzed all the features we wished to include in the app and arranged these elements according to the structure we had imagined for the product.
After establishing the structure and flows, we progressed to the visual inspiration stage, which was then followed by selecting a name and logo for the project. Each team member created their own individual moodboard to determine the best visual direction for the app, and ultimately we reached a consensus on the desired presentation of the interfaces.
As you may have observed, we had already selected the name “SoulGood” for our application some time ago, which was derived from the expression “So Far So Good”, which was inspired by the desire to help people who had lost their way and wanted to achieve happiness with a light and positive attitude. After that, we devoted our attention to designing the logo and deciding on the most effective way to showcase the app’s name. Below the final results.
When choosing the colors, we considered the overall message that we wanted to convey to the users. We selected purple as the primary color because it is associated with calm, respect, and wisdom. The color encourages reflection, transformation, and spirituality, which align with the values we aim to promote through our app. In addition, we chose orange as it conveys sociability, joy, and motivation.
Below a bit of our Style Guide.
Prior to creating the wireframes, we began by making some sketches to guide us in the process of developing the wireframes.
As our project featured a voice assistant, we had to develop a voice interface. At this stage, the group was divided into two teams, with two people working on the voice interface and the other two focused on wireframe development.
Renara Luiza and I were responsible for developing a voice assistant, which we achieved with the help of VoiceFlow. Although we had no prior experience with the tool, we invested time in learning it and were able to successfully create “Soul”, the voice assistant for SoulGood. It was a challenging process, but we managed to master it with skill.
After creating the voice assistant, we rejoined the rest of the team to complete the wireframes.
After that, we proceeded to finalize the interfaces and moved onto prototyping.
4.Prototype
We start with an animated welcome screen (splash screen), then we present a login screen, and then we continue with the user introduction process (onboarding).
Next, the user would be prompted to answer a series of questions in order to customize the application to their specific needs.
If desired, the application could be connected to a voice-enabled device.
Following this, the user will be directed to the homepage, where they will find expert-customized activities.They can also record their mood daily and contact a mental health specialist for assistance.
In addition to using the application in a conventional way, the user would be accompanied by a virtual assistant, who would suggest activities throughout the day and would be a company for anyone who needed to talk. In more critical situations, the assistant would refer the user to a specialist in psychology or psychiatry.
5. Test
We conducted a validation test on our application with five users, which provided us with valuable feedback on its strengths and areas for improvement. While all five users were excited about the virtual assistant feature, they found it difficult to locate and activate within the application. They struggled to understand the purpose of the button and they were not aware that calling the assistant would activate it.
To enhance the usability of the application, we recognized the importance of making the virtual assistant more accessible and intuitive for users. We plan to work on improving the functionality of the assistant and ensuring that users can easily locate and activate it. We are grateful to the users who participated in the testing process and are committed to enhancing their experience with our application.
From this point on, each member of the group proceeded to work on their own to improve the application according to their own vision and ideas.
By using the Design Thinking methodology, we gained a deeper understanding of individuals coping with mental health challenges, and subsequently to develop an application to assist them in conquering their fears and finding avenues to feel more socially connected. Moreover, we hope to challenge the stigmas imposed by society surrounding mental health through our work.
Thank you to follow me until here! See you! 🙂
Maurin Z Curupana — UX/UI Design Studient
Read the full article here