Johnson Matthey
A new corporate website for a global leader in sustainable solutions
Johnson Matthey is a global leader in chemicals and sustainable solutions. Originally a British company with a over 200 years of heritage, applying unrivalled scientific expertise to enable cleaner air, improved health and the more efficient use of our planet's natural resources.
Johnson Matthey asked us for a much needed digital make-over. The company had dozens of outdated websites, that were hard to maintain and didn't spread one unified message they would like to put out there. They asked us to completely overhaul these websites into one, appealing global website.
Since all the information of the company was scattered around the web, there was a big task for UX (me) to come up with a improved information architecture that would provide in company and product information.
+100 hours to structure a new product catalogue
My role
Medior UX Design (Dept)
Project type
Corporate, commercial website
Team
Ferry den Dopper, Tiago Nascimento
Year
2016
Johnson Matthey provides in thousands of chemicals and technologies for basically all the type of industries out there. One of our goals was to make all of these products available on the new website of JM.
It was a big challenge. The products of JM are used in the start of the product chain and therefore not something us consumers usually run into. To make it a bit more challenging, all the products and scarce information were scattered on more than fifty out dated websites and JM didn't have a system to order and maintain their product information. So, it was my job and challenge to create structure and order in the way products are sorted and presented.
Lucky enough I did get a lot of time to do a proper desk research. By investigating and reading about all of their product types I could start the puzzle of the information architecture. Also by talking to product owners, marketeers and customers I could better understand the (context of each) product, which made it all a bit easier.
After many hours of puzzling and many iterations later I came up with a structured product catalogue that was consistent enough to apply for faceted navigation and faceted search (which I will tell you more about later). To ensure it fitted the industry standards, we checked each product segment with some involved customers.
Designing faceted search and faceted navigation
With only a structured hierachy of products, I knew this would be not enough for people to find their products. What was needed was some kind of mechanism that would help them find a products coming from different directions/perspectives. What I came up with was a faceted navigation and faceted search that could even be used by the most unexperienced customers.
For this to work I needed more than only the structure of products. I also needed a taxonomy to order all (important) facets of products. This way people can find products by application, family, raw material, market, production process etc.. And for us to design the right components that were needed to show the right product information. For this I needed the help of product specialists of JM. Together we created the taxonomy for more than 2000 products.
Once we got a grip of the taxonomy I knew what to work with and I started wireframing the concept of faceted navigation and faceted search. Faceted navigation we all know from webshops. Products are organised by price category, color, brand etc. So this was pretty easy, since the patterns already widely exists. The hard part was designing the faceted search. Consistent logic and behavior was needed to design a working faceted search. The search should recognise specific user input and give suggestions along the way. If you for example type in 'catalyst', the search will ask you what type of catalyst you're interested in. This could be an 'emission control catalyst' used in exhausts, but it could also be a catalyst used in chemical processes as a 'catalyzer' for a chemical reaction to take place. As you can see, two totally different products and appliances, but only one keyword.
Unfortunately due to budget constraints the faceted search was never build and released in it's full glory.
A lot of work went into the design and build product catalogue. But also the rest of the website needed to be designed. Fortunately JM understood that not all the information of their fifty old websites should get a place in the new website.
By analysing the web statistics we came up with a clean and simple site structure, with only a few pages to tell the story of JM. An important part of the new website was a separate market section. This section explained per market what role JM can play and how a manufacturer could benefit from working with JM and its products and services.
JM had one final request. Please make it really easy for customers to find the right contact related to a specific product, service or technology. This meant contact information should be provided dynamically based on factors like time and location, so (potential) customers are always able to reach out for contact with the right person. Therefore we designed a system of contact components which are automatically updated by the system based on time and location. Customers were now ensured they got a fast and relevant reply.
UX for the rest of the corporate site
 |  |  |  |  |
|---|
Looking back
This project will be remembered by me as the project where I spent more than a 100 hours on a product catalogue alone. It was very challenging to merge 50 products catalogues into one without knowing most of the products in advance. A whole new world of chemicals and production processes emerged to me, and it was awesome to learn so many new things. It showed that I have good analytical skills and as a UX person that's something to be proud of.
With the help of Ferry and Tiago we were able design a thoughtful website that looks amazing. For JM this was a major step forward and I'm happy we could help in such a good way.