OPC-DC IT Portal
Equipment Management and Checkout for IT and Staff
Role: Senior Product Designer (Consulting)
Platform: SharePoint, Power Apps, Power Automate, Power BI
Stakeholders: IT Operations, Product Owners, Engineering, Staff, IT Leadership
The Challenge
Turning a fragmented equipment checkout into a self-service experience
OPC's internal IT processes had grown increasingly difficult to manage. Equipment requests, approvals, and tracking were largely handled through email, making it difficult for both employees and IT to understand request status or locate assets.
My Role
Assess the existing equipment ordering processes and design a digital experience that reduces friction for both staff requesting equipment and IT teams responsible for managing the asset lifecycle
Designing for Multiple Audiences
Different Equipment Needs for Different Staff Members
One of the first discoveries was that this wasn't a single-user experience. The portal needed to support several distinct audiences, each with different goals and permissions.
Staff needed a simple way to request equipment, complete training, acknowledge policies, and report incidents.
IT Administrators needed tools to manage the equipment lifecycle, investigate incidents, and monitor requests.
IT Leadership needed visibility into operations, compliance, and reporting.
Recognizing these different needs early helped shape the information architecture and ensured each experience was tailored to the right audience while remaining part of a unified platform.
After understanding the different needs of the users, we needed a clear idea of what steps they take to achieve their goals and objectives.
Using AI and visual storytelling for alignment
IT and Staff provided a great walkthrough of their process ,To accelerate discovery, I used AI to generate an initial experience map covering the complete employee journeyfrom requesting equipment to training, policy acknowledgements, incident reporting, and asset returns. we used is a point of discussion
AI Acceleration
What traditionally would have taken hours became a discussion-ready artifact in minutes. Instead of replacing design thinking, AI allowed the team to begin conversations with a shared North Star much earlier in the project.
The experience map displays the Equipment Ordering Checkpoints for staff members on a business level.
The system revolves around the movement of equipment. I needed to figure out the different stages and statuses of equipment use from different user perspectives.
Defining the Core Experience
Working closely with IT Operations, we mapped the complete equipment lifecycle.
The core experience centered around:
Equipment Checkout
Equipment Returns
Incident Reporting
Equipment Availability
Training & Knowledge
Policy & Governance
Once these workflows were understood, the UI became much easier to organize.
How Equipment Travels through different parts of the organization.
The mental model captures the entire process of equipment used by staff and monitored by IT. This helps break itdown into sections.
What features would assist in this journey?
Mapping and Prioritizing Features
Steps to equipment requesting
AI became a tool for ideation and collaboration
AI Changes the Design Conversation
Generative AI as a collaborative ideation tool
For this project, I introduced generative AI as a collaborative ideation tool to accelerate those conversations. Rather than replacing sketching, it helped us quickly visualize ideas, compare directions, and gather feedback earlier.
My role remained the same: facilitating discussions, evaluating ideas, removing scope creep, and shaping concepts into solutions that satisfied both user and business needs. The objective wasn't to produce more screens; it was to reach the right product, faster.
The IT Portal existed among other enterprise apps, therefore needed its own consistent look, feel and fuctions.
Color System used for different Button states and Purposes
Design Systems
Guides and Components
I evangelised turning the brand identity into a Design system; this would help
Speed up development,
Scale the look and feel for future features
More accurate AI-generated screens
Cohesive enterprise design
Components:, colors, buttons, tables, tabs all of the rules that are tied to tokens, which are mapped to Fluent UI within SharePoint to render the UI
The Experience Map gave me insight into the patterns and components the ui needed: alerts, confirmations, buttons, drawers, status indicators, and plenty of tabular data. To maintain consistency and collaborate more effectively with development.
Reusable patterns captured common behaviors across the portal. For instance, drawers let users review information and take action without leaving the page. Very useful and common throughout the portal.
Equipment checkout was the pivotal part of the experience, serving as the core workflow that connected staff requests, approvals, asset availability, assignment, returns, and lifecycle management.
Simplifying Equipment Checkout
Requests, Confirmation, Reporting
The wireflow captures the request submission form staff (in blue) and the response from IT (in green)
Staff needed a fast, self-service way to request equipment, while IT needed visibility into approvals, availability, and fulfillment.
The equipment checkout form could be structured in several ways, so I explored different layouts to find the clearest and most efficient approach for staff.
Page Iterations
Requesting Equipment for Employees
Using AI I rapidly generated and evaluated different approaches, including status bars and large equipment-selection interfaces. Ultimately, the workflow called for something simpler: a focused form with dropdowns and contextual imagery that immediately helped users understand the purpose of the page.
Request Page form
Staff users fill out the Request/Return/Report page. While primarily expected to be used on desktop, it is also responsive users request lapstops, screens monitors, and other assets..
The experience needed a way to confirm requests and provide updates on equipment statuses
Email Confirmations
To validate the process and provide clear feedback, users receive an on-screen confirmation and email notification after submitting a request.
Users receive confirmation of their report, while IT staff are notified by email to review and respond to the incident.
Now IT admins need a way to track equipment requests, review the details, and make informed decisions about approval, assignment, and fulfillment.
Addressing and Issuing Equipment Requests
From submitting requests, the wire flow captures how IT can view a list of requests and take actions such as issue, deny, approve.
Addressing and Issue Requests
The table design brings together requests, asset details, and statuses, giving IT the information they need to quickly determine the appropriate action.
Viewing Equipment Details and Statuses
IT can select any equipment item to view its details, including availability, condition, and status, helping them determine whether the asset is appropriate for the request.
Equipment Request Confirmation
I designed an Issue page that allows IT to assign an available asset to the requester, while providing the staff and equipment details needed to confirm the assignment.
Impact: No more unnecessary digging through emails to confirm and trace who got what piece of equipment…requests, returns, and reports are all confirmed and tracked.
Equipment Lifecycle
tracking the lifecycle of equipment
As equipment moves in and out of the facility, IT needs a clear
way to track where each asset is, who it is assigned to, and its current status throughout the lifecycle
Equipment Lifecycle (Scan, assign and track incoming and outgoing assets)
The Wireflow is designed to generate and confirm the equipment check-in and check-out process that utilizes scanning. Once this is confirmed, I move on to more refined designs.
Engineering confirmed Power Apps could support barcode scanning and asset tracking, allowing us to design around capabilities instead of assumptions.
Equipment Scanner Design Iterations
After several iterations of the experience, IT only needed a simple asset number field and barcode scan for lookup, and Mark Available, Assign, Repair, or Surplus, depending on where the equipment was in its lifecycle
Scanning in Equipment Details for Actions
After scanning the equipment, its key information is surfaced directly on the page alongside a list of available actions. Selecting an action opens a contextual drawer where IT can complete the required details and update the asset:
Assigning Scanned Equipment
(Assign? Lost? Stolen? Available?)
With equipment scanned and labeled, IT needed a centralized inventory view to quickly see what was available, what was assigned, and the current status of each asset.
Listing Scanned Equipment Status
IMPACT: Once the update is confirmed, the change is reflected in the Asset Register with the appropriate status, Now the IT team has a shared, up-to-date view of the equipment lifecycle.
Training & Knowledge
Providing Training Access to Staff Employees
Employees also needed training to comply with standards during their employment, which covered how to handle the internet, VPNs, security awareness, etc.
Training Page Iterations
We talked about training completions bars and statuses; Engineering confirmed Power Apps could support it. However, maintaining that information would create additional work for IT to maintain and supervise.
Together we decided on a simpler approach. Instead of constantly updating portal status, the system would send reminder emails whenever employees needed to complete required training.
The result reduced administrative effort while still keeping employees informed. Sometimes removing features creates a better product.
Training and Knowledge Base Archive
Behaviors Addressed: finding required training, browsing useful resources, and accessing knowledge quickly. Rather than adding features simply because they were common in learning platforms, I focused on the functionality that supported the actual goals and scope of the project.
Staff users can look at the backlog of required training and knowledge base articles.
View All Training Material
Staff users can look at the backlog of required training and knowledge base articles.
Policy & Governance
Tracking Compliance
Unlike optional learning, policy acknowledgement was mandatory. Rather than presenting staff with one overwhelming document library, I organized policies into clear categories and simplified acknowledgement workflows. The experience respected government compliance requirements while reducing the effort required from employees.
I designed the Policy & Governance dashboard to surface recently updated policies alongside categories relevant to the user, making it easier to discover, review, and acknowledge the policies that matter to them:
Keeps users informed with policy updates organized by compliance category.
The dashboard includes search and filtering to help users quickly find relevant policies. It also displays policy status such as Unread or Acknowledged and provides access to the full policy library for further filtering and exploration.
View a full list of Compliance Status
Users Acknowledging Policy Compliance
Users Acknowledging Policy Compliance
Clicking a policy takes users to the full article, where they can review the content and acknowledge that they’ve read it.
Once acknowledged, the policy status is automatically updated, giving both users and IT a clear record of completion.
Supervisor's view of policy compliance
The IT view also includes data visualizations that provide a snapshot of policy compliance, such as acknowledgment rates and completion by department. These metrics give IT and leadership a quick way to identify gaps and monitor compliance with government policy requirements.
Viewing Incident Reports
While staff members simply needed a quick way to report a problem. They had little reason to see the full incident queue, investigation details, or administrative tools. IT administrators needed a different level of visibility and control. This led us to separate the experiences.
Staff could report an incident directly from the portal homepage or Equipment Checkout, while the Incident & Continuity area became an administrative workspace for IT.
The change reduced unnecessary complexity for staff while giving IT a more focused environment for managing incidents from intake through resolution.
I explored several directions for Incident & Continuity, including a detailed ticket-management view, an analytics-heavy incident dashboard, and a simpler operational list.
Incident Report Design Iterations
I ultimately chose a scannable incident list paired with runbooks and continuity resources. It gave staff and IT immediate visibility into what was happening and what action to take,
Incoming Incidents and Status
Problem: Reporting an incident alone didn’t help staff know what to do when a service disruption was already happening.
Solution: I surfaced runbooks and continuity procedures alongside incident reporting, giving users immediate access to established steps for common outages and disruptions.
Solutions to Common Incidents
Once an incident has been identified, next it needs to be assigned for investigation and resolution.
Assigning Incidents
Prototype GIF
After IT receives an email about an open incident, they have to go in and assign it.
Investigating Incidents
Prototype GIF
Now the assignee gets an email to see the incident, but can only change the status.
List of Incidents and statuses
Impact: Recent incidents are surfaced across the organization, giving IT a shared view of active and recently reported issues. This makes ownership and status more transparent while helping the team recognize recurring problems and broader service disruptions.
Bringing It All Together
Homepage Snapshot
2 different homepages for 2 different audiences. Staff and IT
Home Page Iterations
For Staff, I made it feel less like an administrative dashboard and more like a welcoming entry point that helped users quickly understand where to go and what they could do.
Portal Home Page for Staff
Also introducing quick access to software setup, key IT personnel, announcements, and upcoming events. This help staff understand what tools are available, who can help, and what is happening across IT.
Supporting the Broader IT Journey
The homepage also features announcements, platform updates, and timely industry topics, giving staff a reason to return regularly and stay informed about changes that may affect their day-to-day work.
Keeping IT Information Current
Meanwhile, the IT homepage view I designed provides a quick operational overview of equipment status, active incidents, and current checkout activity, giving IT staff immediate visibility into what needs attention.
IT View of Operations
IT View of Operations
IT View of Operations
The dashboard also surfaces urgent operational statuses, such as overdue equipment returns and assets awaiting transfer, helping IT quickly identify and resolve items that need immediate attention.
IT View of Operations
Impact
The redesigned portal transformed disconnected email-based processes into a centralized self-service platform supporting employees, IT administrators, and leadership.
The project reinforced several lessons:
Understand business processes before designing screens.
Adapt to how teams work instead of forcing new tools.
Use AI to accelerate discovery, not replace design thinking.
Simplify workflows whenever possible.
Different users often need different experiences, even within the same product.