sap fiori ux design and build challlenge

7
1 SAP FIORI UX DESIGN AND BUILD CHALLENGE Manuel Bellet Table of Contents SAP FIORI UX DESIGN AND BUILD CHALLENGE ................................................................................................. 1 STORY – PRINCETON-PLAINSBORO TEACHING HOSPITAL ............................................................................. 2 PERSONA – GREGORY HOUSE ....................................................................................................................... 3 USER EXPERIENCE JOURNEY – TRAINEES SUPPORT ...................................................................................... 4 MOCK UP – TRAINEES DIAGNOSIS APPROVAL .............................................................................................. 5 History and symptoms view ...................................................................................................................... 5 Diagnostic test ........................................................................................................................................... 5 Diagnosis & treatment............................................................................................................................... 6 Approval and rejection actions.................................................................................................................. 6 APP PROTOTYPE – TRAINEES DIAGNOSIS APPROVAL ................................................................................... 7 Master view ............................................................................................................................................... 7 Detail view & responsive table .................................................................................................................. 7 Data Model ................................................................................................................................................ 7 Freely inspired from American television medical fiction “House M.D.” created by David Shore.

Upload: others

Post on 12-Mar-2022

13 views

Category:

Documents


0 download

TRANSCRIPT

1

SAP FIORI UX DESIGN AND BUILD CHALLENGE

Manuel Bellet

Table of Contents

SAP FIORI UX DESIGN AND BUILD CHALLENGE ................................................................................................. 1

STORY – PRINCETON-PLAINSBORO TEACHING HOSPITAL ............................................................................. 2

PERSONA – GREGORY HOUSE ....................................................................................................................... 3

USER EXPERIENCE JOURNEY – TRAINEES SUPPORT ...................................................................................... 4

MOCK UP – TRAINEES DIAGNOSIS APPROVAL .............................................................................................. 5

History and symptoms view ...................................................................................................................... 5

Diagnostic test ........................................................................................................................................... 5

Diagnosis & treatment ............................................................................................................................... 6

Approval and rejection actions .................................................................................................................. 6

APP PROTOTYPE – TRAINEES DIAGNOSIS APPROVAL ................................................................................... 7

Master view ............................................................................................................................................... 7

Detail view & responsive table .................................................................................................................. 7

Data Model ................................................................................................................................................ 7

Freely inspired from American television medical fiction “House M.D.” created by David Shore.

2

STORY – PRINCETON-PLAINSBORO TEACHING HOSPITAL

Princeton-Plainsboro Teaching Hospital (PPTH) is one of the most renowned hospitals in the U.S.A. It

achieved his fame thanks to an extraordinary team of head physicians and above all thanks to a direct

collaboration with the best medicine universities. That partnership is strengthened by the fact that the

majority of head physicians are (as well as board of directors members) also university professor. The

hospital has also many separate branches scattered throughout the territory. It definitely is the first choice

for both patients and brilliant graduates.

Instead of famous captain Smith we would like to tell about the most famous head physician of the

hospital: Gregory House. He is the head of the diagnostic department and also (although it is an unwelcome

role) a member of board of directors. He’s simply a genius, a reference point for all the doctors, the senior

consultant physician par excellence at the hospital. He uses to deal with the most difficult cases with his

small and well-chosen team.

As any other head physician he really likes solving diagnostic enigmas and hates wasting time to solve

common cases. Anyway, its extraordinary ability and expertise don’t exempt him from other daily and

occasional tasks as for example:

• Teaching at the university

• Supervising and approving trainees diagnosis and treatment proposal (the role of our interest)

• Manage his team morning briefing

• Accomplish daily bureaucracy

• Attend board of directors meetings

• Speak at many conferences

Definitely he’s an head physician, an academic, a consultant, a supervisor and a manager.

3

PERSONA – GREGORY HOUSE

Main goals:

• Spend as much time as possible in diagnostic investigations to save human lives

• Prepare as best as possible trainees and students

• Professionally update (conferences, publications ecc.)

