Free quote

Design System for EHR

  • Industry: health care.
  • Product type: Design System for Electronic Health Record System (EHR).
  • Duration: 6 months.
  • Tools: Sketch, Zeplin, Confluence.

Delivery

  • — Sketch library
  • — Zeplin library
  • — DS description in Confluence

Meet the team

Project manager, 3 designers, 2 developers.

Our task was to make a truly complex product easy to understand. And also make the development process understandable and simple for the team.

Our team has been working on the EHR system (see the case here) for almost 2 years.
We received a request to create an interface for telemedicine products, which will be integrated with the EHR system but still will be an independent product.

More about EHR System creation process and challenges

So we decided to create
a Design System

A design system is a collection of shared design patterns, practices, and interactions that allow our team to build quality consistent interfaces. Design systems function as an ever-evolving central source of truth. They instill order, enable consistency, and improve efficiency. As of recent years, they are becoming the rule rather than the exception.

69% of enterprise companies are using a design system or currently working on one.

This wave of popularity explains why 69% of designers surveyed in the 2017–2018 Enterprise UX Industry Report said that they either already had a design system or were currently planning on building one.

Creation Process

Challenges we had

We have always to keep the Design System actual. We work on the Design System as long as we work on the product. Because in the process of product creation we always create new patterns. After the product is launch — the system is done. And we can improve the Design System while we improve the product. And have a new version, as we have new versions of the product.

It takes time and money to create and support the system.

But on the other hand, the Design System saves a lot of hours in the future.

challenges
questions

Questions we had to answer

  • How to create a DS?

    Make research and just do it.

  • Where we should keep it?

    Confluence for all

    Sketch library for designers

    Zeplin library for developers

  • How we are going to describe it (going deep)?

    Let’s stay on the basics:

    How does it look?

    How does it work?

    Where it is?

    Additional comments

  • How to keep versions (System Versions or Entities Versions)?

    Let’s keep entities versions

  • How to keep quality?

    🖼 See the picture

We created a structure

  • About DS
  • Vocabulary
  • Versions
  • Entities

We created a guide

We created a vocabulary

We decided how to work with versions

We created first entities

Evaluation

After four months we have started to understand what we are actually doing.

So the next question was HOW we are actually doing?

So we conducted the research.

We decided to make a research.
These were our goals:

  • Determine whether it is convenient to use the system for the first time.
  • Understand whether it is convenient to use the system for everyday work.
  • Determine if convenient tools are used now (zeplin and confluence).
  • Determine whether the nesting and the structure of entities are convenient.
  • Collect data to improve the Design System.

And our hypothesis

We believe, that developers and designers have a need to learn the Design System before they start working with it. We can resolve it with DS on-boarding.

We believe, that developers and designers use Zeplin only.

We can resolve it by adding an entity description to Zeplin.

We believe, that developers and designers don’t use Confluence to work with the system. We can resolve it by moving the system to a platform where the description and code are stored together.

We believe, that it’s difficult for developers and designers to navigate the system entities. We can resolve it by creating a system map.

We have prepared the survey for our designers and developers

How did we collect results: we decided
to highlight good reviews and bad to see how we go

Outcome

We created a system that helped a huge product. The product is 16 years old. During this time, it was created and improved by various experts.

Thus, the product was extremely inconsistent and not user friendly.

A design system became a collection of shared design patterns, practices, and interactions that allow our team to build quality consistent interfaces.

  • DS description
    in Confluence

  • Assets Library
    is Sketch

  • Assets Library
    is Zeplin

Results

  1. I like that confluence has excelent descriptions of every pattern, what they are used for, and most importantly, we now have a Zeplin screen where can use their assets.
  2. It provides us a way to apply specific css styles easily.
  3. It's like a constructor.
…Been a fully staffed team, they are able to handle multiple concurrent requirements without problems. Each team member at Angle2 provides us with new insights and ideas for our products that help make it better…
Ricardo Pineda NeoDeck Holding

Similar cases

Electronic Health Record System (EHR)

SaaS B2B Healhtcare Complex application

Telemedecine for EHR System

SaaS B2B B2C Healthcare

We're here to help. Start a discussion.

Filed "Your Name" should contain at least 3 symbols
Filed "Company Name" should contain at least 3 symbols
Choose your budget
Enter a valid email address
Filed "Description" should contain at least 10 symbols

Amazing!Thank you! See you soon