Creating an award winning Intranet

A new intranet designed to create a space for employees to connect, feel valued, and better understand their contribution to the success of Salini Impregilo and its evolving global presence.

Client
WeBuild (Salini Impregilo)
Services
Interface Design, Branding
Project year
2019/20

Summary

Salini Impregilo (now 'Webuild') is an Italian construction and civil engineering firm specializing in complex, sustainable infrastructure construction. After a merger and a period of significant growth, its once award-winning intranet, "@work" was now failing to keep up with the needs of its expanding global workforce of over 35k people in 50 countries.

In developing a new Intranet, Salini hoped to once again offer its people a world-class digital employee experience. One that would become the destination for employees to gain a unique perspective on the world of Salini Impregilo, built with its users' needs at the forefront.

Outcome

Launched with overwhelmingly positive adoption, "@work" would go on to be recognized, winning the:

Intranet Italia Champions

Best Intranet 2021

An event dedicated to the latest digital trends in internal communications

Nielsen Norman Group (NN/g)

10 Best Intranets of 2022

Recognised by NN/g as part of the 2022 edition of the 'Intranet Design Annual'

Both awards specifically acknowledging "@work" for its focus on accessibility, inclusivity, user experience, and innovative design.

No items found.
Above: Quick thumbnail sketches produced during a brainstorming session.
Above: Mock-up designs for employee activation experience. An immersive wall-to-wall digital cube visitors could interact with and experience the 'Pixel perfect resolution'.

It takes a village

For this project, we'd be working alongside two other agencies within the Reply network. Bitmama Reply led on content and user research, Cluster Reply development engineering and Avvio Reply (us) on strategy evolution and design.

Working alongside a team of three engineers and a product manager, I led the visual design for the new intranet, developing a SharePoint-compatible interface and design system from the ground up.

In addition, I'd also be taking on a branding role to create a more robust brand mark since it would feature prominently in promotional activities for the new site.

No items found.
Above: User personas derived from employee interviews and onsite observations.
Above: Userflow diagram for Rolls-Royce web app.
Top: The original @work Intranet interface design.
Above: Design charette from user workshop illustrating desired product feature.
Above: Brand creative reconfigured for large-format installation at Sky's Osterley HQ.

The heart of the problem

Having received findings from the initial research phase, it was clear that the current intranet had outlived its original value. Users had become increasingly frustrated with the existing site drawing particular attention to issues including:

  • A 'catch-all' approach offering only 'down-stream' content
  • Confusing and complex site structure lacking a consistent standard
  • A complete lack of personalization options

