Dispense-Rite

Website Design & Development

Dispense-Rite is a third generation family owned business that produces quality cup dispensers and other related products for the foodservice industry.

The Situation

  • Dispense-Rite needed a new website design that made it easy for customers and potential customers to locate product information.
  • Dispense-Rite also wanted its new site to accurately reflect its brand with a more modern look and feel.

The Solution

  • Northwoods took Dispense-Rite's existing brand identity and adjusted it for the web with an emphasis on information architecture and online catalogs.
  • Use of Titan CMS, an enterprise content management system powered by Northwoods, permitted easy implementation of filter blocks, making it easier for users to search for products.

 

Homepage Design

The banner image at the top of the page depicts the inside of a convenience store, giving users a better understanding of how and where Dispense-Rite’s cup dispensers are used. 

The actual cup dispenser product images are layered on top of the banner image and even hang a little below to add additional contours. This helps to break the boundary of the hero image, which draws the user’s attention. 

The product imagery also breaks up the normal square or rectangle shapes typically found in web design by using transparent backgrounds, which creates more interesting shapes throughout the website while maintaining clear content organization. 

Overall Website Design

The simple color palette of black, grays and white makes the addition of red stand out as a prominent way to indicate calls to action. Any element in red, whether a button or link, is immediately identified as clickable to the user.

The stainless steel pattern provides a shiny, smooth texture to help tie the design back to Dispense-Rite’s manufacturing roots. It’s a versatile and simple background that doesn’t distract users from the content. The pattern also integrates well with the website’s color scheme and stainless steel products.

The product detail page improves usability by listing all product specification headers on the left-hand side of the page for easy scanning, as shown below. Users are able to quickly identify each section of content to find the information they need.

The product detail page also gives the user enough information to take the next step in the process, whether that’s searching for related products, downloading product-related resources, or finding out where to purchase an item.

The Outcome

  • The layout of the product detail pages makes it easy for a site visitor to make an informed purchasing decision or access needed resources.
  • The web user interface (UI) creates a better user experience (UX) for users who can now more easily navigate the site and its content.

hand-drawn owlContact Us