Heuristic Review

download Heuristic Review

of 35

Transcript of Heuristic Review

  • 7/29/2019 Heuristic Review

    1/35

    Insurance Services Site Heuristic Evaluation

    Version 1Published October 20, 2011

    Created by Neil Tenzer

  • 7/29/2019 Heuristic Review

    2/35

  • 7/29/2019 Heuristic Review

    3/35

    Insurance Services Site Heuristic EvaluationVersion1publishedOctober 20, 2011byNeil Tenzer 3 of35

    Outlines the results, review and recommendations

    o a site evaluation and usability review o the

    Insurance Services site.

    Heuristic Evaluation

  • 7/29/2019 Heuristic Review

    4/35

    Insurance Services Site Heuristic EvaluationVersion1publishedOctober 20, 2011byNeil Tenzer 4 of35

    Executive Summary

    Introduction

    This section outlines the results, review and recommendations o a site

    evaluation and usability review o the Insurance Services site. Appendix I to this

    document is a compilation o the notes taken during the site evaluation and

    usability review by the expert reviewer.

    This brie provides the ollowing inormation:

    1. Findings A synopsis o the fndings rom the site evaluation and the

    usability review, including comments, concerns and questions or the issues

    encountered.

    2. Recommendations The changes that the expert reviewer advises are

    necessary to improve the user experience o the Insurance Services site.

    MethodologyDuring the course o the site evaluation and usability review, the expert reviewer

    navigated through the site as a regular user would. The purpose was to interact

    with each part o the site and gain a better understanding o the task and

    navigation ow a visitor would be required to navigate.

    This evaluation and document are based on an expert usability analysis o the

    Insurance Services site. Being that this review took place using static screens,

    knowing the location per clicking the links cannot be determined at this time.Ater compiling and reviewing these results, recommendations have been

    provided, based on experience and training, which will resolve the main issues

    outlined in this document. These recommendations are general to the site and

    may not apply to every page. For page specifc details, please review.

  • 7/29/2019 Heuristic Review

    5/35

    Insurance Services Site Heuristic EvaluationVersion1publishedOctober 20, 2011byNeil Tenzer 5 of35

    Executive Summary - Results

    Results

    The Insurance Services wire rame document provided a high-level overview

    o the site redesigned in the standard. The wire rame document

    allowed the team to get usability eedback beore the site was coded. This

    is a good practice o the User Centered Design methodology and should be

    encouraged throughout the design process.

    The Insurance Services redesign: Demonstrated a basic level o standard knowledge.

    Properly applied the Dashboard template.

    Used the Wizard template to make a complex process easier or users.

    The heuristic review identifed 2 key issue areas: Standard issues and

    Usability issues. Below is the summary o the issues.

    Issue Area # of Issues Found

    Standard 53

    Usability 27

    Total Issues 80

    Standard Issue Break Down

    # o Issues Found 53

    # o Duplicate Issues Found 44

    # o Duplicate Occurances 10

    Usability Issue Break Down

    # o Issues Found 27

    # o Duplicate Issues Found 16

    # o Duplicate Occurances 6

    During the review process, some issues were identifed as spanning multiple

    pages and when addressed could allow or easy fxes that would increase the

    overall usability and positive user experience o the site.

    Page Titles - Rename the page titles to names that provide meaning and

    context to the user. Use the correct text and design style.

    Icon Usage - Use standard icons and place them in the correct

    designated areas. When icons are used in tables and grids, provide legends sousers can quickly glance to fnd the meaning.

    Page Editing - Allow users to edit pages on page entry. Use the correct

    page edit orm template.

    Messages - Use the correct message type that correlates to the provided

    message text.

    Filter/Search Area - Remove the Filter By area on the let. Incorporate the

    inormation into the main Filter/Search area per the standard. Address - Use the standard address pattern.

  • 7/29/2019 Heuristic Review

    6/35

    Insurance Services Site Heuristic EvaluationVersion1publishedOctober 20, 2011byNeil Tenzer 6 of35

    Global Elements & Styles

    Global Elements

    The top-level icons (Preerences, Support, Log Out, Message Center,Calendar, Profle, and Search) need to be updated per the

    standards.

    The About link should be removed rom the ooter.

    Styles All text styles need to be updated per the standards. This

    includes, but is not limited to:

    - Section Headers (incorrect ont)

    - Field labels (incorrect ont, not bold, no colon)

    - Links

    - Search/Filter Container

    - Pagination control

    - In line messages (Confrmation, Warning, etc.)

    - Tabs

    (R)Evolution Form

    Search/Filter Container

    In line Confrmation Message

    Banner

    Portlet Actions

  • 7/29/2019 Heuristic Review

    7/35

    Insurance Services Site Heuristic EvaluationVersion1publishedOctober 20, 2011byNeil Tenzer 7 of35

    Outlines the conclusions reached ater examination o

    the Insurance Services site and courses o action.

    Findings &

    Recommendations

  • 7/29/2019 Heuristic Review

    8/35

    Insurance Services Site Heuristic EvaluationVersion1publishedOctober 20, 2011byNeil Tenzer 8 of35

    Dashboard

    Findings

    The role selector, displayed next to the name in the banner, is a component

    that is no longer supported by standards.

    The Support eature exists both as a portlet on the Dashboard Home page,

    as well as a link to an expanding window up in the main banner.

    A vertical scroll bar displays in the People portlet.

    The Client Profle portlet name does not speak to the client. The client

    would never reer to themselves as a client.

    The Alert icon used in the People and Certifcate portlets is not supported

    by the standards.

    Recommendations

    Navigating between roles is provided via the mega menu. Based on

    the users login credentials, the mega menu will contain dierent menu

    structures that support the roles the user can access.

    Remove the Support portlet as it does not need to be duplicated. The

    Support link is a global component and should contain all o the same

    inormation.

    The amount o rows displayed in the grid should ft within the constraints

    in the portlet. When additional data rows do not ft, display a view all link at

    the bottom o the grid.

    The links on the Dashboard page should open into ull portlets within the

    specifc mega menu tab as it pertains to them.

    Rename Client Profle to Company Profle or My Company in all

    instances in the application.

    Reerence the standards on accepted icons and how to use

    icons appropriately. Legends should be provided at the bottom o grids

    when icons or colored text is used.

    Figure 1. Insurance Services Dashboard Home Page

  • 7/29/2019 Heuristic Review

    9/35

    Insurance Services Site Heuristic EvaluationVersion1publishedOctober 20, 2011byNeil Tenzer 9 of35

    Client Profile

    Findings

    The standards does not support the appearance o the our

    icons in the right area o the central object.

    Three o the our icons displayed in the central object are not supported by

    the (R)Evolution standards.

    The central object should contain more inormation than the company

    name.

    All felds should be editable upon entry o the page.

    The Account Activity/History section is conusing on the page level context

    as well as taking up screen real-estate.. How much history is shown? Will it

    scroll?

    The placement o the Edit buttons does not ollow the

    standards.

    Incorrect feld label layout and usage (i.e., Home Address and E-mail).

    The Address ormat does not ollow the standard.

    Recommendations

    Remove the icons rom the central object and place them at the portlet

    level (in the portlet header) in an Action icon. The Action icon will contain

    links to export to PDF, export to excel, export to e-mail, and print.

    Remove the central object rom the page. Put the name o the company on

    the page in place o the General Ino heading.

    For the Company Details: Remove the Edit button and have all o the felds

    editable upon entry o the page.

    For the Authorized Contacts: Remove the Edit button and allow or the rows

    to become editable when clicked.

    Provide Add and Delete icons above the Authorized Contacts grid or theadding and deleting o contacts.

    Figure 2. Insurance Services Client Profle

  • 7/29/2019 Heuristic Review

    10/35

    Insurance Services Site Heuristic EvaluationVersion1publishedOctober 20, 2011byNeil Tenzer 10 of35

    Client Profile (contd)

    Add Save and Reset buttons on the page to support the editable page. The

    buttons should be placed at the bottom let o the page in the ollowing

    order: Save and Reset. The buttons should be placed 40 px rom the last UI

    element on the page and 10 px between buttons.

    Remove Account Activity/History section rom the page. There are 2

    recommendations to resolve the issue.

    1. Place a link titled History in the portlet action icon. The History link

    should open a light box window containing the History inormation.2. Place it in context o a history task ow in another area o the menu.

    Follow the standard address entry ormat.

    Follow the standard e-mail entry ormat.

    Figure 3. Insurance Services Client Profle

  • 7/29/2019 Heuristic Review

    11/35

    Insurance Services Site Heuristic EvaluationVersion1publishedOctober 20, 2011byNeil Tenzer 11 of35

    Employee Search

    Findings

    The page title is not needed on this page. The inormation it is containing is

    not appropriate or a page title.

    The let side Refne by Plan component is not a standard flter ormat .

    The Alert icon used in the grid is not supported by the

    standards.

    There is no way to view the masked inormation.

    The column header Classifcation is conusing. Its inormation has the

    same ormat as SSN.

    Recommendations

    Remove the page title. The inormation it contains is displayed as part o the

    pagination control that is placed over the grid.

    Use the central object background or the Filter area.

    Remove the let side Refne by Plan flter component and add the

    inormation as part o the standard flter component that is over the grid.

    Reerence the standards on accepted icons and how to use

    icons appropriately (i.e. , provide y over text or add a legend). Legends

    should be provided at the bottom o grids when icons or colored text is

    used.

    Add a Reveal link above the grid. This control allows users to see the masked

    inormation or a 10 second period o time beore switching back to the

    masked ormat.

    Rename the Classifcation column header to Social Security Number or

    SSN.

    Rename the portlet name & bread crumb to Employee Profle.

    Figure 4. Insurance Services Employee Search

  • 7/29/2019 Heuristic Review

    12/35

    Insurance Services Site Heuristic EvaluationVersion1publishedOctober 20, 2011byNeil Tenzer 12 of35

    Employee Details

    Findings

    The standards does not support the appearance o the our

    icons in the right area o the central object.

    Three o the our icons displayed in the central object are not supported by

    the standards.

    The central object should contain more inormation than the company

    name.

    All felds should be editable upon entry o the page.

    The Account Activity/History section is conusing on the page level context

    as well as taking up screen real-estate.. How much history is shown? Will it

    scroll? The Approved icon used in the History area are not supported by the

    standards.

    The placement o the Edit buttons does not ollow the

    standards.

    Incorrect feld label layout and usage (i.e., Home Address).

    The Address ormat does not ollow the standard.

    SSN masking lacks consistency between pages (Employee Details masks all

    but the last 4 digits and Employee Search masks all digits) and there is no

    way to view the masked inormation.

    The portlet name and ending bread crumb trail should not be theemployees name.

    The placement o the Submit and Cancel buttons do not belong in the

    wizard bar as this page is not part o a wizard.

    Recommendations

    Remove the icons rom the central object and place them at the portlet

    level (in the portlet header) in an Action icon. The Action icon will contain

    links to export to PDF, export to excel, export to e-mail, and print.

    Remove the central object rom the page. Put the name o the employee on

    Figure 5. Insurance Services Employee Details

    Figure 6. Insurance Services Employee Details - Edit Mode

  • 7/29/2019 Heuristic Review

    13/35

    Insurance Services Site Heuristic EvaluationVersion1publishedOctober 20, 2011byNeil Tenzer 13 of35

    Employee Details (contd)

    Figure 7. Insurance Services Employee Details

    the page in place o the General Ino heading.

    Remove the Edit button and have all felds editable upon entry o the page.

    - The SSN & Employee ID felds should show inormation as masked in the

    text entry box. When the user clicks into box to add or edit, the masked

    inormation will change view so you can see what you are entering. When

    leaving the feld the inormation will return to the masked state. The Reveal

    link should appear to the right o the text entry box.

    - Change the Submit button to a Save/Save & Exit combo button. ClickingSave saves the inormation and the user stays on the page. Clicking Save

    & Exit saves the inormation and brings the user back to the Employee

    Search page. The Cancel button cancels all inormation entered rom the

    last saved state and brings the user back to the Employee Search page. The

    buttons should be placed at the bottom let o the page in the ollowing

    order: Save combo button and Cancel. The buttons should be placed 40 px

    rom the last UI element on the page and 10 px between buttons.

    Add a Reveal link next to the Employee ID and SSN felds. This control allows

    users to see the masked inormation or a 10 second period o time beore

    switching back to the masked ormat.

    Remove Account Activity/History section rom the page. There are 2

    recommendations to resolve the issue.

    1. Place a link titled History in the portlet action icon. The History link

    should open a light box window containing the History inormation.

    2. Place it in context o a history task ow in another area o the menu. Follow the standard address entry ormat.

    Decide on how the product is going to mask SSN (mask all but last 4 digits

    or mask all digits) and use the masking rule consistently throughout the

    product.

    Rename the portlet name to Employee Profle as the portlet name should

    never be the detail o the object you are on.

    Change the ending bread crumb to Employee Profle as it should nevershow the detail o the object you are on.

    Figure 8. Insurance Services Employee Details - Edit Mode

  • 7/29/2019 Heuristic Review

    14/35

    Insurance Services Site Heuristic EvaluationVersion1publishedOctober 20, 2011byNeil Tenzer 14 of35

    Employee Details - Confirmation

    Figure 9. Insurance Services Employee Details Confrmation

    Findings

    The use o the Hide link in the Confrmation message is not supported by

    the standards.

    The highlighting o any updated/changed inormation is not part o the

    standards.

    Recommendations Remove the Hide link rom the in line message. Reerence the

    Standard or specifc inormation on in line messages.

    Remove any green highlights representing updates/changes.

  • 7/29/2019 Heuristic Review

    15/35

    Insurance Services Site Heuristic EvaluationVersion1publishedOctober 20, 2011byNeil Tenzer 15 of35

    Employee Details - Family Members

    Figure 10. Insurance Services Employee Details - Family Members

    Findings

    Inormation in the Family Member section does not ow well. Dependent

    Inormation is mixed with Beneft inormation and is conusing. Is the user

    adding a dependent? Are they adding a dependent to a beneft plan?

    All felds should be editable upon entry o the page.

    The placement o the Submit and Cancel buttons do not belong in the

    wizard bar as this page is not part o a wizard.

    Family Member title is misleading. Most beneft plans allow employees to

    cover dependents other than amily members (example: Domestic Partner,

    etc.).

    The use o the secondary central object is not necessary.

    The sub header General Ino & Plans is not needed.

    The Add Family Member button does not ollow the standard

    button naming convention.

    Text box entry o Relationship and Gender allows or not standard naming

    conventions and could allow or database conusion especially when

    sending inormation to carriers.

    Recommendations

    Remove the Family Members section and redesign the inormation so that

    it is clear that users are adding dependents and enrolling in beneft plans. Itis recommended to break the inormation into 2 tabs Beneft Elections and

    Dependent Inormation.

    (example)

    Beneft Elections Tab - Use this tab as a Summary o all the Beneft Electionsthe employee has made. It is suggested to place the inormation in a grid

  • 7/29/2019 Heuristic Review

    16/35

    Insurance Services Site Heuristic EvaluationVersion1publishedOctober 20, 2011byNeil Tenzer 16 of35

    Employee Details - Family Members (contd)

    Figure 11. Insurance Services Employee Details - Family Members - Edit Mode

    that displays the Beneft Area, Beneft Plan, Covered Individuals, Employee

    Price, and Employer Contribution. Clicking on the Beneft Area link will

    allow the user to enroll/change the plan (i.e., Aetna, Horizon, etc.) and cover

    dependents. This page would allow the user to show Employee elections as

    well as dependent coverage.

    Dependent Inormation Tab - Use the CRUD model to add, update and delete

    dependents. Include a reveal link above the grid

    to reveal the SSN and DOB inormation. When clicking on the Add button orEdit link users will be taken to a dierent page or pop up depending upon

    the amount o inormation needed. Grid order o column headers should be

    check box, First Name, MI, Last Name, DOB, SSN, Relationship, Gender. First

    Name will be a link to open the edit page.

    Relationship and Gender felds should use drop down selection o a

    standard data set.

  • 7/29/2019 Heuristic Review

    17/35

    Insurance Services Site Heuristic EvaluationVersion1publishedOctober 20, 2011byNeil Tenzer 17 of35

    Download Page

    Figure 12. Insurance Services Document Download

    Findings

    An in line Warning message is not the correct message type.

    The placement o page content diminishes the importance o certain

    inormation (i.e., Request ID).

    The Submit and Cancel buttons are conusing. The placement o the Submit

    and Cancel buttons do not belong in the wizard bar as this

    page is not part o a wizard. What happens when a user click Cancel? Howdo users access the documents to download again? Are the submitted

    changes still saved?

    The green check icon used or document download complete is the

    incorrect use o the Confrmation icon. What starts the

    download process? What do the document name links do?

    Standard does not provide a widget or displaying download

    progress in a bar.

    Recommendations

    Instead o a ull page, place the inormation into a light box pop up with an

    OK button and Cancel link. The OK button should become enabled once the

    user downloads all o the documents.

    Replace the Warning message style with an Inormation message, and

    remove the Next Steps: text in the message.

    Reorder inormation on the page. Place the Request ID under the in line

    message ollowed by the instructional text, address and download box area.

    Provide a Download button next to each document. The Download

    button could then change to show the standard processing

    (downloading) message with a spinner. The button would go away once the

    download is complete.

    Unless the links open to the actual documents, remove links rom

    document names.

    Change download complete icon to the Standard check icon.

  • 7/29/2019 Heuristic Review

    18/35

    Insurance Services Site Heuristic EvaluationVersion1publishedOctober 20, 2011byNeil Tenzer 18 of35

    Download Alert

    Figure 13. Insurance Services Download Alert

    Findings

    The message text is not alert necessary.

    The OK button name is not standard.

    Recommendations

    Remove the alert altogether nor is it necessary to inorm the user o this

    inormation multiple times.

  • 7/29/2019 Heuristic Review

    19/35

    Insurance Services Site Heuristic EvaluationVersion1publishedOctober 20, 2011byNeil Tenzer 19 of35

    Employee Details - Family Members Confirmation

    Figure 14. Insurance Services Employee Details - Family Members Confrmation

    Findings

    An in line Warning message is not the correct message type.

    The use o the Hide link in the Confrmation message is not supported by

    the standards.

    The highlighting o any updated/changed inormation is not part o the

    standards.

    The Alert icon and Approved icon used in the History area are not

    supported by the standards.

    Recommendations

    Use the standard Confrmation Message.

    Remove the Hide link rom the in line message. Reerence the

    Standard or specifc inormation on in line messages.

    Remove any green highlights representing updates/changes.

    Reerence the standards on accepted icons and how to use

    icons appropriately (i.e. , provide y over text or add a legend). Legends

    should be provided at the bottom o grids when icons or colored text is

    used.

  • 7/29/2019 Heuristic Review

    20/35

    Insurance Services Site Heuristic EvaluationVersion1publishedOctober 20, 2011byNeil Tenzer 20 of35

    Policies

    Figure 15. Insurance Services Policies

    Findings

    The Help icon is not supported or use within a tab.

    The page title is not needed on this page. The inormation it is containing is

    not appropriate or a page title.

    There is no way to view the masked inormation.

    The Alert icon used in the grid is not supported by the

    standards.

    The link in the Status column is conusing.

    Can policies be added and/or deleted rom the grid?

    Policy Number link is conusing. Does it reveal the Policy Number?

    Recommendations

    Use a single Help icon or all inormation on this page and place it in the arright o the portlet header.

    Remove the page title. The inormation it contains is displayed as part o the

    pagination control that is placed over the grid.

    Reerence the standards on accepted icons and how to use

    icons appropriately (i.e. , provide y over text or add a legend). Legends

    should be provided at the bottom o grids when icons or colored text is

    used.

    Add a Reveal link above the grid. This control allows users to see the masked

    inormation or a 10 second period o time beore switching back to the

    masked ormat.

    The Status link should be moved into a separate column with a column

    header that clarifes what the links represent.

    Remove the Policy Number link. Have the Carrier Name link open up a

    page/pop up containing additional inormation that is associated with the

    record.

  • 7/29/2019 Heuristic Review

    21/35

    Insurance Services Site Heuristic EvaluationVersion1publishedOctober 20, 2011byNeil Tenzer 21 of35

    Certificates

    Figure 16. Insurance Services Certifcates

    Findings

    The page title is not needed on this page. The inormation it is containing is

    not appropriate or a page title.

    The button to create a new certifcate does not ollow the

    standard Add New button ormat. Can Certifcates be deleted rom the

    grid?

    The let side Refne component is not a standard flter ormat .

    The Alert icon used in the grid is not supported by the (R)Evolution

    standards.

    Recommendations

    Remove the page title. The inormation it contains is displayed as part o the

    pagination control that is placed over the grid.

    Replace the New Certifcate button with the standard Addicon. Fly over text displaying Add New Certifcate can be added to provide

    urther inormation.

    Remove the let side Refne flter component and add the inormation as

    part o the standard flter component that is over the grid.

    Reerence the standards on accepted icons and how to use

    icons appropriately (i.e. , provide y over text or add a legend). Legends

    should be provided at the bottom o grids when icons or colored text isused.

  • 7/29/2019 Heuristic Review

    22/35

    Insurance Services Site Heuristic EvaluationVersion1publishedOctober 20, 2011byNeil Tenzer 22 of35

    Create New Certificate - Step 1

    Findings

    Help Icon Placement is not Standard.

    Does the user really need to identiy the number o certifcates being issued

    in this step? It may make more sense to place it on the Recipient Ino Step

    (step 2).

    Recommendations Place the help icon to the right o the text feld, check box, drop down, etc.

    Remove the Number o Certifcates feld. This will help in the Step 2

    redesign. Reer to page 23 or the Step 2 redesign to see how the new

    design handles adding multiple certifcates.

    Figure 17. Insurance Services Create New Certifcate - Step 1

  • 7/29/2019 Heuristic Review

    23/35

    Insurance Services Site Heuristic EvaluationVersion1publishedOctober 20, 2011byNeil Tenzer 23 of35

    Create New Certificate - Step 2

    Figure 18. Insurance Services Create New Certifcate - Step 2

    Findings

    Page Title is not the Standard Wizard Title ormat.

    The Address ormat does not ollow the standard.

    Bar lines separating check box responses is not standard.

    Let hand navigation is not standard or Wizards.

    It is not clear as to which certifcate the user is flling out the inormation or. Waiver Inormation gets lost within the wizard scrolling area and

    inormation pertaining to the selected waiver option alls below the page

    old. Users can easily move to the next step without seeing the additional

    felds.

    Date text feld is not Compliant.

    Italic text at the bottom o the waiver section gets lost.

    Selection o company in combo button is not standard.

    Recommendations

    Follow the standard Wizard Page Title ormat o Step 1 o 3:

    .

    Follow the standard address entry ormat.

    Remove bar lines around the check box responses or Send Copies to: *

    text feld.

    Remove the let hand navigation area. Redesign the inormation so that it

    is clear to users which certifcate number they are entering inormation or

    and so the waiver section does not get lost.

    It is recommended that this page should use the ollowing

    components.

    - Instructional text that notifes the user that they can only enter up to 5

    certifcate holders within the grid.- CRUD Grid on page. Initial grid would have add button with the ollowing

  • 7/29/2019 Heuristic Review

    24/35

    Insurance Services Site Heuristic EvaluationVersion1publishedOctober 20, 2011byNeil Tenzer 24 of35

    Create New Certificate - Step 2 (contd)

    grid columns: Holder Name and Waiver.

    - Clicking the Add button would open a light box pop up containing 2 tabs:

    Certifcate Holder and Waiver.

    - Light box pop up should have a Done button with Cancel and Add

    Another Links. Clicking Add Another would save the inormation entered

    and clear the orm so the user can add another Certifcate Holder.

    - Certifcate Holder tab should contain all inormation up to the Waiver

    section.- Waiver tab should contain the 3 waiver options with subsequent

    inormation pertaining to each radio button option. Subsequent

    inormation should not appear in a grey background. It should just appear

    on the page as per the progressive disclosure model.

    - Add an Inormation Message under the radio buttons when the user

    selects option Waiver o Subrogation. The inormational message would

    contain the italicized text at the bottom o the Waiver o Subrogation

    section.

    Remove the Company Combo button next to the greeting in the banner.

    Users can select companies by using the search area in the banner area.

    Figure 19. Insurance Services Create New Certifcate - Step 2

  • 7/29/2019 Heuristic Review

    25/35

    Insurance Services Site Heuristic EvaluationVersion1publishedOctober 20, 2011byNeil Tenzer 25 of35

    Create New Certificate - Step 3

    Figure 20. Insurance Services Create New Certifcate - Step 3

    Findings

    Page Title is not the Standard Wizard Title ormat.

    Field level help is not in the proper location and not necessary or two felds.

    Recommendations

    Follow the standard Wizard Page Title ormat o Step 1 o 3:

    .

    Remove feld level help and provide a single help icon in the top right

    corner o the page.

  • 7/29/2019 Heuristic Review

    26/35

    Insurance Services Site Heuristic EvaluationVersion1publishedOctober 20, 2011byNeil Tenzer 26 of35

    Create New Certificate - Confirmation

    Figure 21. Insurance Services Create New Certifcate - Confrmation

    Findings

    Confrmation does not belong on its own page within a wizard. It is

    conusing to click on Done only to have to click Done again to really

    complete the wizard.

    Request/Ticket number is lost on the page. It should be in a more

    prominent place.

    Recommendations

    Remove this page. Clicking the done button on Step 3 should navigate the

    user to the Certifcates page. Place the in line confrmation message at the

    top o the grid on the Certifcates page.

    In line Confrmation message should display the Request/Ticket number

    frst. Then tell the user about ADP needing to review the request and that a

    message will be e-mailed and sent to the message center.

  • 7/29/2019 Heuristic Review

    27/35

    Insurance Services Site Heuristic EvaluationVersion1publishedOctober 20, 2011byNeil Tenzer 27 of35

    Reports

    Figure 22. Insurance Services Certifcates Reports

    Findings

    The page title is not needed on this page. The inormation it is containing is

    not appropriate or a page title.

    The let side Filter by Plan component is not a standard flter ormat .

    Tabbed report types are not needed. Users should be able to select report

    at a higher search level.

    The Help icon is not supported or use within a tab.

    Recommendations

    Remove the page title. The inormation it contains is displayed as part o the

    pagination control that is placed over the grid.

    Use the central object background or the Filter area.

    Remove the let side Filter by Plan flter component and add the

    inormation as part o the standard flter component that is over the grid.

    Remove tabs on the page. Redesign the search to use one main flter central

    object. Users will be able to select a report type and then refne the flter

    criteria through the selected reports associated plan check boxes. Check

    boxes under the selected Report Type are enabled.

    (Example)

    Use a single Help icon or all inormation on this page and place it in the ar

    right o the portlet header.

    I S i Si H i i E l i

  • 7/29/2019 Heuristic Review

    28/35

    Insurance Services Site Heuristic EvaluationVersion1publishedOctober 20, 2011byNeil Tenzer 28 of35

    Provides inormation on UI Patterns and

    links on standard inormation.

    UI Patterns &

    Helpful Links

    I S i Sit H i ti E l ti

  • 7/29/2019 Heuristic Review

    29/35

    Insurance Services Site Heuristic EvaluationVersion1publishedOctober 20, 2011byNeil Tenzer 29 of35

    Address

    Figure 23. Standard Address Pattern

    Pattern Details

    Address Fields shall be displayed with Country frst. The selection o country

    will drive the felds that will display below or the address ormat. Example:

    Choosing Canada will change the felds to the ollowing ormat.

    Country:

    Address:

    City:

    Province:

    Postal Code:

    City is the revit.orm.search widget and will work as ollows:

    User can type in the state. As the user types the results will be fltered. Results

    will display City and State. Upon selection o the city, State will populate.

    Generic Format:

    The country drop down will also have an option or a generic ormat or address

    called other. Selecting the other option will present the user with the address

    inormation and the user selects i it is a state, province, or region and ZIP Code

    or Postal Code.

    Use My Address:

    This is used when the users address is in our data base and we are asking the

    user to fll out address inormation (example - we need to collect dependent

    address, user can select use my address i the dependent address is the same as

    the users).

    Checking the Use my address check box will present the users address as read

    only inormation.

    Insurance Services Site Heuristic Evaluation

  • 7/29/2019 Heuristic Review

    30/35

    Insurance Services Site Heuristic EvaluationVersion1publishedOctober 20, 2011byNeil Tenzer 30 of35

    Email

    Figure 24. Standard Email Pattern

    Pattern Details

    Email shall be displayed with a deault option o Personal and User or

    notifcations selected with the ollowing options in the drop down feld name:

    Personal

    Work

    Other

    Once a user has completed the email entry, the user has the option to add an

    additional email by clicking Add Another. When Add Another is clicked a new

    email drop down feld and text entry will appear.

    Users can delete the additional email by clicking on the grey x icon to the let o

    the additional email feld.

    On page validation (i.e. Save) when no values or duplicate values are entered

    display an error message.

    General Rules:

    When adding additional email addresses the page content that alls below the

    email section will be pushed down.

    When removing email addresses the page content that alls below the email

    section will move up.

    Email Type [Drop Down] - Personal is the deault option in the drop down.

    Product teams can add additional options per the business requirements and

    can change the deault option i needed.

    Add Another [Link] - clicking the add another link will present the user with an

    additional email address text feld and drop down box. The user will then select

    the email type. Depending upon business rules users may or may not enter

    more than one email address type.

    Remove Email Address [Icon Button] - clicking the (x) icon located to the let o

    the email type drop down will remove the email address entry. Users may not

    delete all email addresses. They must always have 1 email type drop down andtext entry box.

    Insurance Services Site Heuristic Evaluationf

  • 7/29/2019 Heuristic Review

    31/35

    Insurance Services Site Heuristic EvaluationVersion1publishedOctober 20, 2011byNeil Tenzer 31 of35

    Phone Number

    Figure 25. Standard Phone Number Pattern

    Phone number felds should be long enough or any international phone

    numbers. In some areas o the world, the local phone number can be 12 digits

    long.

    Reserve space or the area code and the country/region code, too.

    Field or Extension or PIN is optional.

    General Rules:

    When adding additional phone numbers the page content that alls below the

    phone number section will be pushed down.

    When removing phone numbers the page content that alls below the phone

    number section will move up.

    Phone Number Type [Drop Down] - Home is the deault option in the drop

    down. Product teams can add additional options per the business requirements

    and can change the deault option i needed.

    Add Another [Link] - clicking the add another link will present the user with

    an additional phone number text feld and drop down box. The user will then

    select the phone number type. Depending upon business rules users may or

    may not enter more than one phone number type.

    Remove Phone Number [Icon Button] - clickin the (x) icon located to the let o

    the phone number type drop down will remove the phone number entry. Users

    may not delete all phone numbers. They must always have 1 phone number

    type drop down and text entry box.

    Pattern Details

    Phone Number shall be displayed with a deault option o Home with the

    ollowing options in the drop down feld name:

    Home Fax

    Mobile Pager

    Work Other

    Once a user has completed the frst phone number entry, the user has the

    option to add an additional phone number by clicking Add Another. When

    Add Another is clicked a new phone number drop down feld and text entry

    will appear.

    Users can delete the additional phone number by clicking on the grey x icon to

    the let o the additional phone number feld.

    On page validation (i.e. Save) when no values or duplicate values are entereddisplay an error message.

  • 7/29/2019 Heuristic Review

    32/35

    Insurance Services Site Heuristic Evaluation33 of 35

  • 7/29/2019 Heuristic Review

    33/35

    Version1publishedOctober 20, 2011byNeil Tenzer 33 of35

    Messages & Feedback

    Figure 28. Standard Modal Message Pattern

    Pattern Details

    Messages are divided into three categories. A message may be inline within the

    page or may generate a separate page or dialog.

    Modal Messages - Inormation message, Warning message (Confrmation

    dialog), Confrmation message, Error message, In-progress Indicator

    Inline Messages - Error message, Confrmation message, Inormation message,

    Alerts and Warnings, In-progress Indicator, Wait IndicatorError Messages - Inlcude three things in the content o an error message:

    1. A brie explanation o what happened or what went wrong, in language that

    the user will easily understand. Identiy where the problem happened (which

    feld).

    2. The reason or the problem or requirement in terms amiliar to the user.

    3. A recovery strategy that the user can adopt to solve the problem.

    Common Inline Message Types:

    Inormational - Are used to communicate important inormation to a user

    related to a specifc orm, process, or application.

    Confrmation - Are used to communicate the application/server has successully

    completed an action or request the user perormed.

    Alerts and Warnings - Are used by clients as broadcast messages

    regarding specifc applications or eatures to all users.

    Error - Are used to convey errors or omissions when a user submits a orm,search, or other query requiring manual input.

    Figure 29. Standard Inline Message Pattern

    Figure 30. Standard Error Message Pattern

    Insurance Services Site Heuristic Evaluation34 of 35

  • 7/29/2019 Heuristic Review

    34/35

    Version1publishedOctober 20, 2011byNeil Tenzer 34 of35

    Helpful Links

    Insurance Services Site Heuristic EvaluationVersion1 published October20 2011 by Neil Tenzer 35 of 35

  • 7/29/2019 Heuristic Review

    35/35

    Version1publishedOctober 20, 2011byNeil Tenzer 35 of35

    Publish fndings to the Insurance Services Team.

    - Opportunity to review detailed fndings.

    - Present to a broader audience at the discretion o

    the stakeholders.

    As part o the requirements elaboration, working in

    collaboration with the User Experience Design (UX

    Design) team address the issues identifed in the

    review.

    Work in close collaboration with the UX Designteam or reviews as the product moves

    into implementation. Schedule periodic reviews.

    Next Steps