• Address future hospital investments decisions taken by the board of directors

Background: 45 years old, single; 20 years of troubled experience as doctor. Board-certified diagnostician

with a double specialty of infectious disease and nephrology. Manage a small team chosen by himself to

face most interesting and difficult cases. No problem with stress and high-responsibility decisions.

Independent with great observation skills. Lame person.

Pain points:

• Too much time wasted to retrieve the information to support trainees (especially those who work

at separate branches) usually dealing with very simple cases. Mail browsing, phone calls ecc. No

value added!

• Bureaucracy (medical records, board of directors red tapes ecc.)

• Frequent work displacements! (he’s lame)

Job Responsibilities:

• Diagnosis and treatment of patients followed by his team

• Editing medical records

• Supervision and support trainees in diagnosis and patients treatments decision

• Competences and skills of medicine students

• Board of directors decisions in general, especially involving diagnostic equipment

Stakeholders:

• CEO

• His team members

• Administration

• Trainees

• Patients

• University rector

• Students

Job Title: head of diagnostic department

Roles: board of directors member, university

professor.

Competences:

Casual user Power user

Proactive Reactive

Work in team Lone fighter

Global focus Local focus

Innovative Conservative

I would like: to spend the majority of my

time for diagnostic investigations; first of

all i’m a doctor! Not an employee.

4

USER EXPERIENCE JOURNEY – TRAINEES SUPPORT

30-60 minutes

MINDSET

Need to check my

trainees job Have to go to my office Uff! Have to reach elevator!

Wait, wait, another

stretcher, wait…

Should I take stairs instead?

No, I can’t! Who’s waiting for my at my office?

Listen to him or

dismiss?

Pff! Accumulated many

emails from my trainees…

First one, mmh. Yes, diagnosis

seems ok but I want to check x-ray

report to be sure

Need to go to

medical report

office!

Or send a member of my

team, should I do?

Finally my report! Let me check,

ok. I’ll confirm diagnosis and

treatment proposal.

ACTIONS

Go to elevator Wait for elevator Push button

Dismiss relatives of patients Switch-on PC Start mail client

Look for trainees email Read email Ask colleague to go to the

medial report office

Read report Reply confirming diagnosis

and treatment

Walking stick! (But

that’s only an House

feature!)

Pager Office Desk

Pen/Stationery PC Patients Relatives

Colleagues Smartphone Elevator/Elevator

Keyboard

TOUCH

POINTS

5

MOCK UP – TRAINEES DIAGNOSIS APPROVAL

History and symptoms view

The master list shows the list of diagnostic cases in charge of trainees with a priority indication (low,

medium, high). Trainees are assigned to simple and low-risk cases but they have to provide an opinion

about the priority. The master list shows the patient name (big), the trainee name, the diagnosis and the

case status. Icon tab filters in detail screen allow user to check specific sections in order to take a decision.

Diagnostic test

That icon tab filter shows a summary about medical test and examinations; the name of the test together

with the doctor who did it, the summary report and the list of attached documents and diagnostic images

accessible simply by clicking the record.

6

Diagnosis & treatment

Here the user can check diagnosis and treatment motivations.

Approval and rejection actions

The supervisor can approve or reject trainee’s diagnosis; in case of approval he must provide in a popup

input a rating about the way chosen to achieve the diagnosis and the diagnosis itself adding an approval

note. In case of rejection supervisor must provide motivation & suggestion to help trainee to reach the

right diagnosis.

7

APP PROTOTYPE – TRAINEES DIAGNOSIS APPROVAL

Master view

There i will show the master view code and preview in medium size; I decided to use pre-built

ObjectListItem trying to exploit its full potential.

Detail view & responsive table

There I will show the medical test view (mainly built with the layout editor) and the preview; the idea is

that by selecting the specific exam you will see the detailed report by the doctor who did the test and also

diagnostic images.

Data Model

Lastly I would show you how i visually built my edmx model file; using oData Modeler Plugin provided by

SAP for Eclipse Kepler (working also in Luna). Hope you enjoyed my work!