Project Specs:

Client: Stahls’ – the leader in heat transfer vinyl and heat printing technology.
Type: Ecommerce Website
Software: Adobe XD

  • Team Lead
  • Research
  • User Experience (UX)
  • User Interface (UI)
  • Prototyping
  • Design QA

Project Details:

To redesign the search on so that it first functioned as it was intended, and two, make it more useful for users by separating certain content from each other.

We determined that if we could find a solution that worked for this, this would significantly reduce our bounce rate and hopefully increase sales as well. It would also help customers find with better accuracy what they were searching for — whether that be products, support docs, or something from our massive education section.

Search Pre-2020 Redesign

At some point in 2019, we realized through numerous customer comments that the search had become very unuseful. Something had caused it to break. So, we took this opportunity to fix it and reimagine how we wanted this to work.


SID Search Results Pre-2020 Redesign.

Search Results 2020 Redesign

One big complaint from customers is that they didn’t want to see blog posts and support pages mixed in with the products, making it harder for them to find what they were searching for. After some research into what Swiftype could offer — this was the engine we were using to power search — we concluded to break the products and the rest of the pages apart from each other in the results.

As you can see in the images below, we created a tabbed search result for users. This worked in the predictive dropdown that appears when you first start typing and on the search results page itself.


SID Search Dropdown Redesign — Default


SID Search Dropdown Redesign — Help and Support


SID Search Results Redesign — Product Section


SID Search Results Redesign — Help and Support Section

UI Interaction Demo: