---
publishYear: 2017
name: Costa
title: Интерфейс дашборда медицинской системы
excerpt: Интерфейс для главного врача. Разработали дашборд, который собирает организационные данные по больнице и упрощает аналитику.
context: Медицинская система «Авиценна» хранит всю информацию по больнице. Но — в разных экранах, и переключаться между ними неудобно. «Коста» решила собрать все цифры на одном дашборде — такой вот подарок главврачам.
logo:
src: ~/assets/images/portfolio/costa/logo.svg
alt: Коста logo
link: https://kostasoft.ru/
image: ~/assets/images/portfolio/costa/costa.jpg
imageAlt: Интерфейс дашборда медицинской системы
thumbnail:
src: ~/assets/images/portfolio/cards/costa.svg
alt: Собака Павлова • Коста • Дизайн дашборда медицинской системы
tags:
- med
- ux-design
- prof
tags2:
- Медицина
- Сложные системы
- Дашборд медицинской системы
- Интерфейс для главного врача
relatedPages:
- text: |
### Вам нужен интерфейс?
#### Заказать дизайн
Напишите нам на [we@sobakapav.ru](mailto:we@sobakapav.ru)
#### Что мы можем сделать?
[UX-дизайн под ключ](/services/ux-design), как в этом кейсе, и [многое другое](/services).
collection: services
page: ux-design
- text: |
### Наша экспертиза
Более 30 проектов, связанных с медицинскими интерфейсам, и [16 проектных кейсов](https://sobakapav.ru/portfolio#med).
### Наши статьи о медицинских интерфейсах
collection: post
page: medical-interfaces
- collection: post
page: professional-testing
- collection: post
page: before-interface-testing
relatedPages2:
- text: |
### Похожие проекты
collection: portfolio
page: tmh
- collection: portfolio
page: medmarket
- collection: portfolio
page: m-line
- collection: portfolio
page: tis
- collection: portfolio
page: neurobureau
- collection: portfolio
page: raisa
- collection: portfolio
page: algohelp
- collection: portfolio
page: miaz
result:
- src: ~/assets/images/portfolio/png.png
text: Финальные макеты
link: https://drive.google.com/open?id=1xju46AWCszJ8B2EtUdYIbat-9pMRqr_K
- src: ~/assets/images/portfolio/png.png
text: Style-гайд и библиотека элементов
link: https://drive.google.com/open?id=1Eb_d54qXzNxQ5fTNLsef127Xa5vqEidw
budget: ~ 500 000 ₽
director: Ура! Дашборд внедрен и работает.
review:
text: Наша компания занимается разработкой программного обеспечения для медицины уже довольно давно. В этом году мы решили разработать удобную и простую в использовании программу для главных врачей больниц и поликлиник. Мы обратились за помощью в „Собаку Павлову“. Менеджер за короткий срок вежливо и настойчиво провела аналитику и управление проектом по созданию дизайна. Были учтены наши пожелания, выслушаны „хотелки“. Дизайн получился удобным и для разработчиков, и, мы надеемся, для пользователей. Надеюсь, что и в дальнейшем мы будем сотрудничать для получения красивых и удобных программ для наших клиентов.
photo: ~/assets/images/portfolio/costa/person.png
person: Мария Абрамова
position: Генеральный директор
metadata:
canonical: https://sobakapav.ru/portfolio/costa
title: Медицинский интерфейс • Дизайн дашборда для главврача (практический кейс)
description: "Интерфейс для главного врача: разработали дашборд, который собирает организационные данные по больнице и упрощает аналитику"
robots:
index: true
follow: true
openGraph:
site_name: Собака Павлова
images:
- url: '~/assets/images/portfolio/costa/costa.jpg'
width: 1280
height: 1512
type: website
---
Фирма [«Коста»](http://kostasoft.ru/) разрабатывает информационные системы для больниц. Главный продукт — программа «Авиценна». Она помогает организовать внутреннюю работу клиники: следить за финансами, движением пациентов, заполняемостью коек и запасом лекарств и расходных материалов на складе. В идеале — совсем без бумажек.
_Интерфейс «Авиценны»_
Врачи и медсестры ведут учет в «Авиценне», а главврач больницы может быстренько посмотреть нужную информацию, находясь хоть на краю света. Каждый пациент как на ладони, каждая таблеточка учтена.
_Профиль пациента в системе «Авиценна»_
«Коста» решила, что «быстренько» — это недостаточно. Нужно мгновенно. Поэтому задумала на Новый год подарить главврачам дашборд, где все основные данные собраны на одном экране. Бросил взгляд и сразу все понял. Даже не надо никуда нажимать.
[Обоснование проекта](https://drive.google.com/file/d/1JazSujiD51DS4x3A3ABIoPlsRzMiRGiW/view?usp=sharing)
На самом деле экранов было два. И у каждого — по несколько разных состояний. Первый экран — дашборд. Второй — табличка с деньгами. Потому что деньги — это важно.
_Концепт дашборда_
Проект со стороны клиента вела директор компании. Она основательно подготовилась к проекту: сама провела аналитику, собрала данные, написала к ним пояснения и подготовила ТЗ. Все было очень подробно. Нам оставалось только упаковать информацию.
[Требования к рабочему месту главврача](https://drive.google.com/open?id=1vFVF58vAKFVMv7_VBMtEFlzijGIqMn0X)
Над дашбордом работали два проектировщика. Каждый нарисовал по концепту. Заказчик попросил взять за основу один концепт, но добавить в него фишки из другого.
_Мы знали, какие данные нужно показать. Оставалось только сгруппировать их на странице_
[Посмотреть одним экраном](https://static.tildacdn.com/tild6465-6437-4239-a165-356330313139/-.png)
Дизайнер взял за основу цвета логотипа «Косты» и нарисовал четыре варианта оформления. И это только для десктопа.
[Финальные макеты](https://drive.google.com/open?id=1xju46AWCszJ8B2EtUdYIbat-9pMRqr_K)
_Эти три варианта дизайна заказчику понравились. Но он выбрал четвертый_
Из всех артефактов дашборда мы собрали библиотеку элементов.
_Style-гайд нужен разработчикам, чтобы сохранять консистентность. Его создают для всех крупных проектов_
От заказчика почти не было правок. Вот что значит подробное ТЗ. В итоге проект занял всего один месяц и неделю.
[Style-гайд и библиотека элементов](https://drive.google.com/open?id=1Eb_d54qXzNxQ5fTNLsef127Xa5vqEidw)
Зато были проблемы с внедрением. «Авиценна» — система сложная, ее разрабатывали много лет. Поэтому выглядит она как «привет из „нулевых“». Если обновить все интерфейсы системы, работа в клиниках встанет. Когда разработчики «Авиценны» увидели дашборд, они попытались его упростить — вместо закругленных углов сделать прямые, использовать стандартные шрифты и контролы.
_Финальная версия дашборда для десктопа_
_Версия для смартфонов_
[Посмотреть одним экраном](https://static.tildacdn.com/tild6439-3030-4264-b538-666665613930/03-stationar.png)
Но директору настолько понравилась получившаяся страница, что она настояла на нашем решении.
Дашборд кликается в двух местах. Можно посмотреть статистику по отделениям и перейти на табличку с деньгами.
_Две другие страницы мы нарисовали по style-гайду_
