Design Strategist & UX Specialist
houghton.jpg

Houghton International

UX & Visual Design Direction

 

Houghton is a 150 year old global company. They develop cutting edge fluids for the manufacturing industry. I directed the user experience and design teams working on the relaunch of their multi-lingual, responsive website.

 
pexels-photo-300057-1.jpeg
 

Leveraging a visual exploration exercise with the Houghton stakeholders, we identified an initial concept, tone, and color/imagery application preferences for a design approach. This helped align thinking on design as a group upfront.

 
 

Once discussions around the visual exploration were complete, we designed a style tile board based on feedback. We presented the board to the Houghton team and discussed. This step helped to illustrate how design choices materialize in a visual way. It also introduced the concept of a component design system for the site.

 
style_tiles.jpg
 

Meanwhile, the UX team worked with the stakeholders on an updated sitemap and IA. There was a big push to highlight their product line, so that was given primary focus in the approach. 

 
houghton_ia.jpg
 

We produced various detailed wireframes which covered each screen template (including expected interactions). I encouraged the designers to add notes when and where appropriate. 

 
houghton_wireframes.jpg
 

At this point, I had UX and visual design converge thinking to fully establish the look and feel of the site. We assembled everything and presented to the Houghton stakeholder team.   

 
houghton_home.jpg
 

We received an overwhelmingly positive response to the design and only needed to adjust some minor elements after review – A testament to sharing the creative journey with the stakeholders. 

 
translation.jpg
 

How multiple languages would render in the design was a consideration from the start. We prototyped areas of the site and tested various languages along the way.  

 
hougton_ui_kit.gif
 

Once the initial sample design screens were approved, we built a full component library for desktop and mobile screens. We were already moving quickly with front-end development and final approvals on design occurred in the browser.

 
happy_client.jpg
 

The client was very happy overall with the project. The approach to isolate the product navigation as a global element was particularly effective for how users want to interact with the experience.   

 
qa_process.jpg
 

At times, projects come along that cause you to re-evaluate and improve your communication processes. My development counterpart and I took shortcomings identified in our existing process as an opportunity to better formalize our QA framework.