Skip to main content

TTC Modus Adoption Panel

Ewa Nowak
Ewa Nowak
Posted on May 27, 2021



Hello everyone,

We hope you had a chance to join the Trimble Technology Conference this year! On May 7th we had the pleasure of discussing Modus adoption at the TTC. We wanted to answer your question about how to adopt Modus, how long it takes, what methods some teams followed in the process, and what were the challenges and takeaways. Our panel consisted of the following members:

Marita Franzke | Moderator, Director of UX Design

Modus

Ewa Nowak | Modus Product Manager

Eric Gunther | Lead Designer, Trimble Maps

Adoption 1 (Small-Medium): Trimble Utilities, UTG

Laura Meskanen-Kundu | UX Designer

Jan Nyberg | Trainee, Software Development

Adoption 2 (Medium-Large): SketchUp Product Portfolio

Eric Bohn | Senior UX Designer

Mike Tadros | Product Manager

Adoption 3 (X-Large): Viewpoint Product Portfolio

Victor Solano | Global Director of UX CMS

Gabe Piltzer | Front-End Software Architect

TTC Modus Adoption Recording

Watch recording

The audience members had some excellent questions that we had a chance to address. However, we did run out of time and would like to answer the outstanding questions below:

  • How does Modus allow for our end customers to brand the products to show their branding in place of our color scheme etc.?

  • Modus does prescribe a set of colors to use in its components. It’s part of the foundational elements and what brings our look-and-feel together at the most basic level. Branding in name and logo is not determined by Modus but by the Trimble Branding Strategy. It would be best to get in touch with Tyler Barnard to learn more about that (Marita Franzke).

  • We’ve been struggling with typography in Modus… The weight/size distinction isn’t strong enough to create a clear visual hierarchy (ex H1, H2, H3, etc). Help!

  • That’s great feedback! Beyond weight and size, you can also create visual hierarchy by changing font colors. Modus is here to serve your product’s needs, and we are constantly looking to improve. We have improved the hierarchy from Beta to Modus 1.0. There were several teams involved in helping to better define typography. I would love to hear specific examples from your product. Please, contact me by filling out the contact form or scheduling some time during my office hours (Ewa Nowak).

  • Are you using any usage analytics with modus implementations or any plans to?

  • We are currently collecting basic Google Analytics on our site and monitoring it to understand adoption and site design issues (Marita Franzke).

  • We are also monitoring usage of elements in our Figma UI Kit and tracking Modus adoption by product. I will provide occasional updates during our monthly Engage with UX sessions (Ewa Nowak).

  • Can anyone comment on the complexity/practicality of migrating from Google Material to Modus?

  • I cannot comment on this, but the Civil Software team under John Stark has been doing this. I would contact them with any specific questions (Marita Franzke).

  • [We have had] some experiences of migrating an Angular application, which was using Angular Material UI components, which are based on the google material design. In this case we did a partial adoption, since we saw that we were using the features of the components to such an extent that we didn’t see the value of changing away from them at the time. Tables, accordions, tabs, checkboxes and radio buttons were mainly the components that we kept. The partial adoption was done in a time span of 2 months to this particular application and it has afterwards been able to follow the Modus style guide (Jan Nyberg).

  • Bootstrap works with any front-end stack. I’m interested to know why some of the panelists can’t use it?

  • Yes, Bootstrap does work with most front-end stacks. I believe the answer isn’t, why teams can’t use it, but why teams choose not to. One of the most important things to me as an architect is choosing the right tool for the job. The complexity in finding the right tool includes looking at many factors. Examples include… features, barrier to entry, learning curve, support, licensing, team experience, development satisfaction, third-party dependencies, performance, and many more. Bootstrap 4 has some technical limitations, design choices, and third-party dependencies that not all developers want to inherit (Gabriel Piltzer).

If you have additional questions, don’t hesitate to contact us.