The first of three dominos
In the first phase I was charged with increasing the rate our new signups made it to “Stage 1”. This is when new users upload a form to use on our mobile forms apps. Once this got rolling, it expanded across our entire platform and into two more large-scale design phases laid out below.
Timeline: Early 2016 to 2017
I redesigned our web platform used by thousands of businesses in over 170 countries. The new experience boosted our onboarding metrics, first impressions and brand perception. The design language and patterns implemented here are being used to design several new critical features that are actively in development.
Over the past 18 months, I've helped strategize, document, QA, prototype and design a ton of new features for:
- Enterprise web application
- Marketing site redesign & development
- Windows 10
Creating consistency across a platform of this scale has been a difficult, yet rewarding challenge.
Starting a User dialogue: The missing ingredient
One thing we’ve been light on at GoFormz is user development. We have a handful of massive clients that garner the majority of attention. I consulted with our engineering and support teams to address the multitude of dead-ends one by one.
Our account managers put me in touch with a variety of accounts at varying sizes who completed surveys about topics like:
- Pain points
- Wishlists for improvement
This was one of the most constrained projects I’ve been involved with from many angles. We had timeline limits, dev team availability to negotiate and technical hurdles replacing archaic web frameworks.
Tidying up a bit
I spent time truly understanding what was off limits, so we could leverage our bits of freedom as much as possible. I consolidated much of our primary and secondary navigation to provide more focus and eliminate redundancies.
Ideas & Concepts
Our app was very sterile and dated. It hadn’t seen much usability updates since it was launched a few years prior. We knew we wanted to weave in some personality and modernize our interfaces beyond the typical table-based enterprise software tools. Due to our constraints, we had to stick with most of our app organization and data structure.
I discovered that we were collecting several data points that had business value that we were never surfaced to our users. After negotiating all the known limitations, I began working through content and initial onboarding flows and finding ways to increase value, as well as usability.
Phase one: Increasing new user form upload
We’ll keep the “before images” small, because - well – they’re not great.
Sketching out concepts
It wasn't realistic for us to use video at this stage, especially since the UI was mid-redesign. So the second version was our clear path forward.
The new welcome mat
Our primary goal here was to make it clear what a new user on the web should do. Secondary to this, if they didn’t have a form to upload handy, we gave them options to still demo our product and discover valuable features. Our final focus here was to make it clear that help was at the ready, and to insure that they had our mobile apps installed.
Forms Activity & Form Builder
Forms Activity View (left)
The Forms page is where you interacted with forms you had access to as they were in-progress or completed. Think of this like an activity log. So a form status, tags and other meta information is critical, and now much more visible in our new layout. We also removed several redundant UI elements to reduce cognitive load.
Form or "Template" Editor (right)
Our Template Editor is where you create master versions of your forms that will be filled out on devices. Our hands were tied here in many ways, but with some basic layout principles, hierarchical adjustments and contrast updates, we were able to really lighten up the complexities of this interface. We were also able to reorder and regroup many of the tool groups for increased efficiencies as well.
Upgrading your plan
We have a plan for every sized business, so we needed to work on making it more clear which plan was right for your team. Our previous versions of this page were a standard features table, with dozens of redundant feature names that were very overwhelming to many users.
My proposal for this new subscriptions page focused on what you gain by increasing your plan tier, and removed the need to sift through tons of little checkmarks in a table
Phase 2: User Management
While our engineering team was waging war against old web frameworks, I turned my attention to a few new major features like User & Group management, SSO and a no-code workflow builder.
These were entirely new properties that had contractually bound timelines, so it was a hustle to say the least. Myself and our product team gathered as much input and documentation as possible to help our larger customers who needed these features to succeed. Our chosen RBAC user management model was well documented, so I focused on clarity and implementing a design language that could accommodate any org chart and any combinations of user or team level permissions.
Quick sketches to account for everything
Phase 3: Workflow Creation & Management
This project was nothing short of a beast! Being a totally new and custom built feature, we had little bandwidth for the user feedback iterative loop. Our product team had a challenging time wrapping their hands around this project and its documentation. I got my hands as dirty as possible understanding the end goals of users and the wide array of information a given integration may require. We had to have a bulletproof design framework to handle these varying scenarios.
Connecting and managing app integrations
Building workflows without code
We had to chunk this portion into bite-sized morsels. We’ve started by launching this next interface internally for our Pro Services team to create integrations rapidly for our customers. Our next version will be totally codeless with a clean UI for workflow creation and BPMN style logical flows.
Building BPMN-style nodes
Being able to create flows with logic and loops requires a fully flexible system of objects that can be placed at any point along a workflow. These are just a few of the documented states that are forthcoming workflow editor will offer.
Workflows get long and complicated
Worflow Task elements & states
There is no substitute for measurable data. This project was pressed for time from the outset and constraints were the most restrictive I’ve experienced in my career. In light of this, I feel we pushed forward tremendously valuable new features, but the absence of data to compare it to and iterate from is something I will avoid at any reasonable cost in the future.