The IT Store Redesign

Year - 2023 Role - Lead UX/UI Designer Type - User research and testing, Prototyping

The IT Store is a crucial tool for employees, allowing them to borrow devices, submit help tickets, and manage IT requests. However, the previous design was difficult to navigate, lacked accessibility considerations, and created inefficiencies for both employees and IT managers.

This project focused on streamlining workflows, improving accessibility, and introducing role-based functionality to create a more intuitive, scalable, and user-friendly IT Store experience. Using Design Thinking, we identified key pain points, generated solutions, and iteratively refined the design through wireframing, prototyping, and user testing, ensuring an efficient and accessible final product.

Process

  • Understanding the users is the foundation of great design. This step focuses on deep user research, gathering insights through interviews, observations, and feedback to uncover challenges, motivations, and unmet needs. By building empathy, designers can create solutions that truly resonate with the people they serve.

  • Once research is complete, it's time to frame the problem. This step synthesises findings into clear problem statements, ensuring designers tackle the right challenges. A well-defined problem guides innovation and ensures solutions are meaningful and relevant.

  • With a solid problem definition, brainstorming begins! Designers explore diverse solutions, challenge assumptions, and push creativity through techniques like sketching, mind mapping, and rapid prototyping. This phase is about generating bold and innovative ideas before narrowing down the best ones.

  • Ideas take shape through low-fidelity wireframes, mockups, or interactive models. Prototypes allow designers to test concepts quickly, gathering feedback and refining solutions before investing in full-scale development. Iteration is key, ensuring ideas evolve based on user insights.

  • Refinement happens through user testing, where prototypes are evaluated in real-world scenarios. Feedback is collected, adjustments are made, and usability is improved before final implementation. This step ensures solutions are validated, optimised, and ready for deployment.

  • The implementation phase ensures a smooth transition from design to development, with designers providing detailed prototypes and accessibility guidelines while collaborating closely with developers. Accessibility standards, WCAG compliance, and ARIA attributes are integrated, followed by iterative refinements and final usability testing before deployment. Post-launch feedback drives continuous improvements, optimising usability and scalability.

Empathise - Understanding User Needs

Before redesigning the IT Store, we needed to deeply understand the frustrations and challenges employees faced when borrowing IT assets or submitting help tickets. To do this, we conducted user research, gathered stakeholder feedback, and analysed existing pain points.

User Interviews & Feedback

  • Employees expressed frustration with unclear product categorisation, making it difficult to compare and request IT assets.

  • Many found navigation overly complex, often struggling to locate the right section for hardware requests or software issues.

  • Inconsistent branding and design patterns across different sections created confusion and lacked visual hierarchy.

  • A high volume of support inquiries stemmed from unclear workflows, increasing time spent resolving requests.

  • The IT team found it challenging to keep up with requests, and status updates were often inaccurate due to delays in manual tracking.

Observing User Behaviour

  • Employees often relied on manual processes (emails, verbal requests) instead of using the IT Store, citing usability concerns.

  • Users hesitated to submit help tickets due to uncertainty about request statuses, leading to delays in resolving technical issues.

  • Employees struggled to locate IT assets and track request progress, leading to frustration.

  • Help ticket submissions lacked clarity, making it difficult to monitor and resolve issues.

  • Accessibility concerns surfaced, with employees mentioning difficulty in reading text, navigating menus, or submitting requests efficiently.

Define - Framing the Problem

Through user research and stakeholder feedback, we uncovered several key pain points that hindered the efficiency and usability of the IT Store. These challenges negatively impacted the experience of employees needing to borrow IT assets or submit help tickets, as well as IT managers overseeing inventory and approvals.

Complex Navigation & Categorisation

Users struggled to locate equipment, compare options, and submit requests due to inconsistent structure.

Disjointed Request & Approval Processes

Employees lacked visibility on request status, leading to delays, confusion, and unnecessary support inquiries.

Accessibility Limitations

The platform did not fully meet WCAG compliance, making it harder for users with disabilities to navigate.

Lack of Personalisation

Employees had a similar interface as IT managers, despite differing needs—resulting in unnecessary complexity for standard users.

Core Design Goal:

How might we create an intuitive, accessible, and scalable IT Store that improves usability, reduces support inquiries, and streamlines workflows for employees and IT managers?

Key Personas

Based on user research, we identified four primary personas who interact with the IT Store. Each represents a unique set of needs, behaviours, and pain points, guiding the redesign to improve usability, efficiency, and accessibility.

The Efficient Employee

"I just need a quick way to borrow IT equipment without jumping through hoops."

About

  • Role: Office Manager

  • Age: Mid-30s

  • Location: Based in corporate office setting

