hospitalrun/design

All things design related or HospitalRun

---

All HospitalRun code lives in a single repository, an architecture generally called a monorepo. This repository holds all of HospitalRun's open source projects that lived in their own separate Github repos: frontend, server and components. Built with React, Node, PouchDB/CouchDB and using offline first design, we're working to deliver an HIS system that makes usability the #1 requirement, is built specifically for developing world requirements, and seeks to give back time to patient care.

‼️ Version 1.0.0-beta is no longer supported. Version 2 is currently under development ‼️

FAQs

Question	Answer
"I want to help"	Find out how
"I have a question"	Join our Slack Workspace
"I found a bug"	Open an issue
"How can I deploy 1.0.0-beta?"	Follow this guide

Table of Contents

• Staging Area
• Contributing
• Community
• Project Structure
• Application Infrastructure
• Behind HospitalRun
• License

Staging Area

You can follow developments by visiting the dedicated staging environment. Use username / password as credentials to access.

Contributing

Interested in contributing to HospitalRun? There are many ways that you can get involved:

• Try the application
• Request new features and report bugs
• Write project documentation
• Contribute to the source code
• Sponsor the project
• Translate text in the application

Community

Join HospitalRun's community for discussion and ask questions: HospitalRun's Slack Workspace

Channels :

• #general - For general purpose
• #contributors - For people who contribute to HospitalRun by developing features
• #troubleshooting - For software related issues

Project Structure

Submodules	Version	Progress status	Build status	Coverage status	Code quality
Frontend
Server
Components
Core
CLI

Last Update: 2 July 2020

Application Infrastructure

A visual representation of the functionality of all HospitalRun modules and their interactions.

Behind HospitalRun

Hosted by

Sponsors

Backers

Big Thanks

Cross-browser Testing Platform and Open Source <3 Provided by Sauce Labs

Lead Maintainer

_{Maksim Sinik}

Core Maintainers

Jack Meyer	Matteo Vivona

Core Contributors

Stefano Casasola	Kumiko Kashii	Grace Lau	Stefano Miceli	Blessed Tabvirwa	Dr. MaryEtta Morris

Medical Supervisor

_{M.D. Daniele Piccolo}

Past Contributors

_{Michael Daly}

Contributors

Founders

John Kleinschmidtr	Joel Worrall	Joel Glovier

License

Released under the MIT license.

design's Issues

Work Flow Audit

The goal of this audit is to help design the user interface of the HospitalRun in order to optimize the work flow. To be effective, the app must minimize the number of time a user must click before the information appears. For example there should be 2-3 click for a given information to display.

I fork the design repo - as I make changes I will commit and update this issue

Dashboard

The dashboard is the most important UI for most EMR systems. I have some suggestion as to how we can populate it with most useful information.

1. Search:

Search only appears on certain pages but I think we can make it more universal by using the top bar. By doing this we lower the number of click to information time. The amount of clicks needed before a given information is display. I have created a prototype of how a simple design can greatly improve work flow, and allow uses to get quick access to information.

2. Top Bar:

The top bar should contain buttons to important pages, for starter I think the appointment and dashboard link are crucial. when a person login, whether they are a doctor or nurse, they will need quick access to these pages.

3. Main Menu:

The main menu button should be order in according to important. Below are orders Which I think are crucial.

• Patient
• Medication
• Labs
• Images
• Appointments
• Billing
• Inventory

2. Dashboard Display:

HospitalRun current landing dashboard is blank - this component of the app perhaps is the center point for users. For now I think, having the list of patients, a section for notification and a section for calendar/appointments.

UX Scorecard: Baseline market analysis

Want to get a baseline understanding of how EMRs, PMS, and HISs work and the basic Jobs To Be Done that our target users have/might expect from +HR

Would need to conduct a feature analysis as well as UX audits of those systems.

Running list:
Cerner
Epic
AdvancedMD
OpenEMR

Beta Image for Application

Hey @jglovier! Can you help me out with a image for the application with the logo? Im pretty sure you will agree that you dislike what this is doing...

