Shannon Woodbury's profile

OAG Intranet: UX | UI Development

The Office of the Auditor General (WA) is responsible for auditing the finances and activities of the entire Western Australian public sector.

The OAG approached Diversus to have them streamline and refine the UX and UI of their existing SharePoint-based intranet site. The aim was to promote greater awareness and use of their intranet's extended functions, and make the site easier to use. 
As the sole UX | UI designer on the project, I liaised directly with back-end developers, BAs, senior management and the client's representatives, in order to analyse, research, redesign and reconfigure the site's UX and UI.

A preliminary heuristic evaluation identified inconsistent placement and design of navigational controls across the site's various subsections. These formatting changes had built up over time and were hindering navigation. Typographical hierarchies also varied across sub-sections, and were contradictory and confusing.
Improving usability required surfacing key resources and navigational links that were currently buried deep within the site, and make them more accessible. 

We re-positioned and re-design tier-one navigation, as well as re-designed / re-skinned the site's aesthetic to increase clarity and consistency, and align UI patterns and visual design elements more closely with OAG branding style guides.

We could not however disturb or relocate any important and commonly-used widgets and resources in the process.
Our solution involved adding three additional, side-scrolling menu panels to the left-hand edge of the home page. The most important resource links were then broken-up and divided into GLOBAL-LEVEL >> TEAM-LEVEL >> PERSONAL-LEVEL strata, and added to the menu panels. 

Each strata of links was assigned its own dedicated slider panel, operated by a dedicated toggle button, with the content customised by site administrators. PERSONAL level links were decided at end-user discretion, but were restricted to internal links only.
The existing tier-one navigational menu was relocated vertically in the left-most column, immediately below the new slider panel toggle-buttons. The breadcrumb link-trail was then also relocated and placed just to the right of the slider controls.

Each toggle button activates a roll-over window containing the surfaced resource links. Positioning the roll-over window top left of the screen, placed the links in an instinctive and user-friendly location. These changes brought the most frequently-used navigation controls into prime position, squarely in its top-left visual 'hot-spot.'
The client specifically did not want employees accessing the intranet on their personal mobile devices, so we deliberately omitted optimising the site for mobile phone screens, designing the site's UI to suit only OAG-issued desktop and laptops devices.

Tiered roll-overs menus were made standard across all screen breakpoints, and acted as both a navigation tool and an interactive site-map. 

Having the menu display second, third and fourth tier links horizontally as a data-tree, made the site's IA far simpler to envisage and navigate. This also allowed the user to better visualise hierarchical working relationships between the organisation's various sections and working groups.
IMAGE ANIMATION CYCLES THROUGH THREE TIMES
RELOAD PAGE OR CLICK ON IMAGE TO REPEAT ANIMATION
Surfacing commonly-used links allowed end-users to navigate to their desired sub-section or resource from any location in the site with two or less mouse-clicks. 

Collating navigational controls to one primary above-the-fold location, allowed us to keep all pre-existing widgets and news feeds in their original locations; this simplified navigation and minimised disruption for existing site users.
Initial feedback from the client was very positive. Management received numerous positive comments from various site users after launch, and they anecdotally reports greater satisfaction with the site, as well as increased usage of its extended functions.

Further review of these amendments was scheduled for later in the year.
OAG Intranet: UX | UI Development
Published:

Owner

OAG Intranet: UX | UI Development

Published: