Numerify Platform: SaaS Tenant Management 

Agile Design Sprint.  UX, interaction, and visual design.

Spring 2016

Numerify is a SaaS Business Analytics product that focuses on bringing insights to the enterprise. The company has gained a lot of traction the last two years because of our highly crafted analytics and quick time to deploy. However, as the business grows, our backend user experience needs to improve. Our product is breaking into partner reseller markets and our customer count is increasing. The result is an urgent need to more efficiently deploy, manage, and monitor users of our product. Beyond our internal management, we needed to open up our backend platform to reseller partners and enterprise customers as we scale to the next level. 

I joined forces with our engineering team to start the process. To begin, we set out on a 2 week design sprint to tackle the tenant and user management portion. This includes the handling of tenants, partners, groups, users, and privileges. 

What it look liked before

On day 1, the engineering team showed me the functional app they had recently built. The functionality was very restricted, but it worked. The style was very plain, and there were quite a few UX flaws. It could do very basic things like add or delete users, but new demands had arisen. One of my biggest issues was that the hierarchy of information was unclear as monotonous list views persisted throughout various screens. I applaud the team for whipping up a working prototype so quickly, but the UI needed a fresh start. Nonetheless, it would serve as a reference point for myself and a technical foundation for the dev team.

Defining Goals: Design to scale our business... and quick

After a couple of conversations with some external stakeholders and our engineering team, it became clear we needed alignment on our information architecture. The project had quickly gone from simplistic user management to phase one of a large scale platform management system. Gathering information from requirements docs, standup meetings, and slack conversations, I took it upon myself to visualize and document our thinking. I've always been a big fan of creating visual UX docs from the get go, and this project was a prototypical use case. They're a fantastic way to quickly get everyone on the same page.  

Sketching: A functional workflow with unique delight

Now that we had established the architecture of tenant management, I started sketching a variety of screen styles and flows. One goal was to move beyond static listings without sacrificing performance. This led me to a flexible card based style that would allow an abundance of interaction paradigms. In addition, I discovered the app needed to accommodate a tenant view that drove actions through measurable insights such as usage analytics.

Wireframes

These wireframes show the flow between managing organizations, groups, and users. They also clarify the commonalities and differences between how the system behaves for Numerify users, partner users, and tenant users. Next, the wireframes helped me dive into the details about where interaction elements should be placed on the screen. 

Final Design and Implementation

These are some of the final screens that shipped as phase 1 of the platform management system. I worked very closely with our developer to iterate and explore UI components to ship the product quickly. We leveraged Google's Angular Material framework. Angular turned out to be a very scalable framework for us. It aligns with my design principles for Numerify branded products and provides reusable components for the development team.