https://docs.google.com/forms/u/0/d/1SlTWWoGEc99qYOIwNN_-1TRCrvpeA0uu2cWWpjWE-vA/edit

P.S. questions are VERY rough so don't look at those!!

New contributor looking for previous research materials

Hi there! I'm trying to learn more about HospitalRun and its users before I jump in.
I tried to hunt down some personas or user research and found this:
https://github.com/HospitalRun/hospitalrun-frontend/wiki/Personas

Is there any other existing research or materials that could help get me up to speed?

Refreshing logo

Create a color scheme

We need to create a color scheme that is simple and quick to reach.
I found this tool coolors.co.

@StefanoMiC what do you think?

The plus at the top fades into the background too much even though it's an important function.

The color of the plus sign does not stand out enough; additionally the plus sign alone is a little less meaningful in a domain where a plus sign is a common symbol.

UX Scorecard: Onboarding experiences

As a potential user, exploring HospitalRun as a potential tool, I want to see what the main features and benefits are for my team/role so that I can determine if it's viable for my hospital/practice.

As a potential contributor, considering Hospital Run, I want to learn about HospitalRun and see if it's a project I want to contribute to and learn about ways to get involved so that I can gain experience in the field, contribute towards a project that gives impact/value/meaning.

Need:

• baseline experience map of v1
• identify areas of opportunity
• Record and document their experience as a person who is new to this process

Emotional Grading Scale

• Positive: The user’s experience included a pleasant surprise—something they were not expecting to see. The user enjoyed the experience on the screen and could complete the task, effortlessly moving forward without having to stop and reassess their workflow. Emotion(s): Happy, Motivated, Possibly Surprised
• Neutral: The user’s expectations were met. Each action provided the basic expected response from the UI, so that the user could complete the task and move forward. Emotion(s): Indifferent
• Negative: The user did not receive the results they were expecting. There may be bugs, roadblocks, or confusion about what to click on that prevents the user from completing the task. Maybe they even needed to find an alternative method to achieve their goal. Emotion(s): Angry, Frustrated, Confused, Annoyed

Initial design mocks for Notifications

These mocks can serve as a guide for implementors at the Lisbon hackathon working on the Notification work.

Notification icon in sidebar

This comp shows where the notification icon will go, and how it should be styled. Notice it replaces the Gear dropdown, which I've moved to a sidebar nav item at the bottom called "Settings".

Notification icon with unread notifications

This comp shows the styling for the notification icon when there are unread notifications for the user to view.

Notification alert

This comp shows the notification alert that should appear if the user has turned on live notification updates. It should animate in from it's left edge. Clicking the alert will take you to the alert destination, and clicking the notification icon will still take you to the Notification view.

Notification index view

This comp shows the Notification view. In this comp, the light yellow items are new unread notifications, and should immediately begin slowly fading to white once the user arrives at the screen to indicate that they are now in a read state (since the user has viewed them). For context on styling, refer to the live updated comments on a GitHub thread, and how comments appear in a light yellow state, but slowly fade to white once shown on screen.

cc @jkleinsc @tangollama

Migrate design assets from marketing site repo to this repo

Now that we have plans to host a styleguide, a pattern library, and other design related things, it makes sense to house all things HospitalRun design related it it's own repo.

First step is to migrate the design assets to this repo from the marketing repo.

Addition to patient overview

In the patient overview, it should be possible to see the patient's imaging history, not just medications and labs. It would be good to add an “Imagings” tab to the patient overview.

Update Readme and reorganize the repo

Update the readme by adding

• new structure
• new logos

Contributor Thank You PostCards

I would like a branded Post Card that says...

Options:
A... "Thank you for giving of your time to help make this software great. We couldn't do this alone. ~From your friends at HospitalRun."

B... "Thank you for your brain. We couldn't have gotten this far without you. ❤️ HospitalRun"

C... "We know time is important to you. Thanks for giving some to us on this open source project. We couldn't have gotten this far without your help. From all of us @ HospitalRun, THANK YOU!"

@jglovier @tangollama -Opinions or weigh ins here?

@tangollama Do we have some budget to have these printed??