Skip to content

Updated Widget - January 2023 to resolve these points

  1. Be more visible on the page with a happier vibe.
  2. Appear to be clickable/actionable.
  3. Takes up less real estate on the page to provide more space for the program content.
  1. Make "who to contact" for which types of questions clearer.
  2. Offer more support/contact throughout the widget tabs.
  3. More consistency in content formatting between tabs.
  1. Adding Apply Now into the tab for constant access to the Viewer.
  2. Upgraded mobile functionality with constant access to Apply Now.

Updated Widget Launched on January 16, 2023

View the Updated Widget on a sampling of program page templates on:

Review of Widget Updates

Updated widget is streamlined, reduces the real estate of the left margin, and has a clearer user experience. The brighter colour creates a more noticeable, friendlier and interactive feeling. All information inside the flyouts has not been changed other than the Contact Us content shown in this document.

Follow along this review with the interactive updated widget on the development site. If you are not on campus, you will require VPN to view the example.

program page

Prior Widget displayed icons with words on reveal making it look more complicated, more for the eye to digest. The gray was unappealing and stakeholders felt that it was not seen as friendly or clickable.

program page

Apply Now

Apply Now button is now attached to the sticky widget and stays up on the site throughout the visit giving constant access for the viewer to choose Apply Now at any time. The options for Domestic and International application links have been removed and one Apply Now link takes the viewer right to the branded ocas site where the viewer can then choose the International student application link or continue on with the domestic application.

widget

Contact Us

Contact Us is streamlined and clearly identifies Admissions Questions from Program-Specific Questions helping the audience to know who to contact.

contact us widget

Prior Contact Us section was confusing for potential students who often contacted the wrong department or person with questions.

contact us widget

How to Apply

How to Apply is more concise and now offers Program and Transfer Advising contacts.

how to apply widget

Prior How to Apply flyout offered OCAS and International Centre links only.

how to apply widget

Collapsed State

If a person chooses to collapse the menu, the bar will shift to an icon-only version. This state still allows the person to open the menu again to see all of the titles or they can hover over an icon to see individual titles. The viewer does not need to collapse the widget at any time to navigate the program page, this is an additional feature specific to the user experience.

Colour and menu item tagging are used to identify the three different button types between the menu control, the widget sections, and the apply button.

widget in Collapsed State

Fees & Financial Aid

Fees & Scholarships tab has been renamed Fees & Financial Aid, which is aligned with terminology used more commonly throughout the Humber site. A highlight has been added with a link to Student Fees and Financial Resources.

Fees & Scholarships tab

Pathways

Pathways has now been moved to the Program Details dashboard. The revised dashboard tidied up some elements that have been added to the site over time as well as having the ability to add future elements more easily. It makes better use of the top portion of real estate where there was a gap on the prior version.

program page

program page

Pathways has a simple pop up that reveals the pathways message and provides access to the Explore Pathways module.

pathways popup

Mobile Implementation

Mobile implementation is much more effective and has been designed to focus on having Apply Now > stand out and be accessible, similar to the desktop version.

The widget no longer covers the program title and the audience will now have to choose to close to widget instead of it closing on scroll. The previous widget was found to be overlooked on mobile because it collapsed to the icon state before the visitor could acknowledge the content in it.

New Open View

New Open View

Prior Open View

Prior Open View

New Collapsed View

New Collapsed View

Prior Collapsed View

Prior Collapsed View