User interaction was also low outside of Italy (we could assume that it hadn't been adopted in newer territories), all of which led to declining numbers of user interactions.


With this in mind, we formulated a strategy to fix this - we'd set goals focused on reducing friction and opening new opportunities for our users to access information and interact with the broader business.  

  1. Simplify user experience – Think of the user, don't ask the user to think.
  2. Make the user's experience feel unique - Give them the scope to shape their experience and tailor it to their needs.  
  3. Connect employees – Provide opportunities for them to engage the wider business and interact with colleagues.
  4. Speak their language – provide information on the business in a way that engages employees in a relatable way.
No items found.
Above: Framework diagram for content page templates.
Above: Examples of desktop and mobile wireframes produced during development.
Above: (Top) User flow developed to maintain consistency framework across each game. (Bottom) Our in-house Sky Sports design system
Above: User flow diagram detailing the content requirements for the overall application. Below: Task flow based on an activity requirement for a user persona.
Above: Examples of early creative routes pitched to the client.
Above: Sky HQ entranceway dressed and experiential pop-ups installed, ready for launch day.

Framing the problem

The existing intranet had significant limitations - most prominently, a lack of consistency and flexibility in the design and its templates. A knock-on effect to this was the dispersion of communications through informal channels, such as emails and team sites. These communications were often off-brand and hidden from most other employees, with no formal record of ever existing.

To address these issues, we proposed a new universal page framework. By allocating content into a series of zones, each serving a specific function or interaction type - we'd aim to establish a consistent rhythm and hierarchy absent from the previous site, resulting in a more consistent and enjoyable browsing experience.

In addition, we'd give content creators the flexibility to shape their content through web parts and widgets, encouraging them to use a centralized resource to create and distribute content. This would increase brand consistency, promote transparency, and ensure everyone was on the same page.

No items found.
Above: Prior to launch large crowds gathered in front of our countdown timer (left), teaser graphic on reception tower digital screens (right).
Top: Wireframes using the page framework to test its flexibility for multiple use cases.
Bottom: Comparison between the existing project page template and the new design using our page framework.
Above: (Top) Game screens for Formula 1® interface. (Bottom) Track illustrations for each European Grand Prix.
Above: Early set of creative ideas using messaging discovered during my research.
Above: The services page served as the homepage. Users could browse service options and sort by engine types, before selecting to learn more.

Finding a new home

Having gathered user feedback, I'd look to examples of innovative intranet design elsewhere - everything from adopting an "Intranet everywhere" approach and customizable user interfaces to facilitating interactions and knowledge sharing.

Good input results in sound output; the goal was to expand our knowledge of existing patterns and innovations and put these ideas on the table. Wanting to bring these ideas to life for the client, I created a series of homepage mock-ups that showcased these new features and illustrated their potential benefits for our users. I also brought in the development lead to present to ensure that these ideas were not just pipe dreams but were feasible within the limitations of Sharepoint.

No items found.
Above: Two employees pose for a photo opportunity inside the 'Pixel Perfect' cube installation (left), employees enter the launch experience through the digital doors (right)
Above: Selection of user interface and game screens for The Hundred.
Above: Draft iterations for a homepage developed in consultation with the client.
Top: Example of how Hi-Vis green text directed messaging inward, and how participation could help reduce workloads.
Bottom: Digital assets for screensavers and billboards across the Met Police estates.
Above: Set of poster designs for the initial campaign launch.

These sessions would reveal a new unforeseen challenge - senior stakeholders had a very particular vision for the homepage design, and any further project development would depend on this vision being achieved.

This led to an intense period of design iterations at the client's Milan HQ. Working tirelessly to align our vision with the senior stakeholders to achieve the desired visual aesthetic while also being mindful not to compromise our goal of producing a user-friendly, future-proofed design centered around our user.

No items found.
Above: Interface designs taken from the mobile version of the innovation center.
Above: Sky's Intranet digital takeover including home-screen (right) and Infographic (left and top-right).
Above: Character illustration and cut scenes designed for the Lions Tour game.
Top: Final desktop homepage, (below) comparison between old and new site.
Bottom: Onboarding pop-up overlay introducing users to new features available on @work.

Readying for launch

To promote the new site, a launch campaign would be essential. However, before proceeding with a campaign, we needed to come up with a name. The client originally wanted to rebrand to detach employees entirely from "@work" and its negative connotations and embrace a new intranet. While we understood their reasoning, we didn't necessarily agree. After all, the previous site had once been an award-winner and had only faltered recently.

The original ID was problematic, it lacked balance and became near illegible at smaller sizes - not ideal for a digital asset. However, since it was an established brand mark, we saw the potential to improve its functionality with some adjustments. By redrawing the '@' symbol to better balance its stroke, character heights, and kerning, we delivered a more polished design, one befitting its position as a subsidiary of the parent brand.

Above: Evolution of the original @work logo to a newer refined version.
No items found.
Above: CMS interface for authors, editors, and innovation managers to review and collate data.
Above: (top) Super Squads game interface. (Below) Email signatures with designs inspired by retro uniforms for each WSL club.
Above: Hi-definition wire flow for administration function to monitor and extract user content.
Above: Process flow for generating employee specific content for future campaign messaging.
Above: Giveaway items to promote the relaunch of @work.

Outcomes and learnings

The successful completion of this work depended on a close working relationship between a network of agencies. Unfortunately, due to unforeseen circumstances, our development partners dropped their inclusion four months into the job, leaving us with a resourcing gap. No longer having a developer in the client's territory (It was a client requirement to be based in Italy), we reached out to our partners at Bitmama to fulfill the requirement. With  Avvio Reply struggling to make the job economically viable, Bitmama Reply would now complete the remainder of the outstanding work, with me pivoting from developing documentation and onboarding to readying the design for final hand-off.

Though my involvement may have ended early, it was still a rewarding experience. I'm proud that I stepped up and challenged the client when I felt necessary, not knowing if it would work out. Fortunately, it did, and I'm grateful for the support from my colleagues.

Leaving the job before completion is always disappointing, but it had a happy ending. The completed site won a place in the NN/g Neilson 10 best Intranets of 2022.