MyHealth is an IOS app under development by Simalam Inc. The app has for purpose implement a shift in processes for the traditional health industry. By bringing together health practitioners and patients under one platform, they can interact in real time for streamlining the process of booking appointments, validate user identities, share medical records, and manage the wide range of services and interactions between them.




My Role


In my role as interaction designer consultant for Simalam Inc. I was involved early on the planning stage by defining with the client, creative director, project manager, and lead developer the app’s core functionality, feature deployment phases, navigation flow, and architecture. 

I was sole responsible for crafting flowcharts for the team and creating wireframes for the whole IOS application (Patient facing) and web based application (Practitioner facing). This included complex UI systems like dashboards, instant messaging, authentication processes, etc.


sign up design pattern for Desktop


The challenge

One of the main challenges was to design two different interfaces that shared a common language for 2 fundamentally different types of users (Practitioners and Patients).

The unavoidable use of content-dense dashboards to display and manage patient information demanded extensive research of design patterns from different industries. In order to keep usability principles and ease of use at the centre of the experience, it was necessary to prioritize tasks according to user's needs and design a visual system that was scannable, easy to understand, and highly learnable.


traditional medical dashboards


the redesigned dashboard is easy to scan, understand and learn


The Process


As usual, my role on the project started attending user stories workshops were the client and each member of the team discuss together the app scope and in term of scenarios (User + Goal + Purpose). These served to prioritizing tasks, defining functionality, implementing schedules, crafting flowcharts, and more importantly, allowing an open channel of communication from the beginning to adjust everyone's expectations about the project outcomes and their impact on each step of the product development process.


flowcharts crafting


Paper, again, was the first step for iterating the possible navigation flows and rough screen layouts. It provided a common and inexpensive way to share knowledge with the team and stimulating the discussion during the first stages.

In order to better suit both ends of the experience, top task analysis were run with real practitioners and potential users. These findings shaped and established the UI goals and hierarchies for the mobile experience on patients and on desktop browsers for practitioners and receptionists.


Paper wireframes for brainstorming and FAST ITERATION


I was in charge of conduct a deep research on designing interfaces for handling such amount of live data. The result was to create effective layouts that were visually scannable, actionable and wisely grouped for displaying data in chunks that relate with the mental models have from previous experience with similar system like flight bookings, sortable lists, icon systems, calendars, etc.


practitioners' interface assist to deal with huge amounts of live actionable data


Likewise, we build on top of the user's knowledge by keeping UI system closely related with the native ecosystem (IOS) and its human interface guidelines.

Using Invision, I created an interactive prototype for gathering feedback from user testing workshops and stakeholders. Once approved by client, the final assets were delivered to an external agency which developed the style guide and branding parameters for the app.


Screenshots from a mobile interactive prototype


The Results


Once approved by client, the final assets were delivered to an external agency which developed the style guide and branding parameters for the app. The project is still on development stage and will be released by mid 2016. 


production-ready assets for style guide development