Introducing Jutro
By: Jason J Hill
Tags: Insurance, Design, Design Systems

Introducing Jutro

What is Jutro?

What’s in a name? Jutro is the Polish word for the future, but for us it means modern, next generation user experiences for the world of property and casualty insurance.

Jutro is Guidewire’s design system and UI framework for building products and digital experiences as part of the Guidewire Cloud Platform. The goals of the system are to increase the usability and consistency of Guidewire’s next generation products. Built on years of domain experience, Jutro enables our customers to design useful and useable digital experiences while leveraging the power of the Guidewire platform.

We know the challenges of designing and developing good user experiences. Our design system and UI framework help product teams to design and develop more efficiently and create consistent user experiences. We share our internal best practices with our customers so they too can accelerate digital experience development.

A little history

Guidewire Software was founded in 2001 as a software provider for property and casualty (P&C) insurers. The company has undergone many transformations, building out their product suite from the original core systems, expanding into the global market with offices all over the world, and evolving from an on-premises delivery model to software as a service. Fast forward to today, and Guidewire Software, Inc is a global organization with 21 offices spanning 15 countries.

While Guidewire would be considered a mid-sized company, compared to say an IBM or SAP, that’s still a lot of teams developing product. As our product suite grew, it became increasingly more difficult to promote consistent experiences across applications. Enter the need for a design system.

Our path to design system maturity

Building a design system is not easy. The mountains of articles out there are a great place to start, but they can also cause analysis paralysis. First determine whether you need to create a design system from scratch, or if you can repurpose an existing one to fit your needs.

If I could give advice to any organization out there embarking on this journey it would be, “Just dive in and do it. Don’t be afraid to make mistakes, or even throw out the entire system and start over.”

Avoid pedantic debates on what defines a design system. Instead, define the goals of your system, its target audience, and your MVP. This will help you make more effective decisions as to where you should direct your effort. More importantly, you won’t be paralyzed with where to begin. — Christian Beck

In his article on design system maturity levels, Christian Beck points out that most design systems follow three overarching themes:

1. A focus on efficiency

2. A focus on consistency

3. A focus optimization

As your team grows and your design system matures, you’ll find the goals of your system changing as well. Similar to the way that organizations navigate the different stages of UX maturity, it’s not uncommon to find yourself stepping back a phase, or even being in two phases at once.

Guidewire Jutro was initially developed for our internal product teams, but we knew the system would need to grow and expand to serve our customers as well. We started like every organization, with style guides, design principles, and component libraries. Next, we began organizing our components into a pattern library, and that’s where we discovered an opportunity for a fourth theme: A focus on domain knowledge.

A unique value for a unique problem space

Insurance core systems try to accomplish a lot, but they all have one thing in common: lots and lots of data entry. The original applications were on paper and largely followed the same standard. When the first User Interfaces appeared, they naturally kept to the paper standard.

The P&C industry is all about risk, and much like any other financial vertical, there isn’t a huge appetite for innovation. So, 20 years later and the UIs still bear a striking resemblance to those original forms.

Right now, you’re probably thinking, “That’s an easy win. 20 years of UX/UI theory should have a huge impact on the usability of these screens.” That’s true for some best practices like responsiveness and for general principles like heuristics, but many of the UI patterns that have solidified through shared use of the web just don’t apply.

For instance, look at how the shopping cart/check out process has evolved through the years. Taking an object and placing it in a virtual shopping cart for purchase is much the same for giants like eBay and Amazon as it is for smaller players like Etsy. But you cannot buy an insurance policy that way.

The workflows and patterns in PolicyCenter draw on 2 decades of research and design work.

Insurance has its own set of patterns. Insurance products, like a homeowner’s policy or commercial property policy, range in complexity from very simple forms that could fit on a single page, to very complex forms that would take 30–40 pages if printed.

The steps for buying insurance look something like this:

Add a risk (like a home), add coverages (like wind damage), add exposures (like exposure to hurricanes and flood zones). These get run through an algorithm, unique to each company and product, and they produce the rate you pay for your coverage.

Complex products have more risks, exposures and coverages (and thus more steps), while simple products have less.

The discreet UI pattern for adding a home is the same whether it’s done once for a simple product, or multiple times for a complex product. We also see these patterns working the same whether they’re used in a quote experience, or an update to an existing policy; whether it’s in an app made for an insurance agent, or an app made directly for the consumer.

When you consider these patterns are used by all of our 380 customers across ten product suites (and growing), there is a tremendous opportunity for reducing design and development cost and improving user experience.

Enter Jutro business patterns

Pattern libraries are a collection of UI designs for common design problems. While component libraries focus on more granular pieces like buttons, chevrons, and individual styles, pattern libraries treat larger pieces like a slideshows, carousels, or navigation.

Jutro business patterns are a best practice library for P&C business flows. Rather than re-inventing well established patterns like the checkout process, Guidewire is drawing on its deep domain knowledge in P&C insurance to establish these best practices for industry specific patterns like adding a vehicle or home, filing an insurance claim, or updating a policy.

Guidewire UX has established a thorough design methodology to discover and define common user objectives. We then conceptualize a set of sequences and flows which are reviewed with subject matter experts to help us refine the wireframes and get them ready for final design and development.

We will keep you posted on our progress. Guidewire is working with its customers and partners to understand their needs as they build P&C solutions. With your input, our dream is to create a design system that is an invaluable resource for the entire P&C designer community.