In 2014, New Relic was on the cusp of exponential sales growth and product diversity. To capture as much of that growth as possible, we continuously experimented with landing page design in order to maximize lead capture and conversion. Below is an example of the design process of one such landing page, in this instance targeted at personas working in DevOps (developers, IT managers, etc.). The messaging of this page highlights the increased visibility and communication New Relic's products provide, which are crucial to the DevOps method.
The initial idea for the structure of the page was a step-by-step process that showed how an operations problem could be solved using New Relic’s software. After starting to wire a few ideas, we began to see that we could communicate the intended message much better if we constructed a narrative around a plausible real-world scenario in which co-workers used New Relic’s software in order to solve a problem.
In order to summarize the core of what New Relic’s software enables users to do, we ideated on a scenario that focused on a developer and IT operations manager using New Relic's software to identify an issue, figure out the root cause, and ultimately fix the problem. Since this was to be an ongoing conversation between two people, we began by sketching out some ideas for a timeline – this would communicate a conversation happening over an extended period of time.
Following our series of sketches, we found that it was time to mock up several ideas. Per client request, we started with an illustration in the hero section, which was quickly scrapped (we’d found through A/B testing other landing pages that big background photos worked best). We then moved our attention to the timeline element. After the first couple of iterations, we found that the timeline needed to feel more personal and direct – this would align it well with New Relic's general tone of being very straightforward and “nerd friendly.”
The final result is direct and personable, clearly communicating a conversation which demonstrates how New Relic’s software can be utilized in a real-world situation in order to quickly and effectively solve a potentially catastrophic problem. The page hits on all of the most successful landing page patterns which were proven (through A/B testing) to convert best: big background images, collapse forms into buttons, and minimizing the number of possible actions on page (to focus the user's attention).
Through continuous A/B testing, we found that the most important thing to increasing conversions was keeping the landing page distraction free by minimizing the number of possible actions on page. We took steps like minimizing the number of CTAs, minimizing copy, and optimizing titles to increase sharing. All of these efforts consistently led to increased conversion rates.
In addition to designing landing pages, I worked on many of New Relic’s feature product pages on their marketing site. The goal of these pages was to showcase New Relic's marquee products in order to convert investors and product buyers (as opposed to product users). This was accomplished through the use of big, beautiful imagery (product shots and illustrations), compelling copy, social proof, and simple CTAs.
I worked closely with our in-house development team as well as other designers to create and maintain a site-wide style guide. We found this to be of supreme importance as the size of the site ballooned along with New Relic’s growth. It was a challenge to implement, but well worth it in the long-run.
New Relic’s desktop site utilizes a main-nav/sub-nav paradigm. We sought to simplify this in the mobile nav by essentially separating the main-nav and the sub-nav into two separate screens. This way, we minimized the amount of scrolling users needed to do, making it easy to move between levels in the menu system. While the implementation isn’t quite perfect yet, we think it’s in a great place so far.