Web / UX

National Title Insurance Website Design

Overview

Modernize and standardize: two things I love to do.

In tandem with a project to reconstruct a popular net sellers calculator for a national title company, I was graciously awarded the proposal to design their new website for their corporate presence. It was an opportunity to invest further in defining key components and styles that matched not only their new branding and calculator application, but now also their entire online presence. This also trickled down into 11 other sub-brand sites, where the design I crafted would be utilized for each (via WordPress child themes), minus specific content and imagery.

I walk through my process steps below, and present the final screens for the primary website at the end.

Note: de-branded until build of final design is complete and launched – the company is not called National Title!

Project Intention

Modernize and standardize

Like I say above, this was the most important part of this project. Bring things up to modern web standards, align visual aesthetic with other new brand efforts, and enhance/evolve function as much as possible within scope.

Update what exists

With content predominantly staying the same, outside of newly-crafted content areas, I focused on enhancing and beautifying much of what was already there.

Align with the brand vision

There was an updated approach to the way the brand handled digital pieces, so I adhered to these expectations and ensured that typography, colors, containers, icons, gradient usage, and image effects were consistently handled.

Flex for standardization

Since the intention was for this design and structure to be applicable to all 9 of the primary company’s sub-brands websites, it was critical to build with flexibility in mind, without oversimplifying and losing the impact of the updated branding.

Starting with sketches

My efforts always begin with sketching, in some capacity. Writing ideas, goals, challenges, and key points, alongside of sketching potential layouts, is critical to my process for hashing through the most optimal options.

Partial concept of the homepage layout with notes

Smaller partial of hero area layout exploration

Gather user data

While I had been maintaining and working alongside this client for some time and therefore understood much of the user action and dissatisfaction points, I didn’t want to assume anything. I implemented anonymous screen recording software for behavior analytics purposes, which allowed for me to evaluate each screen’s successes and failures, as well monitor a variety of different user’s interactions as they perused the site. This gave me much more fuel for my future decisions.

Heatmap click tracking

Anonymous screen recording for analysis

Utilizing Google Analytics for technical visit data

Challenges

Seeing the finished piece

The result was a polished, brand-adhering upgrade in a multitude of ways. I crafted approach with a comfortable structure, but not so comfortable that it feels like “any other site”. This met the needs of the client impeccably, as their audience base was diverse in their technological comfort level, and many were used to the existing website. Pain points were ironed out, content hierarchy and readability were improved via clearer grouping and improved text sizing, and general aesthetic was amplified to represent that of a professional, high-end national brand.

Closing Thoughts

The result of this project was a success, for both the client and myself. We had achieved a successful conversion from 12 existing, disjointed websites, into a newly-minted WordPress Multisite installation, branded to fit within the parent brand, and make it easily manageable by their internal team. This included:

  • All 12 sites shared centralized data for location and contact information
  • Shared styles via child themes allow for global visual modifications in a snap
  • Visual styles received the overhaul they needed, and matched the most current version of the parent company’s brand

If I had the opportunity to walk through the process again, there are a few areas that I would approach differently:

  • Shift away from the Sage-based theme structure that we built the initial theme on, as it ended up creating some additional complexities with installation structure and migrations. We created a proper workaround for this, but adhering to a more core WordPress theme structure would have yielded a smoother process.
  • Step through additional agent-based user testing, reaching out to a wider audience of the agents who work with the company, and that use this website, to ensure navigation and available features matched expectations. While we did review a series of qual/quant testing data, it was limited in scope due to timing and deadlines. Further data diversity would allowed us to validate our decisions further.