Visual Changes to Appointment Scheduling

Software Bahmni
1

Hello all,

The hospital administration in one of our implementations are relatively old - ~55 years and are facing aesthetic issues with appointments module. We wanted to recommend some of the following changes:

  1. Ability to configure the colours for services: Currently, the text on the yellow colour is invisible (see attached)

  2. Separation between multiple patients in the same time slot: As in the attachement, there is only a comma separation between multiple patients. This makes it harder to distinguish between two patients if the user has visual problems. Also, in case there are multiple patients (>10), it’s difficult to distinguish between the two. Can we use more space or a boldened bar “|” to help distinguish between the different names?

  3. Viewing only working hours on calendar: The calendar view currently includes all hours (as attached). Can we configure only the working hours to avoid the need for scrolling

  4. Increasing width of each appointment in calendar view: As the appointment is a 15 mins appointment, it appears like a thin line and difficult to view in the calendar mode. Can we either increase the width between each slot or create 15 mins/ 30 mins slot i.e. instead of 2 pm, 3 pm, 4 pm - create 2 pm, 2 30 pm, 3 pm and so on, on the Y axis. This will increase the width of each appointment created and become easier to view.

Please do share your inputs and do let us know if anyone is currently working on any of these features.

CC: @abhinavpc, @vmalini, @pramidat

Appt%20Scheduling1
Appt%20Scheduling11916×909 132 KB
Appt%20Scheduling2
Appt%20Scheduling21900×917 63.3 KB
Appt%20Scheduling3
Appt%20Scheduling31420×753 22 KB
Appt%20Scheduling4
Appt%20Scheduling41434×667 18.1 KB

1 Like
2
  1. The colors are configurable: The configuration to be used is “colorsForAppointmentService” in config/openmrs/apps/appointments/app.json

2,3. The calendar in Appointment scheduling app is built based on angular ui-calendar directive. These look like good suggestions, but depends on if ui-calendar directive gives this flexibility or not. Need to explore more on this

  1. Currently the height, width and slot interval are fixed based on UI/UX designer’s inputs. Changing this would need considerable dev effort. You can have half hour slots instead of one hour slots using the configuration - “calendarSlotLabelInterval": "00:30:00”. OR you can increase each slot height by setting the configuration “calendarSlotDuration": "00:10:00”
    49%20PM
    49%20PM2254×1074 89.5 KB
3

@pramidat The configuration mentioned “ colorsForAppointmentService ” in config/openmrs/apps/appointments/app.json is used for setting the color of the service band. It would be good to have a config to set the text color.

For eg: In the service type BV the color is yellow, and in the inner text displaying patient details is in white. Here text is barely visible and hospital staff are not convinced with changing the service color from yellow to something darker as the color signifies something across their workflow.