Air-Tite Products

eCommerce Website UX/UI
User Experience Design
UI Design
Front-end Development

Overview

Air-Tite Products has been supplying the Veterinary, Human Health, and Laboratory market with high quality disposable and reusable hypodermic products since 1926. The company had used its public website to market, sell, and fulfill orders using the ASP .NET Storefront CMS. In late 2018, following a dedicated User Experience and discovery phase, we worked with Air-Tite to fully execute on their vision to redesign their website and delivery a more user-friendly, modern, and satisfying e-commerce experience.

There's something enormously gratifying about seeing a project through from inception to launch while maintaining a pivotal role the entire way through. Traditional agency workflows aren't particularly conducive to this idea as deliverables typically are thrown "over the wall" in hopes that the next team will preserve the intended experience.

The Air-Tite website redesign was a refreshing experience as it not only allowed us to continue the UX strategy work conducted in the discovery phase but also to keep that momentum and involvement all the way through to the website launch.

  • Developing mood boards to define overall visual design strategy and style guidelines
  • Preparing initial home page mockups and revised to arrive at a final visual design concept
  • Creating designs for 25+ screens, extending the final visual design to a variety of static and dynamic screen types, including tablet and mobile responsive views
  • Building the complete set of HTML/CSS/JavaScript templates to power the approved visual design
  • Liaising with ASP.NET Storefront developers to integrate the HTML templates and wire presentation layer into the back-end

Engagement details

Another significant part of this engagement involved resizing and editing of close to 3,000 product images to ensure consistency in presentation and quality... and then creating thumbnail versions for each of them.Of course, we automated much of this through Photoshop Actions, but the process gave us a greater appreciation for the importance of image fidelity and continuity for product catalog imagery.

Similarly, iconography plays a vital role in the new Air-Tite website. Part of the mood board exercise involved exploring icon families and once complete, defined a consistent style for use site-wide. These icons aid primarily in differentiating the extensive library of product categories carried by Air-Tite.

Toolset

Axure RP
High-fidelity prototyping
Sketch
User interface design
Webflow
Frond-end development

Explore our other work

AbbVie Science
Website UX + UI
General Motors
Digital storytelling
FM Systems
B2B eCommerce Websites
HealthCraft Products
UX & conversion audit
Western Archrib
B2B Website
Rezitrade
B2C Fintech
Capstone Copper
B2B Website
Sagetap
Product Design
Equisoft
Design System and Workflow Strategy
Canadian Dental Assocation
iOS / Android Mobilie App
Corteva Agriscience
Brevant & Pioneer Web UX Audits
Canadian Association of Defence and Security Industries
Marketing Website UX + UI
Split Software
Product design
First National LP
B2B/B2C Website
American Society of Clinical Oncology
Association/Healthcare UX Strategy
Carta
Product design
TrueIQ™
Social media monitor app
FedEx
Heuristic UX Audits