MedicAlert Foundation® is a non-profit, charitable, and membership-based organization dedicated to the well being of others. Founded in 1956 by Dr. Marion and Chrissie Collins, the foundation’s mission is to protect and save lives by serving as the global information link between members and emergency responders during medical emergencies and other times of need.


Based on the research found in the discovery period of the project a persona was developed, Mark Webber. Designing for Mark helped in making informed design decisions as I had the end user always in mind.

Persona Overview

Problem & Constraints

  • Management of hundreds to thousands of employees of an organisation.
  • On time renewal of services – a herculean task
  • Need for a portal that could also help increase renewal rate
  • Need for an intuitive user management portal for it’s partner users


User Workflows

Keeping Mark in mind, we mapped his user behavioral flow. Understanding his decision making and the tasks he performs allowed us to brainstorm the necessary features and opportunities required for Mark to successfully navigate through the application.



Sketches and Wireframes

Paper prototyping technique allowed us to create and test user interfaces quickly and cheaply. Since it is easier to change a prototype than the final design, this was great help for MedicAlert as there is so much data.

A wireframe is a two-dimensional illustration of a page’s interface that specifically focuses on space allocation and prioritisation of content, functionalities available, and intended behaviours.

For these reasons, wireframes typically do not include any styling, colour, or graphics. Wireframes were made to establish relationships between a website’s various page templates.



High-fidelity Designs

People use products, not wireframes. When someone looks at a low-fidelity wireframe, they have to imagine what the product will look like when it’s done. This active imagination may end up taking part of their attention away from the task they’re trying to do.

With high-fidelity wireframes, client was better able to see how their layout, navigation, buttons and form elements were coming together because they were not primitive elements.