Fiori Makers Club Showcase 8 Review. Kai Richter, SAP

Transcription

1 Fiori Makers Club Showcase 8 Review Kai Richter, SAP

2 Why did we chose this app as showcase? 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. 2

3 3 Manage My Users (1) 1 2 (1) No Shell but the application title. Apps should run in a shell for common services. 3 4 (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? 5 (4) Sorting should offer a dialog and not just switch sort order. (5) Letterboxing 3

4 4 Manage My Users (2) (1) Manage my partnership is actually a link to the MMP backend, should be: - action in toolbar - link somewhere (2) Approve selfregistration 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. 4

5 5 Approval Request (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 3 (4) Scrolling to bottom on load very uncommon 5

6 6 Approval Request (2) 1 (1) The object should be clearly 2 recognizable as an approval request. 3 (2) More of the user details could have been placed in the header area. 3 (3) Not necessary to place an icon for calling as the number could be a link to call (4) Main is not explained here. 6

7 7 Permission Help Great idea to show the permission help. Could this be more contextual? 7

8 8 All Users List (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. 5 3 (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. 8

9 9 User Details 2 1 (1) Better don t combine semantic button with emphasized button. 3 (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. 9

10 10 Editing User Details 1 (1) In edit, first and second name can be separated, but for display this appears hard to read. 2 (2) The availability of the permission help: - while creating - if assigned 3 (3) Permission help could be shown here. 10

11 11 Handling Errors Correct behaviour of the error handling with field state and message popover. 11

12 12 Assigning Permissions (1) It would be cool to have information about permissions here. 1 (2) Engagement selection mandatory for some. - Could be defaulted? - Only contains one value? 2 12

13 13 Incomplete and Inactive Users 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? 13

14 Alternative Options

15 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.

16 Split App Initial State On Tablet User 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.

17 Focus on Users vs. Differentiate between Approvals and Users

18 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

19 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

20 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

21 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.

22 Second approach to use a local edit approach. Approval actions on the user. Detailed actions and free assignment in pop-over

23 Summary 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 23