Markmonitor
Transforming the SSL Certificate management experience.
MarkMonitor, now part of Newfold Digital, is a top provider of brand protection solutions since 1999. They offer services like domain management and anti-counterfeiting to help businesses protect their brands online.
My Role
Duration
UX Design
UX Research
User Flows
User Testing
User Interview
Design System
6 months
Team
2 Full Time Designers (100%)
Figma/Figjam
Tools
Dovetail
1 Part Time Designers (50%)
Platform
Angular/AG Grid
The Problem
Individual Users (IUs), or clients, want to independently manage their company's domains, including research, purchasing, and transfers. However, IUs often rely on Domain Portfolio Advisors (DPAs) for these tasks, defeating the platform's purpose and hindering DPAs from providing advisory support.
Our Approach
Conduct User Research to understand users’ pain points with current portal as well as their needs and goals.
01
Refresh Markmonitor’s GUI for a modern look by creating a Design System and Style Guide that will be used throughout the redesign.
02
Utilize Continuous Discovery to frequently gather feedback from users to improve the portal.
03
01
Discover
User Interviews
The conversations with the targeted users validated their difficulties that were assumptions. The most mentioned challenges are:
Users are not aware that they can order/renew certs on the portal.
“I don't see anything, that I can do here [Portfolio/Certs] to submit a certificate...just emailed to a rep and asked him generate a new certificate for us and after that I just renew it.”
Ordering Certifications is a time-consuming process.
“I have to go through several pages...in order to complete the process where compared to [Digicerts] I can just go in and in one page, I can just go all the way down and submit.”
Having 2 lists in Domain Management and Hosted Services to manage is frustrating.
“In most cases, I have to go to Domain Management to find out if we own the Domain and then go to Hosted Services to actually manage it, but the lists aren't the same. “
Common Insights
User Personas
Based on our interviews, we analyzed the insights and developed personas that addressed their shared pain points, motivations, and goals.
02
Define
Styles/Journey
Determining the Look and Feel
Style Tiles
After identifying user needs, goals, and pain points, we established the styling for the new application. We employed the 20-second gut test to grasp the stakeholders' vision, which influenced our development of style tiles.
Visualizing the User Journey Path
User Flow
After deciding on the solution, we mapped the detailed steps a user needs to take to order multiple certifications, which is the core task of this app.
03
Develop
Wireframes/Testing
Exploring Ideas
Lo-fidelity Wireframes
Based on our findings from our user interviews and user flows we were able to start ideating lo-fi wireframes while reviewing them with our stakeholders to validate their organization flow.
Gathering Feedback
Usability Testing
Through 2 rounds of usability testing sessions, we validated our assumptions and made adjustments based on the user’s feedback. Here are some of the key findings:
Adding Style
Hi-fidelity Wireframes
Based on our usability test findings as well as the defined styling we were able to iterate on the mockups and perform a second round of usability testings.
Solution Feedback
Final Findings
Through our final usability testing session, we were able to test and compare the completion rate for our primary tasks. Here are the results:
Task: Order New Certificates
Lo-fi Testing
20%
50%
Hi-fi Testing
100%
100%
Task: Renew a Certificate
04
Deliver
Documentation
Developer Friendly
Organization
Since we weren’t able to work with developers early on, we made sure to document each element and notate what the actions or requirements were.
Specifications
Labeled Guidelines
After deciding on the solution, we mapped the detailed steps a user needs to take to order multiple certifications, which is the core task of this app.
Consistent Elements
Design System
We wanted to ensure that styling and the structure of each element was consistent across all our designs so we worked with developers to land on using PrimeNG and AG Grid as our main libraries.
Introducing Newfold
Final Product
Manage your organization's information and customize your contact list as needed. Check the history log to review the interactions for your organization.
Manage Organization
Order one or multiple certificates through the order flow. Here a user can use a domain name or a CSR code to start their process and follows through three main steps to confirm their purchase.
Order Certificate(s)
Browse your current certificates and make any necessary changes. Decide whether to edit, renew, reissue, or download your certificate.
Review Certificates
Reflections
Key Learnings and Takeaways
It's crucial to validate assumptions and ensure that design decisions are beneficial to users. Common design patterns might not be appropriate for every situation.
Usability Testing
Developer Engagement
Facilitating collaboration between our team and the developers was challenging from the start. Involving them with users early on would have led to better prioritization and organization.
Indirect Research
Given the niche market, analyzing direct competitors was challenging. By adopting a more unconventional approach, we could have validated more assumptions by researching indirect products.