Behaviours & Habits

  • Regularly borrows laptops, projectors, and accessories for team members.

  • Checks inventory listings before making requests but often finds outdated information.

  • Manages multiple requests but struggles with approval delays.

Goals & Needs

  • Wants a simple, efficient way to borrow equipment, clear inventory listings, and fast approval processes.

Frustrations

  • Unclear availability of IT equipment, lengthy approval times, and confusing request process make borrowing frustrating.

The Tech-Savvy Problem Solver

"I just want to log issues quickly and know exactly when they'll be resolved."

Goals & Needs

  • A clear, structured system for logging issues and tracking resolutions, along with improved request visibility.

Frustrations

  • Cumbersome navigation, lack of real-time updates, and difficulty tracking help ticket progress.

About

  • Role: Software Engineer

  • Age: Late-20s

  • Location: Works in a tech-driven office environment

Behaviours & Habits

  • Frequently submits IT help tickets for software and hardware issues.

  • Uses the IT portal to report bugs but finds navigation difficult.

  • Needs real-time tracking for issue resolution but often left guessing.

The IT Operations Expert

"I need a better way to track requests and keep statuses updated efficiently."

Goals & Needs

  • A streamlined request tracking system, automated status updates, and better visibility on unresolved tickets.

Frustrations

  • Difficulty keeping up with requests, status updates not reflecting reality, and redundant manual tracking.

About

  • Role: IT Specialist

  • Age: Early-40s

  • Location: Manages IT requests and support tickets

Behaviours & Habits

  • Manages a high volume of IT requests daily.

  • Struggles with outdated status tracking, leading to inaccurate request information.

  • Relies on manual updates to keep records current but often falls behind.

The Remote Worker

"Accessing IT support remotely should be as easy as it is in the office."

Goals & Needs

  • A user-friendly remote support system, clear request tracking, and better accessibility for off-site employees.

Frustrations

  • Limited remote IT support, unclear request tracking, and poor mobile experience.

About

  • Role: Site Engineer

  • Age: Early-30s

  • Location: Works remotely across different locations

Behaviours & Habits

  • Often needs IT assistance for connectivity, software updates, and troubleshooting from remote locations.

  • Relies on virtual help desk but finds limited support.

  • Regularly switches between multiple devices for work and productivity.

  • Struggles with request visibility, not knowing when issues will be addressed.

Ideate - Generating Solutions

With a clear understanding of user frustrations, the next step was to brainstorm solutions that would streamline navigation, improve accessibility, and optimise workflows for both employees and IT managers. Using insights from user interviews, stakeholder feedback, and accessibility audits, we explored a variety of design concepts that would enhance the IT Store experience.

1. Simplifying Navigation & Info Architecture

To address confusion in finding devices and submitting requests, we redesigned the IT Store’s navigation and categorisation structure:

  • Implemented clear, hierarchical categories for IT assets, making it easier for employees to browse and compare options.

  • Introduced better search and filtering capabilities, allowing users to locate items more efficiently.

  • Designed a guided request process, ensuring users understand borrowing policies and requirements before submitting a request.

  • Updated support documentation and increased visibility, working with IT to focus on smaller issues that were frequently reported.

3. Improving Request & Approval Workflows

To reduce support inquiries and delays, we implemented an automated request tracking system:

  • Integrated real-time request status updates, providing employees visibility into approval progress.

  • Designed a transparent approval hierarchy, ensuring requests route directly to the right stakeholder.

  • Enabled automated notifications for pending approvals and completed requests, improving efficiency.

2. Personalised User Access & Role-Based Design

Recognising that IT managers and employees had distinct needs, we introduced a personalised dashboard experience:

  • Employees: Access to Home, Catalogue, Cart, and History, allowing for simple, streamlined requests and borrowing. We also filtered products based on role, location and availability so that users were seeing more relevant content.

  • IT Managers: Access to advanced tools such as inventory management, approval workflows, and reporting dashboards and the ability to switch between roles.

  • Adaptive UI components: Role-based access ensures each user only sees the relevant pages and functionalities, reducing cognitive overload.

4. Enhancing Accessibility & Inclusive Design

Ensuring the IT Store met WCAG standards was a critical priority:

  • Improved contrast ratios, text legibility, and keyboard navigation to support diverse accessibility needs.

  • Added screen reader compatibility for users with vision impairments.

  • Ensured responsive design, making interactions seamless across desktop and mobile devices.

User Flows

We created initial user flows that included a brief summary and four detailed workflows, covering key IT interactions:

  • Submitting a help request ticket – Ensuring users can report issues efficiently.

  • IT officer resolving a help ticket – Managing troubleshooting and resolution steps.

  • Requesting to borrow IT equipment or download software – Simplifying access to essential resources.

  • IT officer reviewing equipment or software requests – Optimising approval and tracking processes.

