Fiori Makers Club Showcase 8 Review - SAP User Experience … · 2019. 8. 18. · 2 This application to manage users is very well designed with many well thought-through solutions

Kai Richter, SAP

Fiori Makers Club – Showcase 8 Review

2© 2017 SAP SE or an SAP affiliate company. All rights reserved.

This application to manage users is very well designed with many well thought-through solutions.

The team didn‘t only create a new UI but also changed and simplified the business process.

The design approach was a mobile first approach which you can see in the solutions that were

chosen here.

Focus on simplicity.

Why did we chose this app as showcase?


Manage My Users (1)

3

1(1) No Shell but the

application title. Apps should run in a shell for common services.

(2) Actions with icon and text are not allowed in our guidelines.

(3) The list item is very empty. Is there more information to show and maybe even offer approval already here?

(4) Sorting should offer a dialog and not just switch sort order.

(5) Letterboxing

2

34

5


Manage My Users (2)

4

1

(1) Manage my partnership is actually a link to the MMP backend, should be:- action in toolbar- link somewhere

(2) Approve self-registration is also a link to another page. Should be handled the same way as (1)

(3) All the function in the overflow menu is shell functionality.

23


Approval Request (1)

5

1

(1) Approve / Reject in the footer toolbar? Approve All?

(2) Approve / Reject only works on selection, this means the action should be disabled when nothing is selected.

(3) If there is no action in the footer toolbar it should be hidden

(4) Scrolling to bottom on load… very uncommon

3

2

4


Approval Request (2)

6

1 (1) The object should be clearly recognizable as an approval request.

(2) More of the user details could have been placed in the header area.

(3) Not necessary to place an icon for calling as the number could be a link to call

(4) “Main” is not explained here.

2

3

3


Permission Help

7

Great idea to show the

permission help. Could

this be more contextual?


All Users List

8

1

(1) “All” could be “All My Users”.

(2) Don’t use placeholder text to explain what can be searched for. Allow user to search for what he needs.

(3) Don’t place table in scroll container. Use page scrolling instead.

(4) Refresh, really needed? There is the browser refresh already.

(5) List rather empty. No indication that there is information missing here.

2

3

4

5


User Details

9

1

(1) Better don’t

combine semantic

button with

emphasized button.

(2) In display cases, do

we really want to

separate first and

second name?

Name already is in

the title.

(3) Info about the

permission could be

shown in the table.

2

3


Editing User Details

10

1

(1) In edit, first and

second name can

be separated, but

for display this

appears hard to

read.

(2) The availability of

the permission help:

- while creating

- if assigned

(3) Permission help

could be shown

here.

2

3


Handling Errors

11

Correct behaviour of the

error handling with field

state and message

popover.


Assigning Permissions

12

1

(1) It would be cool to

have information

about permissions

here.

(2) Engagement

selection mandatory

for some.

- Could be defaulted?

- Only contains one

value?

2


Incomplete and Inactive Users

13

List of users that haven’t

been used for a while.

List of users that have

an incomplete profile.

Could “All”, “Inactive”,

and “incomplete” be in

the same list?

Is there an advantage of

several lists over one

list?

Alternative Options

Don’t feature approvals but put

the user list in the focus. All

users are visible and ca be

filtered.

• Interactive charts for filtering

• External navigation all in the

global actions

• Users grouped by status

• Bring more information to the

front

• Permission information on

popover

• Recommended actions in list.

Split App – Initial State On TabletUser details in the object page.

Also here, feature the notion of

the user.

• Avatar control

• User information in header content

• Contact information interactive as

link

• Permissions grouped with actions

• Permission help in list.

Focus on Users Differentiate between Approvals

and Usersvs.

Use tabs as in the original design

but show approvals (not users) on

one tab and users on the other.

• Approval on the list

• Detail navigation to an approval

request

• Possibility to approve on item level

and change parameters

• Approve all

Differentiate

Approval Request

The user tab give access to the

users, not to the approval items.

Navigation to approval request if

approval required.

• No action on the list

• User details on object page

Differentiate

User

Only a user list with users.

• Search

• Grouped by status (list settings)

• Navigation to user includes

approval

• Permission help on the permission

directly.

User in Focus

Use a local edit approach. Actions

in the popover that lists all

permissions.

The user can assign or de-assign

permissions.

Options how to manage the

permission details.

Second approach to use a local

edit approach.

Approval actions on the user.

Detailed actions and free

assignment in pop-over


Mobile first vs. desktop first

Information architecture has strong influence on the UI

The mixture between approvals and users can be confusing

Embedding information about the content is helpful but difficult

Summary

Documents

Fiori Makers Club Showcase 8 Review - SAP User Experience … · 2019. 8. 18. · 2 This application to manage users is very well designed with many well thought-through solutions