PNWX redesign.
Pacific Northwest X-Ray Inc. is a healthcare company based out of Gresham, Oregon. They specialize in the sale of medical grade equipment and supplies to facilities that utilize them. Most of their sales are made through their website, which acts as their entire catalog. I was tasked with redesigning their site and creating a way for users to make purchases directly from the site.
Keeping the user in mind, I redesigned the steps one must take to place an order. Instead of filling out a form, I created a flow that incudes a product description page, an “add to cart” button, and a check out screen that allows the user to place their order and pay, all in one place.
I spent time drawing out wire frames of pages that would eventually be included in high-fidelity mock-ups. I made sure to consider the organization of their current site when planning out how their new site should be structured.
Creating the design system.
Before I could create a high-fidelity prototype in Figma, I needed to create a design system. Complete with fixed typography styles, color, and effect styles, these building blocks shown above, went on to inform the formation of the component library, seen below.
The redesign.
Using my research, wireframes, low-fidelity mock-ups, and new design system, I was able to build out a high-fidelity prototype of PNWX’s new website. I created both a desk top and mobile version — each are scalable, so they can be used on any device.
I redesigned each screen in the original check-out flow. For this prototype, the user is buying a protective lead apron. My design takes the user through each step, from the home page, all the way to the purchase success page. The user can now successfully navigate through the site, find the desired product, and make a purchase, without having to worry about printing an order form or using a fax machine.
