Our client was passionate about creating an app that would work with the company’s smart wristband. The smart wristband collects all available metrics, from sleep quality and stress levels to blood oxygen levels and ECG. In general, the application needed to be simple and easy to navigate and motivate people to take care of their health and use it daily.
After getting the brief from the client, we immediately understood the idea of the project. We realized this project should be successful because we already have experience developing healthcare applications. We delved deeper into the product with a SWOT analysis to understand the problems users have in this area. We conducted a business analysis to determine what kind of functionality the user needs.
Before starting the design, we always conduct solid research to dive deeper into the project and find solutions to the problems. We analyzed the client’s best competitors in the healthcare space with a SWOT analysis. We brought in a business analyst to find the best way to implement features correctly and bring profit to the product.
A SWOT analysis is a strategic planning tool that helps your project find the best solutions and overcome challenges. We consider each competitor’s strengths, weaknesses, opportunities, and threats. It helps us determine which features are worth including in our application and which are better left out or refined.
We took four of the best direct competitors in the healthcare space to study. When studying the competitors, we took into account not only the presence of certain features but, in general, how convenient it is to use the application, how it complies with modern principles of creating mobile applications, and the company’s overall market position. As a result of the analysis, we identified a list of key features that are worth implementing in the Healher:
At the business analysis stage, we choose the optimal solution, prepare requirements, assess which functionality is most important for the customer, and prepare and approve documentation. This documentation allows you to minimize development costs because everything is already considered and detailed. Developers only have to create the product according to the documentation and do not have to invent anything. Also, business analysis allows you to accurately estimate the development budget, which helps plan the company’s budget.
Our business analyst created a detailed list of features by writing a user story for each feature. To create this document, we use the key findings from the research and the input data from the customer. We used the ICE framework to prioritize the features because it’s great for startup projects. Using the ICE framework, we have planned future releases of the application; now, the client can freely plan further project budgeting.
Once we have decided on all the functionality, we need to visualize the application’s architecture, which helped us organize the information, create a roadmap for future development, understand what screens we need to develop, and scope the work exactly. As a result, we came up with six main flows. This map also helped us determine what to do in subsequent phases of the project.
In the user flow phase, we visualize the sequence of actions that the user performs to achieve his goals when using the application. We do this by asking questions about the action and giving options for positive and negative scenarios where the user can go as he performs the action and achieves his goal. User flow helps us identify hidden moments that we may not think about at first glance when developing an idea. If you forget about User Flow, you may have problems in the product development phase.
In addition, we use User Flow to agree with the customer on scenarios for operating the product or functionality.
Once we have a solid analytical foundation, we can turn it into a user-friendly interface. At this stage, we have to decide what the interface will look like, where this or that element will be located, create a clickable prototype, and find the style in which the design will be created.
A wireframe is a rough sketch of the structure of a product. It allows you to quickly get an idea of how things will work, and it doesn’t take much time to design. We use wireframes first to save time and money. At the same time, we usually create a clickable prototype to do some user testing because users often think differently than we would like them to. After that, we fixed some of the features and went to the moodboard stage.
To determine the visual direction and style of the interface, our team creates moodboards and coordinates them with the client. This allows us to choose the most appropriate solution before moving on to the UI.
Based on the approved moodboard, we create the first visual concept of the application to demonstrate the chosen style in real conditions before creating the final UI design for all screens.
When designing the UI, we always create a set of styles for colors and typography. We use design tokens to name the styles. This helps designers to speak the same language as engineers. We also create components for common elements to use their instances and modify instances a bit. At the same time, we collect all the styles and components in the UI Kit – a collection of assets that contain a set of design elements. It not only helps to systematize design elements, but it is also necessary for front-end development. This approach simplifies work on the project and saves design and development time.
As a result, the design is modern and fresh. There is no visual overload. Everything looks simple. We used emojis as graphic elements, and they added freshness and curiosity. We developed a dark theme according to the modern rules of mobile development.
Healher is committed to using the latest technology. The company has developed a smart wristband that knows everything about the user. It collects all available metrics, from sleep quality and stress levels to blood oxygen levels and ECG, etc. The device is offered to connect to the application immediately after the survey. All metrics are always available on the Your Metrics screen. If any metric is out of the norm, the user is notified and advised to take action, such as 'see a doctor'.
The app creates an individual activity plan for each day. To create a plan, the user is prompted to take a survey. Based on the survey results, the user is offered 3 plans to choose from. The user can either select the entire plan or individual recommendations that suit them personally, thereby customizing the plan. The current plan is presented as a to-do list pinned to the home page. This allows the user to see their daily progress. In addition, the user can add new activities to the plan from the library.
The user needs to know his success and progress according to the plan, and his motivation depends on it. That's why we have added statistics for each activity. So the user can easily compare his performance and understand which aspect is worth more attention.
Whether it is a workout or a cooking recipe, the user is prompted to watch a video. In addition to the video, there is always a text description on the activity screen in case the user is offline and doesn't have time to download the video.
In the next release, we will implement the possibility of holding online sessions with coaches, psychologists, psychotherapists, nutritionists, etc. A person needs to have live communication. And with the help of direct communication with specialists, the user can explore himself more deeply. Providing free support to a person in a crisis situation is also very important.
Many people need to stay in touch and be part of a community. Communities are also where people learn new things and share information with other people. That's why we're adding chat functionality in the next release. Users can find the chat they are looking for using search and tags. To avoid flooding the chat, every user will have to be verified before joining.
In the next release, we will implement another way to motivate users - the achievement system. We will create a collection of rewards with original illustrations using a mascot. The illustrations should be unusual and memorable, so the user is constantly interested in discovering new ones.