Information Architecture for Custom CRM

odonell_logo.png
 

O’Donnell Metal Deck is a brokerage that supplies metal floor and roof products for a variety of construction projects throughout the East Coast.

As part of a niche but highly profitable business, steel brokerages win and lose opportunities around the fluctuating market price of their product. Consequentially, providing accurate and fast quotes to customers is a nuanced and competitive process.

O’Donnell was in the midst of a multi-year project to modernize their company by integrating technology solutions that will allow them to be the fastest and best-priced steel brokerage on the market, but their capacity to handle more and more jobs had become a concern.

To address this problem, I joined the O’Donnell CRM project along with two other UX Designers, Ben Throm and Melissa Glasser, for a two week design sprint. We set out to discover the best way to structure the information architecture of the CRM and design records and dashboards to track O’Donnell’s project-focused business.

Multi-method Research

 

We started by setting a schedule, with one week of research followed by one week of design. The research methods executed were:

  • Stakeholder Interviews: Conducted 30-minute interviews with all sales and production employees at O’Donnell Metal Deck (3)

  • Contextual Inquiry: Observed and recorded employee activity on-site in order to understand the user’s day-to-day experience and to document common user flows, business processes, and the difficulties encountered along the way

  • Competitive Analysis: Documented common design patterns and information architecture for leading CRMs and systems the client was familiar with, including Salesforce, SugarCRM, Pipedrive, and Airtable to understand what might and might not solve O’Donnell’s problem

  • Secondary Interviews: Interviewed additional respondents outside of O’Donnell (3) with direct project management experience in the adjacent industries of solar installation, construction, and shipbuilding to gain additional insights about the user’s possible experience and pain points

  • Card Sorting: Conducted with O’Donnell employees (2) to discover and analyze differences and similarities in mental models to aid in determining information architecture

OMD Employee completing an open card sort

OMD Employee completing an open card sort

Research Synthesis

 

From stakeholder and secondary interviews, we created an affinity map and identified key challenges, goals, and insights, as well as common data categorizations, industry tools, and processes.

We defined the three types of jobs completed by the company:

  • Yard Orders: The customer orders material from O’Donnell’s current stock, and either picks it up or has it delivered

  • Special Orders: The customer has a unique or unexpected need that requires additional processes beyond a typical yard order

  • Contract Orders: The customer is a contractor who needs to be quoted based on project-specific architectural drawings and supported throughout production by an O’Donnell project manager

Affinity Map

Affinity Map

Ideation

 

We sketched users flows and mapped out the common mental models uncovered from card sorting and stakeholder interviews on a large whiteboard.

Whiteboarding common mental models

Whiteboarding common mental models

Design and Testing

 

After synthesizing our research, we used the user flows, business process diagrams, and a low fidelity wireframes provided by O’Donnell as a reference to build a paper prototype of the job record. We tested the paper prototype on site, and then reviewed new insights and documented the feedback we received in a spreadsheet.

Feedback notes for paper prototype

Feedback notes for paper prototype

Based on that feedback, we created wireframes for each type of page in the CRM and built a lo-fi prototype for on-site usability testing.

One of my wireframes for an individual job page

One of my wireframes for an individual job page

From these tests, we decided to move away from a tab structure, which we had implemented to break apart different stages of the job, in favor of a page where users could scroll through to find where they needed to be at any given moment in their workflow. While this would prevent fields from being tucked away and hard to find, there was uncertainty about how exactly the fields on a longer scrolling page should be laid out. 

What fields are most important, and how should proximity be applied as a design technique so that fields are grouped in a way that makes sense to the user?

To answer these questions, we went back to our research and worked to finalize the information architecture. We whiteboarded our ideas and I created diagrams for the overall navigational hierarchy and page hierarchy for an individual job.

Navigational Hierarchy diagram

Navigational Hierarchy diagram

Job page hierarchy diagram

Job page hierarchy diagram

New CRM Design

 

Finally, we collaborated on a mid-fi prototype in Axure and I completed a high-fi mock-up.

High-fi mock-up of a Contract Order page

High-fi mock-up of a Contract Order page