Wireframing & Prototyping - Bringing Ideas to Life

With clearly defined solutions, we transitioned into the wireframing and prototyping phase to visualise, test, and refine the redesigned IT Store experience. This step was crucial in ensuring that the new navigation, workflows, and personalised user access effectively addressed user frustrations while maintaining accessibility and scalability.

Low-Fidelity Wireframes - Structuring the Experience

  • Developed sketches and low-fidelity wireframes to map out key pages, focusing on intuitive navigation and streamlined user flows.

  • Established clear hierarchies for product categorisation, ensuring employees could browse, compare, and request IT assets effortlessly.

  • Designed role-based dashboards, distinguishing employee views (Home, Catalogue, Cart, History) from IT manager views (Inventory, Approvals, Reports).

High-Fidelity Prototype - Testing Usability

  • Created clickable prototypes in Figma, allowing for hands-on interaction and usability testing.

  • Conducted user testing sessions, gathering feedback on navigation clarity, request submission ease, and approval tracking visibility.

  • Iterated on component designs, accessibility enhancements, and workflow automation, refining layouts based on real user interactions.

Accessibility Testing - Ensuring Inclusivity

  • Tested colour contrast ratios, text legibility, and keyboard navigation to meet WCAG compliance.

  • Validated screen reader functionality, ensuring visually impaired users could navigate efficiently.

  • Adjusted form structures and guidance messaging to improve request submission clarity across all user types.

Test - Refining & Iterating

With interactive prototypes developed, the final phase focused on testing, refining, and implementing the redesigned IT Store to ensure usability, accessibility, and efficiency. Through usability testing, stakeholder validation, and accessibility audits, we gathered critical feedback to make final refinements before deployment.

Usability Testing

  • Conducted moderated testing sessions with employees and IT managers to observe navigation ease, request submission flow, and approval interactions.

  • Tracked usability metrics such as task completion time, error rates, and ease of locating IT assets.

  • Iterated on button placements, wording clarity, and interaction feedback to remove friction in key workflows.

Stakeholder Validation

  • Engaged IT managers to test inventory controls, approval workflows, and reporting dashboards for functionality.

  • Confirmed request routing processes aligned with internal IT support structures.

  • Integrated feedback from managers to further refine system notifications and access permissions.

Beta Testing

  • Measured navigation ease, request submission efficiency, and approval interactions, iterating to resolve identified bottlenecks.

  • Captured quantitative metrics (task completion rates, error frequencies) alongside qualitative insights, refining design clarity and workflow friction points.

  • Applied findings to enhance button placements, interaction responsiveness, and notification structures, ensuring a frictionless experience.

Handover - From Design to Development

A smooth handover was essential to ensure the redesigned IT Store was built as intended, maintaining its usability, accessibility, and efficiency.

Design Documentation

  • Provided detailed Figma prototypes, interaction specifications, and design system guidelines for developers.

Accessibility Considerations

  • Worked with engineers to verify ARIA attributes, keyboard navigation, and screen reader compatibility during implementation.

Component Libraries

  • Ensured all UI components aligned with pre-established design system standards, supporting scalability and consistency.

Continued Design Support

  • Maintained an open feedback loop during development, iterating on elements where necessary to refine interactions.

Cross-team Collaboration

  • Conducted handoff meetings with developers, addressing technical feasibility, front-end integration, and system workflows.

Deployment Strategy & User Adoption

  • Phased Rollout Approach – Launched the IT Store in staged releases, allowing for controlled testing and feedback collection before a full-scale rollout.

  • Employee Training & Onboarding Materials – Provided guides, walkthrough videos, and FAQs to help users transition smoothly to the redesigned system.

  • Live Monitoring & Iterative Enhancements – Leveraged user analytics, heatmaps, and direct feedback loops to track adoption rates and refine functionality.

  • Stakeholder Engagement & Support – Ensured IT managers had access to dedicated support channels and feature improvement discussions post-launch.

Measuring Success & Post-Launch Refinements

  • Efficiency Gains: Reduction in support inquiries due to clearer workflows and self-service features.

  • Improved Request Times: Faster approvals and resolution tracking, leading to increased employee satisfaction.

  • Accessibility Compliance: Full WCAG adherence, ensuring the platform was inclusive and usable across diverse employee needs.

  • Higher Adoption Rates: Increased system engagement, with employees actively preferring the IT Store over manual request methods.

  • Post-launch: Continued to track user behavior and feedback, ensuring the IT Store remained adaptive, scalable, and optimised for ongoing improvements.

Previous
Previous

YogAR