So, @pauladams, our friends and members at @ICAPEthiopia (CC @dagimm, @amanryder) have asked if we might consider making the ID/Identifier number badges on the Patient Chart Header (MRN, OpenMRS Id) a bigger font and darker color to make it more readable.
Confirming Reason & User Story: I am guessing that the user story here is that often patients have extremely similar or even exactly the same names, especially in certain regions/districts. In these cases the ID numbers become even more important to use as part of ensuring you are caring for the right patient, so you do not enter data / make orders for the wrong patient! @amanryder@gkinyuacan you confirm that I have this user story/underlying need correct?
The Patient Header ID number UI is arguably better now than it was before so I just want to check what you’re seeing. Can you please share screenshots from the ICAP-ET O3 distribution, to show us an example of how it looks? The original design was definitely pretty faint; you can see the difference:
As you can see, it looks a little different on KenyaEMR’s O3 distro; although I think this is just because the screenshot is from a large monitor, and because there was no primary ID selected:
Thank you for your questions regarding the styling of the IDs. Here are our responses:
Confirmation of Reason & User Story: Yes, we confirm that the user story you specified is correct. Please proceed with it. Thank you.
Patient Header ID UI: The patient header ID UI in Ethiohri currently matches the design you shared under “Current appearance in O3 RefApp demo.” We suggest increasing the font size slightly and making the light-gray text color a bit darker. Otherwise, the design is good as it is.
It looks like in the screenshot of EthiOhri, the ID numbers are displayed using a colour that is not intended in the design. They’re perhaps aligned with what @grace shared under ‘Early-days of O3’, but they should be the same colour as all of the text in line 2 (Gender, DOB etc) which is the Text-Secondary colour token, or #525252.
It also looks like the labels ‘OpenMRS’, ‘MRN’, ‘UAN’ are all displaying in tags too, which is not as intended. This will make the ID numbers less visible as the focus is drawn away from the text that follows the labels. This recent ticket takes care of this issue, so hopefully that will be resolved for you very soon.
Regarding the font size, this should also be the same as line 2, it uses the body-compact-02 text style, which should be 1rem in size.
I hope this clears things up?
We can certainly look at improving the design guidance for the Patient Header component so that it appears more consistently and coherently across the various contexts that used, with progressively more information and actions disclosed. From it’s most truncated form in tablet workspace forms, through it’s most common variant at the top of the patient chart, to it’s most expanded form with patient lists and relationships displayed. This is something I think we can get tightened up in design and code. However, hopefully what you read above clears up how the ID numbers should be displayed?
Is it possible to designate a Primary ID so we’re able to apply a different style to it?
The example above shows the ‘Primary’ ID as a tag, with bold text for the ID number.
This version of the design also sees the Age, D/O/B and other ID’s text size adjusted for consistency in the header component.
One other idea to reduce the amounts of different information a user might expect to see under the name is the relocate the Gender next to the Name, represented here by an icon and a letter - interested to get everyone’s thoughts on this format.
Thank you for clarifying the design specifications. We were unaware that displaying the IDs in tags was unintended. We will follow up on the ticket addressing these design modifications to ensure everything is updated accordingly. @amanryder
