MarkMonitor Domain Advisor: When services are your users
I’ve done many projects over the years for MarkMonitor– they have been a very long term client. This project was the first I executed working remotely from Canada. MM’s brand product team was for a long time lukewarm to the idea of spending time and money on testing, but the domain group was much better attuned to it. They also happened to sit next to the principal product users in their services team and know them very well.
The project started out of a desire to provide a quick flow to suggest a domain strategy. It evolved into something different, largely out of discovery made thru user feedback.
Initially we thought this might be a mix of domain services folk and end customers. After talking with both customers and domain services people a different picture emerged:
Most of the domain clients looked to MM to provide white glove service in response to a short email, call or text. Even though some of these were the largest and most sophisticated tech companies in the world, most of them took a delegation or executive attitude/stance. CSMs would then use this app to create a proposal to share with our ultimate clients. Its not uncommon in enterprise software in a blended service/product offering for services to do this.
Before we identified it was only gonna be CSMs, I produced some proof of concept ideas and a quick protocol, principally in PowerPoint, so they could be tested by the Boise staff. These mockups helped to hone in on what we wanted to do and led to the next concepts, essentially a large table, linked via a search and a possible summary screen. Eventually this would morph into a single screen as there was no good way to express the concept of a narrative flow and land on such a heavy page.
Initial testing sketch
the first flow we tested, to get an idea of response involved two steps: a user entered a domain name and suggested a purpose. we then generated a list of ‘essential,’ ‘protection,’ and ‘presence.” The team had enough data about how clients registered domains for different purposes that we could reliably make these suggestions. Many times I would sketch using business tools like powerpoint, which enabled Product Managers(PMs) to test.
We learned two things from the first sketch:
- Our clients really preferred the personal attention of having one our people prepare and walk-thru a quote.
- Clients were accustomed to seeing a full sense of the landscape: how much country coverage is available? Are there any possible trademark fights? questions like that. They also liked to ask about a bunch of domains at a time.
- Finally the engineering team did not feel 100% confident they had enough data to pull off the recommendations. People talk a lot about things like machine learning, but machine learning requires substantial high quality input data to train well. So it would likely resemble a different sort of modelling or system.
Second Stage: The ‘GridWizard’
Sometimes you arrive at a place only after trying other things. The grid wizard attempted to sandwich this new project into the existing UI (which I had not yet had the to go ahead to work on) So it sat half narrative, half ‘one-page-app’ but with some big grid elements in it. It attempted to preserve some of the advisory nature of the early mockup thru a middle ‘recommendation’ page.
Snaps of prototype used to test the ‘gridwizard’
The pure grid
We learned many things from the second round. Chiefly among them:The wizard structure ended up becoming awkward, and the services people really wanted to jump thru to the last page. Product managers often like to create data display as a kind of visual theater, and it frequently gets in the way. This really directed us to variations related to the 1 page app. Note the grid still shows grouping at this point and uses visual filters at the top. We kept a form of the visual filters… essentially the advisor boiled down to a one page app, focused on streamlining life for services.
Visual refinement, initial engineering implementation
After settling on a final flow. I took the wireframes and worked up a slightly higher fidelity visual mockup, at which point the product team got things into stories and started building. The brand side of the business was in the midst of a major redesign. I wireframes much of it, and our visual designer worked up a new look. The pics below show that hybrid.
As soon as we got close enough that we could test the engineering prototype we did. It exposed a number of issues related mostly to the cart and whether users figured out how to add things in. There were some additional issues surrounding filters and grid control. We initially presumed users might shape data using the excel style controls built into the grid component. Those controls worked poorly in practice. They were hard to discover and did not provide very good context. As a result we did a number of iterations around visual filters and guidance at top.
In late December of 2016 we shipped a beta to get feedback. In general we had a positive response but with some key things to change, notably the grouping for save, edit and export. I mocked up some ideas, but we did not get around to testing.
A quick aside on grid density
As part of this project we did a a fair amount of experimentation with grid density. Many modern web designs use very generous white space coupled with sometimes lower contrast type. We found that although many of the users liked the ‘clean’ look, they actually preferred much tighter rows and higher density. As a result we arrived at the current sizing which falls somewhere between something like Excel that’s very tight and something like Gmail on “cozy.”
Just before advisor shipped another project I worked on, a css restyle of domain also shipped. This is what the current version of advisor looks like. The green buttons and deep blue follow the colors our visual designer established for the company’s other offerings.
The users we ultimately targeted were very happy with how things turned out. Part of this came from the core product, and part from aspects of the design such as the discoverable, visual, filters. The final result delivered by engineering is not pixel perfect in its handling, but does represent the core design well.