Client Node4 Ltd. United Kingdom | Timeline March 2021 - February 2023 | Industry Information Technology |
Summary
Outcomes |
|
|---|---|
Team |
|
Deliverables |
|
Introduction
Context
I was hired to be part of a dedicated team working on a specific CEO initiative named 'Nexus'. The team was made up of highly skilled software engineers, an architect, a product manager, and myself as the sole UX designer. Our responsibility was to plan, execute, and deliver the project, working closely with stakeholders and users to ensure that it met the business requirements and goals.
At Node4, Nexus plays a vital role as a business system that drives their business processes and provides data to their customers, staff, and partners via their individual portals. The main purpose of creating Nexus is to establish a unified and reliable source of information throughout the organisation, by replacing outdated CRMs and unnecessary third-party software.
About the Client
Node4 is a UK-based technology company that provides a range of IT infrastructure solutions, including cloud hosting, colocation, connectivity, and managed services. They specialise in delivering tailored solutions that meet the unique needs of their customers, with a focus on reliability, security, and flexibility. Their services are designed to help businesses of all sizes stay connected, secure, and efficient in today's digital world.
My Role
As the sole UX designer, I worked as a UX generalist, responsible for the software from planning UI tasks every sprint to research, testing, quality assurance, visual design, and the user interface design itself. Additionally, I developed a design system to be used as guidelines for the developers.
I saw my role on the team as both a problem solver and an organiser. On a daily basis, I work to organise large amounts of data in a way that is visually pleasing and user-friendly. I also focus on simplifying complex tasks and processes, finding ways to make them more intuitive and easy to understand for our users.
The Problem
The company is experiencing rapid growth due to multiple acquisitions. Consequently, it has added more IT service management systems to its operations, creating difficulties for system administrators, account managers, sales teams, partners, and clients. This is because multiple outdated and incompatible systems are present, including in-house software, CRMs, and third-party platforms like Hubspot and SAP. To address this issue, the company decided to develop a new in-house business system called Nexus and gradually migrate all transactions away from the old systems. However, the challenge was to design a user-friendly portal that would meet the organisation's needs while adhering to a strict timeline and product roadmap.
The primary objective is to establish a unified and reliable source of information across the entire business, while simultaneously addressing employee pain points by removing outdated and redundant systems. Additionally, we aim to alleviate the burden of managing multiple login credentials.
The Approach
As a UX designer, I joined the team during the early stage of web app development. At that point, the app lacked organisation and was only using temporary UI components from open source libraries. My initial goal was to familiarise myself with the company's services and users, while also getting to know my team's strengths and abilities. To achieve this, I held in-depth conversations with the Lead Architect and Product Manager to understand the project's goals. Additionally, I used Miro to conduct remote card sorting workshops with my team to collaborate on various topics especially during discovery stage for each new feature.
As the project was being built from scratch, there was no existing data for me to work with. Consequently, I had to create it myself by conducting interviews with actual users within the company to understand their pain-points and behaviours. Once I gathered the data, I analysed it, created workflows, and validated the issues with my team. This approach was repeated for each new feature and issues.
The Process
As I tackle the portal information hierarchy, usability issues and developing new features, I also have to ensure the overall look and accessibility of the portal is taken care of.
NexKit Design System | My initial focus was to restructure the contents of the web app and ensure it was accessible, branded, and pixel-perfect. To accomplish this, I developed a design system for Nexus based on the company's brand guidelines, and also followed WCAG web standards. With the help of our developers, we gradually built our own library of reusable UI components, styles, and templates. |
|---|---|
Discovery & Design Workshop | I facilitated a remote card sorting workshop via Miro, where I gathered all project stakeholders to discover and validate the problem and brainstorm potential solutions. As a non-technical member, I mediated the discussion while allowing the technical members to lead the conversation. |
Wireframes and Prototypes | I developed wireframes for every new feature, I start with a diagram of a workflow and wireframe on either Miro or Figma and discuss it with the team to gather their technical feedbacks |
User testing | I recruited participants, scheduled sessions, wrote test scripts and prepared the mockups for usability testing. I collected the data, summarised findings and produced report based on results. |
|---|---|
Feedback & Evaluation | To ensure technical feasibility, my design solutions must be validated by the engineers. After receiving feedback and alternative solutions from the team, I iterate on my designs to to reflect the feedbacks. I use basic heuristics evaluation to test the prototype prior to development. |
Quality Check | Before releasing new features to the production environment, I review the freshly coded UI pages in the staging environment to ensure that they adhere to our design system and identify any discrepancies related to UI components and CSS styling. Once I have reviewed and signed off on the UI, the feature is considered ready for release. |
The Result
This case study showcases multiple outcomes as this is a summary of what I do for the company. As a UX team of one, I played the role of a UX researcher, interaction designer, visual designer, usability tester, information architect, UX evangelist and a micro-copywriter. During my service, my team and I delivered the following:
NexKit Design System - documentation, guidelines, component library and design assets
In just one year, the team was able to deliver MVP features and launch the system within the target timeline. During the development process, the team focused on features that would benefit the majority of users based on surveys and interviews. These features included an upgraded billing system for the Finance department and automation of complex tasks for System Administrators. The successful release of the system included the migration of data from multiple ERP systems, resulting in significant cost savings after the retirement of the old finance system. In addition, the launch of automation features helped to boost company morale by assisting staff with their work.
The team streamlined the login process by incorporating Single Sign-On and consolidating systems with Nexus, resulting in fewer logins required.
Achieved a user satisfaction rating of 4 out of 5
Few screenshots of the UI
Few of the prototypes screen recording
During the span of two years, I helped the team in creating an attractive and user-friendly web application by delivering simpler user interfaces and automating processes, thus simplifying business administration for the company. While I designed more features than what we could develop due to limited resources and business priorities, this is simply the reality of working within a fixed timeline. Nevertheless, I am proud to have contributed to the project and left behind a legacy that I can be proud of.
End of post
Comments