SteriPodz Website
A product-led website for SteriPodz, bringing a clinical workstation, its everyday workflow and supporting information into one visual experience.
The case study follows the website design from information architecture and wireframes to the homepage, workstation, About and FAQ pages. The live website provides an interactive view of the project.
- Scope
- Website UX/UI Design & Front-End Development
- Deliverables
- Information Architecture · Wireframes · UI/UX Page Designs · Responsive Web Development · WordPress & WooCommerce Integration
- Project
- SteriPodz Website
Explore the live website in desktop, tablet or mobile view.
The brief
Make a specialist product easier to explore.
Present a technical workstation in a way that helps clinic customers understand the product, explore how it fits into instrument care and find answers before taking the next step. The design brings product explanation, workflow imagery, educational content and product calls to action into a coherent browsing journey.
My Role
Connect content, navigation and visual design.
Bringing together user experience, visual design and front-end development.
My role covered the end-to-end UX/UI design and front-end development of the SteriPodz website. I was responsible for shaping the information architecture, planning user journeys, creating wireframes and translating the product story into a modern, intuitive and engaging digital experience.
Beyond design, I handled front-end implementation using WordPress and WooCommerce, developing responsive layouts, interactive elements and custom functionality. My focus was to deliver a visually consistent, user-friendly and scalable e-commerce website across desktop and mobile devices.
My focus was the customer-facing website experience. The data flow diagram records a proposed system model; it does not establish that payment, order processing or training access has been implemented or validated.
What I personally did
Translate the product story into a browsable website.
From initial concepts and wireframes to a functional, responsive website.
I developed the website's information architecture, user flows, wireframes and high-fidelity page designs, ensuring a consistent experience throughout the homepage, product pages and supporting sections. I also established the visual direction, refined the product presentation and designed interactive elements that make the website intuitive and engaging.
On the development side, I built and customized the WordPress website, integrated WooCommerce product configurations, implemented custom fields and post types, and developed responsive front-end components. I also worked on animations, interactive functionality, performance optimization and the technical foundation for future e-commerce integrations.
From structure to page layout
The website pages
The workstation page gives the product a dedicated destination. About content provides company context, while FAQs give practical questions a separate place in the journey.
The thinking behind the work
Explain the product before asking visitors to act.
Build the story around the customer’s questions
The homepage introduces the workstation in context, then moves into product details and the instrument-care workflow. This gives visitors a way to connect the physical product with everyday tasks before exploring supporting resources or a product destination.
Separate experience planning from implementation
The information architecture groups product, benefits, workflow, journal and help content. Proposed routes remain marked as proposals. The data flow diagram then maps content, product configuration, orders and external services at a logical level, with optional training access explicitly left to confirm.
The impact or outcome
A connected product presentation, available to explore.
The outcome is a website experience with a consistent product story across the homepage and supporting pages, accompanied by structural documents that explain the design direction. The project can be explored through the live website and the original design images in this case study.
This case study documents the delivered design and its rationale. Conversion, usability and business performance have not been quantified here.