Mate Fertility

Mate is a consortium of fertility doctors making the path to parenthood less complicated, less expensive, and a lot more accessible, via an end-to-end, branded experience and a network of fertility centers run by top experts.

UX Design Consultant, in collaboration with Partners & Spade

Roles & Processes Included: Content Organization, Hierarchy & Affordances Audit, Design Patterns, Animation Prototyping

The noted branding studio Partners & Spade (P&S) engaged me to reconcile and bridge the original design intent of their branding process with their client, Mate Fertility. Important organizational elements had been lost in the journey from design to development and implementation, and I helped them to establish guidelines of how to translate their ideas into reality.

DESIGN PATTERNS & INTERACTIONS

‍Using the centerpiece of Mate’s site—the “Services” page—as the testlab for new ideas, I explored a number of strategies for finessing their current menu dropdown patterns into something more fluid, and, ideally, simple.

I translated and tested these pattern updates into their responsive mobile setting as well. I, P&S, and the client all preferred the fourth, text-centric option for both desktop and mobile.

PREVIOUS DESIGN

NEW DESIGN OPTIONS

PREFERRED DESIGN

The site’s buttons also presented standardization issues, and I proposed simple dimensional requirements to be maintained site-wide. (Shadows added here for clarity.)

AFFORDANCES
‍
‍A fairly sprawling landing page distributed a number of key calls to action down a long scroll, rendering potential conversion opportunities somewhat obscure. I proposed the inclusion of several of these key features within a sticky header, as well as relocating the menu there, keeping them close at hand to the user as they explore. I also proposed lightening the header’s presence, diminishing its heavy, brow-like quality, and a logo reconfiguration and relocation.

HIERARCHIES & ORGANIZATION
‍
‍Content hierarchies, organization, and spacing needed reassessment–including headers, fonts, bulleted lists, etc.—in order to maximize the site’s clarity. I established a system of modularity, and I specified standards of conforming to that system moving forward (and reworked a dropdown design pattern, which I will discuss later). Again, we used the centerpiece of the site—the “Services” page—as a proving ground for new tactics, and I later applied the established logic to other areas of the Mate site.

I also audited the existing footer for copy and organization, shuffling and augmenting as needed based on optimal practices for footer content testing varying locations of the call to action and other elements. I recommended to the client future user testing for these locations, as well, should the project scope allow it.

Existing body copy text presented exhaustive, excessive amounts of information, creating significant visual noise and risk of user bouncing. I established a hierarchical system of nested content, drawing the user in to the level of engagement most appropriate to their needs without overwhelming them with information. (I also advised eliminating the redundant and distracting “explore” sticky menu.)

ILLUSTRATIONS INTEGRATION
‍
‍Mate and P&S commissioned original artwork for their brand that evoked a calm playfulness without overtly referencing the fertility process, but in its implementation they expressed dissatisfaction with the its somewhat clumsy integration into the actual site’s content. I sought creative ways of thoughtfully weaving in these beautiful illustrations in a more fluid manner, rather than merely a bullet point stand-ins and filler content.

COLOR STUDY
‍
‍And finally, P&S requested three additions to the previously-established Mate color palette. I treated this as an opportunity for a quick guerrilla user test, and I constructed a fairly broad selection of options based on a spectrum color theory principles, creating a coded matrix of possibilities to present to the P&S team and the client (and selecting my own, top-secret preferences, shown to the right). The jury is still out on the final selections.

MATE COLORS

MATE + MY PICKS

WHAT'S NEXT?
‍
Partners & Spade will present the above work to their client Mate, as well as the developers building the site. Ideally, we would continue a dialogue into how we might maintain standards for the client to continue to populate their site independently moving forward, while avoiding the myriad issues described here.

Additionally, I made recommendations for identifying quantitative data that might suggest potential areas for user testing in order to increase conversions and overall stickiness of Mate's web presence as their brand grows.