Work
About us

Services

Strategy
Brand
Technology
Culture
Careers
Insights
Contact
Image-TileUC_10_2_4

  1. work

  2. UCL

UCL

Welcome to Employee 
Engagement 101 

Building a best-in-class employee experience with UCL 

Overview

Working alongside Foolproof and Zensar, we designed and built a BIMA award-winning employee experience platform for UCL (University College London), one of the world’s most prestigious universities. 

Client name

UCL

Discipline

brand, technology, strategy

Challenge

  • Develop a versatile progressive web app platform for seamless access across mobile, desktop, and tablet, allowing employees to manage administrative tasks like booking time off or updating personal information. 

  • Drive engagement through intuitive design, eliminating the need for workarounds or extra instructions. 

  • Combine exceptional design with a low-code approach to elevate the employee experience and streamline functionality. 

  • Launch a mobile-friendly channel while reinforcing operational resilience with a cloud-native, API-driven digital platform built for high availability and fault tolerance. 

Approach

Identifying pain points  

UCL’s existing platform has some serious challenges to overcome. The two biggest pain points we identified were a UI that wasn’t intuitive, often requiring employees to use PDFs or explainer guides for basic tasks, and that access was limited to a local VPN. These usability issues led to inefficiencies, increased costs, and unintentional errors, creating frustration and contributing to a less-than-optimal employee experience.  

challenges
Image-TileUCL_5

Understanding UCL’s Needs Inside Out 

Our solution needed to cater to all university employees, so we conducted extensive rounds of qualitative user research and testing with staff members from various departments, including faculty and administrative staff. Engaging key stakeholders in workshops also helped us understand current challenges and requirements, providing us with a clear picture of how to improve the platform for diverse users. 

UCL-3

Establishing a Scalable Component Library 

To support ongoing design work and promote future reuse, we built a component library and set the foundation for a comprehensive design system. By creating 15 flexible components with defined styles, we efficiently designed 100+ pages across multiple breakpoints, enabling consistency across all screen sizes. This modular approach fostered collaboration with Zensar’s engineering team and UCL’s technical team, significantly accelerating design and development processes. 

We also introduced a changelog page, a central reference for design updates, allowing designers and developers to stay informed on changes and ensure consistent component usage. Each component had a brief description to aid quick reference, fostering accuracy and continuity across current and future applications. 

Image-TileUCL_13
UCL-9
Image_moduleUCL_5
Image_moduleUCL_8

Designing a Holistic Employee Experience 

For the homepage, we focused on a simplified information architecture with clear navigation, making it easy for employees to access common tasks. A system was also developed for organizing different types of notifications, tailored for both employees and managers. 

Personalized Interactions 

During initial research, employees expressed uncertainty about saved changes. We addressed this through active state indicators in form fields, allowing users to see when edits were completed and saved. A final review step and save confirmation notification further clarified the process. 

Image_moduleUCL_3

Streamlining Time Off Requests 

In the redesigned “Time Off” section, we prioritized commonly requested leave types, such as annual and sick leave, and renamed the section for a more inclusive feel. The page clearly displayed time off details before, during, and after the booking process, while the manager view provided essential information and a structured approval process. 

Image-TileUCL_12

Engineering Excellence Through Reusability  

Our strong documentation and reusable design components made it seamless for engineers to transition from Figma to OutSystems, following principles of modularity and efficiency. As a unified team, we continually collaborated to address design and engineering constraints in real time, enabling scalable engineering progress. 

UCL-8
Image-TileUCL_7

Looking Ahead

We’re continuing our work with UCL to enhance their employee experience, expanding the platform’s features and broadening the component library to build out a full design system that will ensure cohesive, efficient digital experiences for the university’s workforce. 

UCL-14

Solution

  • Conducted three rounds of qualitative user research and testing with UCL staff across various roles to gather insights. 

  • Defined a clear vision for the new app experience, supported by five core principles to ensure consistent and effective user satisfaction. 

  • Mapped out user journeys for key administrative tasks, such as updating personal information and booking annual leave. 

  • Developed a component library and established the foundation of a design system to support the Progressive Web Application and future UCL applications. 

  • Transformed the design vision into a functional app using the OutSystems low-code platform, accelerating delivery to employees. 

  • Leveraged existing backend systems to create new APIs, integrating data from various sources to enable key functionalities within the low-code platform. 

See more work

Alexa Social Hero

How to: Have fun with Alexa

Amazon

brand, strategy

Cloud cultures
Cloud Cultures
Microsoft
Inspiring our audience with the potential and possibilities for impact with Azure global cloud infrastructure.
brand, campaign
Group 1222
Shining a spotlight on the innovators of tomorrow
Microsoft
brand, strategy
Data and AI fabric flowing
Digital event branding for the trusted cloud
Microsoft
Annually, Microsoft has more than 20 cloud-specific events that range across the Azure, Dynamics, Business Apps, and security brands. We worked to create a unified design system for all marketing expressions.
brand
shell
Transforming the enterprise fleet management experience
Shell
brand, technology, strategy
Pile of cherries with can
Creating a ready-to-drink brand 
Indigo Slate
Seeing a gap in the market, we defined, concepted, designed, and produced a ready-to-drink low alcohol brand to serve Gen Z’s love of life and desire for convenience.
brand