Usability Evaluation Report : Patient Portal

USABILITY EVALUATION : PATIENT PORTAL
UX Screen Specific Recommendations

Profile
• Key Tasks :
• Add a Patient
• Add a patient ( Manually) > Requires Staff approval
• Add a patient with a Pin > Doesn’t require staff permission
• Request for a pin to add a patient
• View all linked patients
• View/Edit profile settings

Profile : General Recommendations
• Profile page should be simple, elegant and consistent with
what users are already familiar doing in other consumer
applications e.g. LinkedIn, Facebook etc.
• Similar tasks should be grouped together
• Users should get a dash board view of what is possible
from this section
• Users should be explained about the concepts which are
or may not be clear. E.g. “Request a Pin”. Does users
understand what this feature is and how it benefits them?
• Emphasis should be given on visual design and layout

Current UI
This page is too empty.
Users should be given a
dashboard view of all tasks and
activities that he can do from
here in the landing page.
Why does user need to
Update Profile just to view
his/her profile?
Not sure why this is here

Current UI
General Comments :
Information is scattered all over
the place.
User is not clear whose profile
he/she is viewing and what
actions he can take on this
page
User eye moves to too many
places before he understands
what he can do on this page.
Centralize key actions in one
location
Why is user profile also
included under linked profiles.
Profile information has too
many tabs. If there are so many
sections it’s not advisable to go
with a tab structure. Need to
think of a different interaction
for those sections. Tab with
“next back “ arrow is very
unusable.
What does Profile activity do? It’s not self explanatory.
Is this information so important that it should appear at the top of the
page?
My recommendation would be to use this space to display
information which actually matters to the user. May be Pending
appointments, unread messages etc.
Users own profile should
not appear here. It’s
quite obvious that he is
inside his profile.
This section should only
display linked profiles
This should be grouped
under one task “Add
Patient” and should not be
a separate tabs. This will
simplify the UI
Does user understand
what PIN is and what’s the
value of adding a patient
with a PIN?
These concepts should be
explained intuitively in the
UI, without the users need
to go to help.
Too many sections. A tab
navigation with a “Back-Next” is
a big NO.
Need to think of a different
navigation model

Please note the screen specific UI suggestions I am making are just
suggestions and should NOT be considered as the final UI.
A dedicated team of interaction designers needs to spend more time in
understanding the system and also understanding the user goals and then
design the final UI

Suggestion
Andria Marks's Profile
Updated Monday, June 17, 2013 at 5:28 AM
1234 Rosemead
Dr.Pelham, Alabama 35305
205-603-5597 (Home)
Add a Patient
Edit Profile
Patients linked to you
View all
+ Add New Patient
Summary
Name: Andria Mark
Address
1234 Rosemead
Phone
205-603-5597 (Home)
Emergency Contact Number:
205-603-5597 (Home)
Email : andrea@gmail.com
Country : USA State: Alabama
Social Security Number :
123-45-6789
Marital Status:
Married
Physician
Dr. Tom
3 Patients lined
Demographics
Physicians
Locations
Settings
+
Profile Settings
Sections like
“Account
Holder
Preferences”
“Security
Settings “
should be
removed from
the tabs and
grouped under
settings
Recommend using a Open and
collapsible panel over the tabs to
reduce Navigation complexity
You Have
• 10 unread messages in the
Message center
• 2 scheduled appointments
• 1 registered event
Use this area to
provide relevant and
meaningful
information to the user
from other part of the
application
Profile is pretty much standard feature in any of the current web
applications ( LinkedIn, Facebook, YouTube, and many more).
Follow what is already established standard instead of reinventing
the wheel
Recommend having a
summary of the users
Profile highlighting key
information from the
profile section.
Demographics, Phone,
Country, SSN number,
Emergency contact,
doctors, etc. can be
displayed here. Clicking
on See more user can
also get access to
sections like current
activities

People Search
• Key Tasks :
• Search for people within the organization
• Ability to filter by different job roles, designation, location and other
filters provided by the business
• Ability to edit ( based on permission) profile demographics
information

People Search : General Recommendations
• People are used to seeing a search field and a search
button for any search. Give them that first
• Do not overwhelm users with advance search features.
User research data shows only 5% of the users use
advanced search, that too only if they a aren’t able to find
something via simple search
• Show drilldown filters only when it’s necessary. Follow the
model similar to “LinkedIn”, “Amazon” or any other search
intensive portals. People use it everyday, there is no need
to reinvent the wheel
• Define a base UI search component and make sure the
same component is reused across the application where
ever there is a search

