Categories Articles, Sales and Marketing
BlueSky

Backstory: Why it was time for an overhaul

Back in 2012, when InsightSquared first appeared in the Salesforce ecosystem, we used to joke that our designer, Will Smith, sold a lot of software.  As we were seeking product-market fit, Will designed a reporting interface with a simple paradigm (visual charts stacked over data tables), intuitive layout (dates front and center; filters clearly evident), and brilliant colors.  The result was beautiful, and unlike anything in either the Business Intelligence industry or B2B software at the time.  The contrast between InsightSquared and the standard Salesforce interface was particularly stark.

At the time, our key challenge was to create the handful of reports that would delight Sales VPs, and convince the industry that data-driven sales was real and that InsightSquared was the clear choice. It worked – In Q1 of 2013 we hit our “Race to 50” Salesforce clients and never looked back.  

That UI served us well for three full years; an eternity in SaaS startups. Sure, in hindsight, picking the date range was a bit too clever, and it was never clear where the next feature would sit, but it was the perfect interface for our product-market fit phase.  Any more UX/UI work would have been a waste.

Then, slowly, two interesting things started to happen:

1. We moved from product-market fit phase to more of a “whole product” phase. This meant adding more platform-level features to the product, yet there was no real paradigm for such controls. While the value-add of the next feature (for example, Add to Dashboard) trumped any concerns we had for UI inconsistencies, we had clearly started down a slippery slope.  

Eventually, what had been clean and colorful became cluttered and confusing. Key action features were lumped next to report information and advanced controls, which only became more cluttered as we added more features.  Worse yet, we came to rely on hover-states to squeeze in valuable features where no real-estate existed at all (Eg: all our report tables have column filters that are effectively hidden from users unless they happen to hover over them).

2. Our Customer Success Team was spending more and more time training new users on the basic “how to” functionality of the product.  We pride ourselves on time-to-value, but all these new platform-level features were tripping up new users.

The combination made it clear that the current UI’s days were numbered, and we better get to work on what would follow.  And with that, the BlueSky project was born.

Process: Designing a new product interface

To start, we got outside the box. We questioned every assumption about the existing interface:

  • -Where does supporting text fit into a modern web app?
  • -How many independent panels are too many?  
  • -Should we really lead with questions (as opposed to Titles)?  
  • -Do users think in terms of toggles and controls or words in sentences?

We got overwhelmed.  We got frustrated.  Eventually we discovered that we didn’t really know what we were optimizing for in the first place. More than once we resorted to beer.   

Our breakthrough moment came when we asked ourselves: “When a business user lands on a report they’ve never seen before, what are their most important takeaways?”

As PMs & Designers, this “first glance” persona didn’t come naturally. We’re the furthest thing from a new user, in that we actually know each of our hundreds of distinct reports and dozens of features. But in order to build a product that aligns with our company’s vision and value-prop, we had to connect with a reference-user whose full-time job is running a sales team, not building or analyzing charts and data tables.  

We realized our new reporting interface should be optimized to:

  1. 1. Pass the 5-second test: Within the first five seconds on landing on a given report, the user should always be able to describe, broadly, What the hell am I looking at?
  2. 2. Drive down the cost of interpretation: Next, after a brief review of the report, using available content, the user should be able to answer: What does this report say about my business?
  3. 3. Clearly identify next steps: Once I’ve refined a report and found the answer to my question, it should always be clear: What actions can I take right now to improve my business?

That was it – once we settled our focus, the project really started to take shape. What had become a design challenge was quickly transformed into an execution challenge.  

Execution: Actually building said interface

Nailing the 5-second Test

To nail the 5-second test we focused on simplicity. No individual feature could steal attention away from each report’s main point.  We carved out a significant portion of the top of the page for the “Key Metric” (what that report actually answers), bumped up the contrast between the report frame and the pivots header, and preserved a healthy dose of white space.  

Furthermore, we had to reduce the noise on the screen.  We ultimately made the decision to collapse the Report Library behind a menu icon; a significant departure from a default with a large, eye-catching, side panel in the top-left.  

The result is an interface described by one beta user as “Oddly calming.”  Success.  

Ease of Interpretation

The language of Business Intelligence can sound like total gibberish to the uninitiated, putting new users at a terrible disadvantage. As Squares, however, we’re all very comfortable converting charts and tables into a simple sentence or two.  Furthermore, our Account Executives and Chaps rely on a fairly consistent set of language to describe reports on the phone with users.  

All along we knew we needed a better paradigm for our basic report refinements (picking filtering, setting date ranges & intervals, etc.) and eventually one of our designers, Lee Williams, finally just shrugged and suggested, “just write it all out all in one sentence.”  And with that, the “Semantic Sentence” was born.  

The Semantic Sentence pulls all the context of a given report into one clean, easy-to-interpret, well, sentence.  At the same time, it satisfied our demand to bring together things that belong next to one another.  The date picker and the interval toggle should sit right next to each other.  And “Compare Mode” acts on the date range, so let’s make that arrangement official.  

Once Lee had pointed out the obvious, it all just fell into place.  Steve McKenzie, our Sales VP, said it best: “Oh, that’s just how I would have described it to a prospect over the phone.” Perfect.  

Take Action

We’ve always believed that our goal is not just to serve up reports, but take that next step and help our customers make decisions and drive action within their teams.  That means that when you’ve found something of interest in a report, we need to make it a seamless process to share that insight with your team.  

Today the “Actions” available include Email, Subscribe (formerly lumped together with Email), Add to Dashboard, and Export to CSV.  While there are no real feature changes here, these actions now have a dedicated home on the screen, and are primed for growth.  We can’t promise what exactly which “Action” will be added next, but this gives us the perfect space to surface new tools to users in the future.

The Code

Did I mention that our Engineers loved the opportunity to completely overhaul the codebase?  While we don’t believe in paying down “tech debt” independent of other business objectives, when given the chance to correct three years of imperfect code, the team took full advantage of the opportunity.  The result is a cleaned up codebase that means shorter debug cycles, and a platform for us to improve upon going forward.  

Launch: Welcome to BlueSky

As a young, agile-development software company, we release new code every day.  But it’s not every day that we overhaul the entire reporting interface.  Over the last six weeks we’ve been tying up loose ends and sharing our progress with our awesome group of beta users (contact us to join the club!).  As the big day approached, we threw together a little guided tour, trained up the customer-facing teams, and fielded a few (dozen) bugs from initial test users.  

We couldn’t be more excited to share this BlueSky release with you.  Take it for a spin, and send us your feedback – seriously, I personally want to hear from you.  If you love it, let us know, if not, we’ll work to address any question or issue.  

Now let’s get back to helping you close more business in 2016; have you checked out your Sales Forecast recently?

Check out the new BlueSky Interface

Start typing and press Enter to search