Trimble


The client

Trimble is an international leader in GPS technology and advanced positioning solutions. Its products are used in over 150 countries around the world. Trimble serves a variety of industries including agriculture, engineering and construction, transportation and wireless communications infrastructure.

Overview

Trimble’s brochureware websites were due for modernisation with requirements that included creating a responsive design that would be easily accessible and adaptable across six different translations including German and Chinese and a variety of industries.

My role

As the UX/UI designer it was my responsibility to conduct research, create designs for a new responsive website and implement the foundations for a design system that would be easily adapted across multiple sites.This included, but was not limited to:

  • Competitor analysis
  • Analysis of Global Design Systems (GDS)
  • Stakeholder interviews
  • Information Architecture (IA)
  • Wireframing
  • UI design

Working closely with the head of global marketing my role was to help accelerate their web program. This included putting the foundations in place for a design system that would be easily implemented across multiple sites and designing an information architecture (IA) to supply information to users whilst showcasing the company’s products and driving sales around the world.

The challenges

As the sole UX/UI designer on the project, I was working with project managers, engineers and offshore developers across multiple time zones, with different software. Time management and clear communication quickly became key assets to the work I was producing.

During the initial project talks it was highlighted that the time and budget for the website did not include interviews with the audience or conducting any usability testing. Without access to the end users, I had to look elsewhere to build empathy and learn as much as I could about them. This would include studying existing resources, gaining as much knowledge as possible from stakeholders and utilising analytics to understand how users were interacting with the current sites.

The process

I started the project by setting up a series of workshops and 1 on 1 interviews involving key stakeholders. This helped to familiarise myself with their roles, goals and expectations. During the sessions, we created an empathy map and journey flows so that we could visualise users flows and built empathy. After the interviews and workshops, I presented the outcomes to all stakeholders highlighting what was agreed as success and the approach to get there. This helped align the team and reduce friction as the project moved forward.

Wireframe sketches

Using the information gathered in the empathy mapping workshop and from pre-existing resources, I set about creating personas to represent the target market, helping guide our decision-making. During these early stages, I also analysed data from the current sites and completed competitor research to help build a more accurate picture and to discover industry trends.

ideation workshop

The next stage was to organise and facilitate a card sorting exercise. As direct access to the end users was not an option, I decided to involve stakeholders, utilising their industry knowledge to help inform the organisation of the new IA. It was also a great opportunity to keep the stakeholder’s engagement levels high as the project developed.

Style guide

As the project progressed, I worked on creating low-fidelity prototypes, using the personas to run through user journeys testing the structure of the site as best as possible. As iterations from the BAU project went live and data was gathered, I was able to incorporate the learnings into the new designs.

With the IA and wireframes heading in a good direction, I began research into creating the foundations of a design system. Working with the company’s print based style guide, I worked alongside a third party agency to build a pattern library enabling a consistent look and feel across the web and printed material.

As the project moved into a development stage I ramped up my collaboration with the third party developers and project managers. Supplying assets including the style guide, pattern library, journey flows, high fidelity designs and documentation required to support the development.

high fidelity designs

The outcomes

The first site (aggregates.trimble.com) went live four months after the end of my contract. With the site then being rolled out in 2 translations (German and Chinese) over the following year.

High fidleity design

The project was a steep learning curve. I gained valuable experience working with a third party agency, pushed my education to the limit and discovering new ways to justify decision making without interacting with the end user.

Looking back on the project I feel I could have progressed faster, allowing for more time on the development of the design system if I had reduced the level of detail used to explain early concepts. Even though I quickly learned the right level of detail needed to share ideas, time was lost losing stakeholders in the details of content rather than keeping them focused on the ideas.

High fidleity design

Over the following year the design was rolled out across different two further industries and included three more translations including Spanish, French and Portuguese. I believe this is a clear indication that end users are successfully interacting with the responsive design and that internal stakeholders are happy with the impact of the new site.

Picture of responsive designs

Recommendation

“Dickon was a great help during the course of this project and helped accelerate our web marketing program.”

Simon Rush, Global Marketing Communication Manager



Other projects