Make a busy intranet easier to move through.
HydroNet is where Hydro One employees start the day: tools like myHR and Storm Center, dozens of internal applications, team pages and company news all compete for the same homepage.
Utility · Employee intranet
Hydro One
Complex information. A direct path forward.
The HydroNet employee intranet, organised around daily tools and applications, plus public bill, outage and project pages.
- Role
- UX/UI Designer
- Scope
- Intranet homepage, applications directory, team pages, public pages
- Focus
- Information hierarchy, readability, access
- Role
- UX / UI Designer
- Wireframes, page layouts and interface direction for the intranet and selected public pages.
- Focus
- Everyday work, found fast
- Help employees reach their daily tools, applications and news, and help customers reach bill and outage tasks.
- System
- Content at scale
- Reusable blocks shared by the intranet homepage, the applications list and team pages.
- Year
- 2020 – 2021
- Nov 2020 to Mar 2021 with the Hydro One product team.
- Duration
- 5 months
- Five months of wireframes, mockups, and user flow work to redesign the platform for everyday workforce tasks.
Project arc5 months - Research, completed
- Personas, completed
- Data, completed
- Refinement, completed
- Done, completed
I reorganised the intranet around daily tasks.
Homepage wireframes and the final layout, the applications directory, team pages, and public bill, outage and project pages for hydroone.com.
Intranet homepage
From zone map to final page.
The homepage was mapped by job first, wireframed in a few directions, then designed with the daily tools leading.
myHR, HODS, Storm Center and the other daily tools sit top left, beside the campaign banner and the news.
The homepage is split into operational quick links, popular links, information and recent posts before any visual design.
One wireframe direction puts five daily tools on the right as full-width buttons, above the fold.
Homepage anatomy
Five zones, five employee questions.
Scroll the cards, or tap a marker on the screen.
HydroNetIntranet homepage, zone by zone
01 / 05Seven sections and one search.
Where is everything else?
Seven sections and one search.
Seven areas plus All Links in one row. Search narrows to HydroNet, People, Documents or All Sites.
- Consistent navigation
- Scoped search
Where are my daily tools?
Six tools, top left.
myHR, HODS, Storm Center, Kudos, Power to give and Service Centre Wizard come first, each with an icon.
- Task-first entry
- Recognition over recall
What do people open most?
Frequent links in one panel.
Five shortcuts share a grey panel; one carries a New tag.
- Shortcuts for frequent tasks
- Visual grouping
What is happening at Hydro One?
One campaign, then the news.
A rotating banner sits above three photo cards under a News heading.
- Visual hierarchy
- Scannable cards
What changed this week?
Tabbed posts with dates.
Corporate News and Company Events share one panel; each post has a title, a teaser, Read more and a date.
- Progressive disclosure
- Consistent cards
UX cases
What an employee asks, and how HydroNet answers.
Pick a question. See the screen that answers it.
Concepts · not shipped
Three I would design next. Try them.
- myHRHuman Resources
- IT Self-ServiceIT Support
2 of 4 pinned.
Let each employee pin their tools.
Pin a tool- myHR / HOLMS
- HODS
- Storm Center
- Kudos
- Service Centre Wizard
A normal day: the usual order.
Put Storm Center first during storms.
Flip itNew on HydroNet? Your first links: , , and .
HODS · Hydro One Document System
Spell out the acronyms in place.
Tap one
Content UX
Team pages and wireframe directions.
The same blocks carry from a team page to the homepage wireframes, each with a clear label for what it holds.
Explore the interactive HydroNet library: tokens, components, and four intranet pages.
Public pages
Bill, outage and project pages for customers.
Beyond the intranet: a project page for the Chatham to Lakeshore Line and a mobile menu that leads with bill and outage tasks.
SAP, IT Support, Document Systems and the rest each get a navy header and a plain list, with IT help pinned above them.
Put the tools people open every day where the eye lands first.
myHR, HODS and Storm Center sit top left on the intranet; View My Bill and Outage Map lead the public mobile menu.
Keep navigation close to the content it belongs to.
Team pages carry a breadcrumb and a line-of-business menu, so people know where they are and where else to go.
Reuse the same blocks across very different pages.
Headers, link panels and grouped lists repeat across the homepage, the applications directory and team pages.
Protect readability and touch targets when pages move to mobile.
The public mobile menu uses full-width rows with an icon, a label and a chevron, each easy to tap.
Outcome
An intranet that starts with the work.
HydroNet leads with daily tools, groups every application by system and gives team pages a clear place in the structure; the public pages lead with bill and outage tasks.