Current UI
General Comments :
Think simple. Don’t reinvent the
wheel
Show users the search filed with a
button first. That’s where they will
start.
Allow more space ( 70% ) to display
the results
Expose drill down filters as needed,
blend it with the search display to
make it more intuitive.
More real-estate should be
given to display search results
I am assuming the data would
be huge for people search.
Make sure at least 70% of the
screen space is allocated to
display search results
The design is not tablet friendly.
A table based display is error
prone when it comes to touch
interaction
Where do I start? Whre is the search field?
Users are used to seeing the search field first. Give them that
Don’t expose advanced search feature in the UI at the beginning. Expose them
on need basis
Filters are usually not represented in a tab based control. Follow the standard
approach which is already working in other applications

Suggestion
Allocate maximum space for
displaying search results.
It has been proven that
Including a Picture thumbnail in
People search helps user to
find someone quickly. Make
that your default view. Allow
users to change the default
view if they need
Introduce smart search. This is
where 99% of your users will
start.
Allocate maximum space for
displaying search results.
It has been proven that
Including a Picture thumbnail in
People search helps user to
find someone quickly. Make
that your default view. Allow
users to change the default
view if they need

Current UI
This page is too empty.
Users should be given a
dashboard view of all tasks and
activities that he can do from
here in the landing page.
Rethink on the Left Navigation.
Currently it’s a list of items arranged in alphabetical o
Other than “People Directory” I haven’t seen any left
Navigation/Tools being arranged alphabetically
For an application like Empower the grouping should
based on tasks. With frequently performed tasks taki
priority
There is lot of redundancy, and unwanted elements in
navigation .This doesn’t allow users to focus on key t
Recommendations :
Optimize Left Navigation.
Allow users to focus on key tasks
Group similar tasks together. Helps in easy identifica
scanning
Remove elements like Announcements, Events, Enro
here and provide another entry point to these section
Even profile in my opinion should be kept separate fr
section
Ask a question, FAQ, Message Center are very simil
And should be grouped together. You can also think o
FAQ & Ask a question into one group and call it Help

Left Navigation : Deconstruction
Current
Announcement
Appointments
Ask a Question
Calendar of Events
Enrollment
FAQ
Find A Doctor
Message Center
POS
MHR
Pre Registration
Prescription Renewal
Profile
Group 1 ( Medical/Health
tasks)
• Find a Doctor
• Appointments
• Medical Health Record
• Point of Service ( POS)
• Prescription Renewal
Group 2 (
Information/Promotion)
• Event’s Calendar
• Announcements
Group 3 ( Help)
• FAQ
• Ask a question
Group 4 ( Messaging)
• Message Center
Group 5 (
Registration/Enrolment)
• Enrollment
• Pre-Registration
Group 6 (Profile)
• Profile

Left Navigation : Deconstruction
This Doesn’t need to
be placed together in
the same left
navigation.
tasks)
• Find a Doctor
• Appointments
Group 2 (
• Announcements
Group 3 ( Help)
• FAQ
• Ask a question
• Message Center
Group 5 (
• Enrollment
Group 6 (Profile)
• Profile
tasks)
• Find a Doctor
• Appointments
Group 2 (
• Announcements
Group 3 ( Help)
• FAQ
• Ask a question
• Message Center
Group 5 (
• Enrollment
Group 6 (Profile)
• Profile
Should be retained as
Left Navigation
Can reside in other
area of the Page
1 2
3
4
6
5

Left Navigation : Suggestion to consider
Your Tools
Find a Doctor
Appointments
Medical Health Record
POS
• Todays Events
• 3 upcoming events
• Register for events
• See more
• Announcements
• Dignity announces free eye
care
• Dignity launches new
patient portal
• See more
LANDING PAGE
Profile
1
2
6
HelpEnrollMessages 345
5
2

Left Navigation : Suggestion to consider
Your Tools
Find a Doctor
• Appointments
POS
• Todays Events
• See more
• Announcements
• Dignity announces free eye
care
• Dignity launches new
patient portal
• See more
Inner Page
Profile
1
2
6
HelpEnrollMessages 345
APPOINTMNETS
Home > Appointments

Too much of empty space is left in the content area.
The white space should be used to surface meaningful and
relevant information to the user
Users should be able to see upcoming appointments, and
also a calendar view without necessary to client anywhere
Customization per client should not be allowed or very
minimized when it comes to core flows like scheduling an
appointment
The company should be taking more of a product approach
here rather than taking a customized service/client approach.

Appointments: Suggestion to consider
Your Tools
Find a Doctor
• Appointments
POS
• Todays Events
• See more
• Announcements
• Dignity announces free
eye care
• See more
Profile HelpEnrollMessages
! You have 2 scheduled appointments in next 2 weeks
Home > Appointments
CALENDAR
Enlarge Calendar View
Upcoming Appointments
This week | Next Week | This Month | Next Month | Past Appointments
SEARCH
Request
appointment
Reschedule
appointment
Cancel
appointment
Request
appointment
Reschedule
appointment
Cancel
appointment

Why Mobile First
Andria Marks's Profile
Updated Monday, June 17, 2013 at
5:28 AM
1234 Rosemead
205-603-5597 (Home)
Add a PatientEdit Profile
Patients linked to you
View
all
+ Add New
Patient
Summary
Name: Andria Mark
Address
1234 Rosemead
Phone
205-603-5597 (Home)
Country : USA State: Alabama
Social Security Number :
123-45-6789
Marital Status:
Married
3 Patients lined
Demographics
Physicians
Locations
Settings
+
Profile Settings
You Have
• 10 unread messages
in the Message center
• 2 scheduled
appointments
• 1 registered event
1 2
3
4
5
• Assume This is going to be
the final profile page for
Influence
• The numbers indicate the
way content or Key tasks are
organized
• In web because of larger
screen the organization is
not so much dominated by
the priority or hierarchy of
the content.
• Because #2,#3 ,#4 &#5
would be visible at once
glance to the user
• But what happens when you
go mobile? Lets see in the
next page
1024 PX

Why Mobile First
Vie
w
all
+Add
New
Patient
Summary
Demographics
Physicians
Locations
Settings
1 2
3
4
5
1024 PX 320 PX
?
• These kind of decisions define your Mobile Experience
• What should appear just below it?
• Is #2 ( Linked Patient) more important than # 4 ( Profile information) ?
• If you only rely on UI framework ( bootstrap) it will automatically port #2 below #1. But is that what your users want?
• The process through which all these questions are answered is called Mobile First Content strategy/Information architecture
• That is what is termed as Responsive design
1
2
3
4
5
?
1
4
2
3
5
320 PX
Should it be arranged like this ? like this ?or
How to decide?
Web iPhone

But iPhone is not the only device….
Actual device landscape looks like this :
• If you do not have a clearly
defined content
strategy/Information
architecture which is device
agnostic but driven by user
priority imagine the amount of
time that would be spent to
tweak the solution for each
supported device

More on Responsive Process
Stephan Hay’s Responsive Design Workflow
• http://www.slideshare.net/stephenhay/mobilism2012
Viljami Salminen’s responsive workflow
• http://viljamis.com/blog/2012/responsive-workflow/
Mark Boulton’s Responsive workflow notes from the Responsive Summit:
• http://www.markboulton.co.uk/journal/comments/responsive-summit-workflow
Drew Clemen’s Design Process in the Responsive Age
• http://uxdesign.smashingmagazine.com/2012/05/30/design-process-responsive-age/
Ben Callahan’s Hands-on Responsive Web Design
• https://speakerdeck.com/u/bencallahan/p/hands-on-responsive-web-design?slide=12
Yellow Pencil’s Responsive web design process
• http://responsiveprocess.com/

THANK YOU
• Email : subhasish.karmakar@gmail.com
• LinkedIn : http://www.linkedin.com/in/subhasishkfSubhasish Karmakar
Independent UX Consultant
Portfolio
Download PDF : It's a Four-Screen World
View Online : It's a Four-Screen World

Usability Evaluation Report : Patient Portal

Recommended

Recommended

More Related Content

Viewers also liked

Viewers also liked (7)

Similar to Usability Evaluation Report : Patient Portal

Similar to Usability Evaluation Report : Patient Portal (20)

Recently uploaded

Recently uploaded (20)

Usability Evaluation Report : Patient Portal