Sarjan Health is an AI-based application that solves patient problems remotely that had a problematic user interface.
They approached us because they needed a design face-lift to make their site more modern and fresh. Also, they needed to improve UX flow and site conversions.
Due to the above, we conceptualized the project and defined to create a rather fun and quirky experience, something that stood off a bit of the typical AI app.
Because of said conceptualization, we based the user experience on vivid colors and an abundant use of illustrations.
These illustrations added a fresh appearance.
But also improved conceptual communication for each element and direct users’ eyes to the desired elements.
Since the site is aimed at both individual users and corporate users, we created 2 versions.
Once the user arrives at the site, she chooses the version she needs.
After this, the user’s journey continues according to the selected path.
Finally, we developed a wizard user interface to discover what the user’s main need is. This way, we can define the best option for her problem in two main categories: knee pain and back pain.
At a later stage, the client implemented the design on the site using WordPress on top of Bootstrap
Design a new look that allows users to easily navigate the site.
Create user flows.
Create user interfaces to guide users and provide them with appropriate solutions based on their needs
User Flow / User Journey
Ad Hoc User Survey
InVision (interactive mockups for testing)
Homepage wireframe made on Sketch
User's demonstration of path selection
Examples of UI instructions to developer
UI instructions to developer
Design was made on 8pt vertical rhythm approach and 12 columns for Bootstrap
More UI instructions to developer using grids
Wizard main screen
Inner screen example
Wizard inner screen example
Another inner screen example
Sarjan's wizard final screen (negative option)
Sarjan's final wizard final screen (positive option)