challenge / opportunity
Transform the employee experience with a flexible progressive web app platform (across mobile, desktop and tablet) for hosting admin activities, such as booking annual leave or updating personal details. Promote engagement with the tool through intuitive design, removing the need for workarounds and explainers. Deliver great design with a low-code platform to bring the employee experience to life. Enable a new channel (mobile), while strengthening operations with cloud-native, API-led digital platform that has high availability and fault tolerance.
Client
UCL University College London
Format
Multichannel
Solution
Conducted three rounds of qualitative user research and testing with UCL staff members across different roles. Defined the vision of the new app experience, supported by five principles to meet users’ needs consistently and effectively. Created user journeys for the priority admin tasks such as updating personal details and booking annual leave. Formed a component library and the foundations of a design system to support the new Progressive Web Application and other future applications of design across UCL. Brought to life the vision for design using the low-code platform OutSystems to bring the experience to employees at speed. Harnessed existing backend systems to develop new APIs and integrate data from other sources, enabling functionality within the new low code platform.
Outcomes
The strength of our documentation and reusability of our designs were easily consumed by our engineers, who worked alongside us across the whole project. Strong documentation in Figma has made the shift from atomic components to OutSystems easy. With two handover sessions and a check in 3 months in, UCL's technical team was confidently managing the system. High CSAT and CES scores, 4.5 and 4.3, confirmed the improved functionality. Time on task was reduced, as was the process time for all admin steps.
Overview
I knew our solution had to work for everyone at the University, so we ran successive rounds of qualitative user research and testing with staff members across the University - from lecturers to administrative staff and beyond. We also invited key stakeholders into workshops to capture their thoughts on existing processes and new requirements. This helped us to immerse ourselves in the current system to understand the failings, opportunities for improvement and needs of different people in the institution. During our formative research with UCL team members on the current system, we found that employees weren't sure if their changes had been saved or not. We tackled this through design by using different active states in the form fields to indicate completion and saving. This helped employees easily distinguish between viewing and editing. We also provided a clear review step, which presented all information about the request, and a save confirmation notification. Staff members found the existing platform unintuitive to use. Simple tasks often needed PDFs or explainer guides to aide completion without errors, as well as signing into a local VPN to gain access. This resulted in additional time and cost being invested and unforced errors creeping into what should be a smooth process. Among employees this caused frustration and detracted from their wholesale experience of the University. We focused on simplifying the information architecture and clearly signposting different areas of the application. This provided easy and quick access to the most common tasks an employee would undertake. We also helped to define a system for organising the different types of notifications on the platform from both an employee and manager view. By creating just 15 highly flexible and efficient components, and defining set styles, we were able to create 100+ pages across three breakpoints. Defining breakpoints like this allowed us to understand whether a component was consistent across all screen sizes. And if it wasn’t, this approach made it easy to understand how its behaviour differed. Each component also had a short description to offer a quick reference for designers when using the library. This ensured the correct components were used consistently across the current and future application. This approach helped us balance the variety of tasks which employees need to complete, and the sometimes intricate inputs, with the amount of design and development effort required to create this functionality. This opened up conversations with the Zensar engineering team and UCL's technical team. We enabled a high degree of reuse in design and development, speeding up both processes exponentially.