Over my four years, I led the agile and collaborative design process that took the product from a piece of back-end technology and brought it to market, landing Brightleaf's first seven major enterprise clients.

Brightleaf’s SaaS platform integrates cloud, browser, and desktop functionality into one interface, enabling lawyers to use the Brightleaf cloud platform to power MS Word via the browser to import, automate, and assemble the documents that are essential to their practice. Its most recent and powerful feature enables lawyers to collaborate with their clients via Brightleaf Leaflets. I was responsible for the UX design and management of the entire suite of products, including everything shown below.

The Brightleaf Plaform – Zero to Launch

Challenge

When I joined Brightleaf, what they had was not much more than a piece of back end technology hooked up to the screen equivalent of punch cards of DIP switches. I was brought on board to work with the executive team and turn it into a product that 1) people could use and 2) Brightleaf could sell. The imperative was to provide Brightleaf's target market of lawyers, paralegals and admins – all decidedly non-technical – the ability to both automate and assemble documents without the need to write code or learn arcane markup languages which featured heavily in Brightleaf's competition at the time.

Solution

The timeframe was extremely aggressive: 4-6 months from zero to launch. Until my arrival, no user research had been done, and it would have been prohibitively costly in terms of time and effort to do the kind of robust user interviews and task analyses I had done for Sovereign Bank, OneSource and Blue Egg, especially with a target market that bills up to $800/hour. Instead, I was able to utilize internal SMEs (company executives, founders, investors and colleagues) who were practicing lawyers, to serve as proxies for our actual users and work with them to understand what their needs and motivations were for a product such as the one we were creating. This evolved into regular design sessions with the executive and project team as we worked through all the essential phases of the design.

For a more detailed rundown of how I managed this, see Process and Deliverables below.

Result

With my design and product leadership, we were able to bring the product from its initial state to market within the span of 4.5 months. We were subsequently able to land our first major enterprise clients on the strength of the newly designed product.

Process and Deliverables

Brightleaf was an early stage startup with no viable product in the market. Thus, time to market was critical as was the need to stay nimble and keep spend low. Process needed to be nimble and adaptive. Deliverables, wherever possible, needed to be fast and light.

Ideation and collaboration with local executive and project team

The upfront work consisted of understanding the users, laying down fundamental concepts and high level flows, determining MVP functionality, and getting rapid feedback on initial conceptual models. In order to keep the pace up I convened and facilited daily collaboration sessions with the executive and product teams.

Since these meetings typically included all key top-level stakeholders all of whom either were present for or actively contributed to the sessions, deliverables could be quick-and-dirty. Often, whiteboards were simply photographed (with my then-stunning iPhone 3G) and shared. Below are a few of the screenshots of some of those collaborative whiteboard sessions.

When there were important refinements to concept diagrams sketched out on the whiteboard, I would often create OmniGraffle diagrams and share those out. Below are a few selected samples of the kinds of things I would diagram out in a formal fashion for team review.

Design Work

As I built consensus around various product and design directions, I began sketching out various components and screens in wireframe format in OmniGraffle, building out a library of components as I went. I would typically review many of these with the team as they were taking shape in order to gather feedback and make refinements.

I also hired a visual designer to develop a visual theme and language. I ran it in typical agency style, presenting alternative “mood boards” of different themes, gathering feedback and refining these themes, eventually landing on one visual design. The designer then executed the main theme for all existing screen elements and components, first in photoshop format, and then, for key functional units, in an HTML mockup.

Detailed Wireframes and Flows

Our development team was located in Delhi, India and 1) were not part of the daily discussions and 2) would typically be working while we slept. For this reason, it was essential that they be provided with highly detailed and relatively complete deliverables for what needed to be built. The “unit” for each deliverable was a complete user story — a user accomplishing one complete task at the level they were defined. I produced an OmniGraffle wireframe for every discreet state of the interface. These were stitched together into a complete flow in Acrobat which was also used to completely annotate every user action or change of state. Below are samples from one of those user stories, starting with the document logic being created in the story, and then showing four of the 26 separate states along with their Acrobat annotations.

Self-service and Collaborative Leaflets

Challenge

In addition to Brightleaf's powerful, full-function document automation and assembly platform, my user research indicated clients were looking for a way to provide much of the automation functionality to their clients in order to enable clients to kick off certain deals and their associated documents in a self-service fashion. It was critical that this self-service functionality be dead-simple to use and available everywhere: desktop and mobile.

Solution

After vetting concepts and flow with associates at client firms via wireframe mockups. I designed the experience and flow of Brightleaf’s latest offering – “Leaflets” – which enables law firms to publish their automated documents out to custom “micro-sites,” selecting only the questions that they wish to expose to their clients. Micro-sites are either public or accessible via login as determined by the publisher. Upon accessing a micro-site, a client can select the deal or document type they desire, and fill out a simple questionnaire delivered in a responsive, mobile format via any device.

In addition to the intuitive client experience, I also designed a powerful Leaflet creation and management system for the publishing of Leaflets. With this management interface, lawyers can:

• Create micro-sites
• Create accounts and set permissions
• Select automation questions to include in the Leaflet questionnaire.

Lawyers can specify that any document be either completely “self-service,” generating a downloadable MS Word document for the client upon completion, or “collaborative” where the questionnaire instead kicks of a new automated document exclusively within the firm for subsequent collaboration with the client.

Result

In addition to helping land and keep Brightleaf's key lighthouse clients, Leaflets recently won Legal Tech News' 2015 award for Best Document Automation/Management.