FORMLABS

Sample Request Experience


March 2018
Overview
Formlabs offers free 3D printed sample parts to potential customers to help them better understand the quality of our 3D printers. Parts are requested on the ‘Sample Request’ page, which is the third most visited page on the website, and is the best source of sales qualified leads. I worked closely with the Growth and Product teams to redesign the experience in an attempt to boost sample request conversions, and in turn printer sales.
Responsibilities
- Design Strategy
- User Experience
- User Interface





Impetus

This page is a core aspect of our sales strategy, and we had been continuously A/B testing minor refinements to this page over a 2 year period. Eventually, we were allowed to redesign the entire page, primarily due to a burgeoning list of samples on offer, something that the existing design was not prepared to handle.

Problems


We began by outlining some of the essential problems with the existing experience. 
  • This page was designed when we offered 4 samples, and did not account for a growing quantity of sample parts (16)
  • The images that depict the parts were not large enough, and did not clearly communicate the nature of the part
  • The parts' three dimensionality did not come through successfully
  • There are three steps to the process, but this was not made clear to the user at the outset
  • The e-mail capture step was buried within other form fields, and did not allow the growth team to retarget users who dropped off while viewing the form
  • The design did not work well on mobile, which constitutes about half of our visitors

Testing

We  progressed to design iteration and decided to A/B test a few options with Optimizely, which allowed us to easily create iterations of the design and serve them to a small percentage of users. 


We tested an application filter before the actual sample selection menu, which proved to be less successful. Having the parts above the fold was necessary.
We also tested a gallery version with a preview modal, which did well but led to increased drop-offs in later stages.


We explored the idea of a comparison tool, but this was shelved for two reasons: we have a more robust material comparison tool on the Materials pages, and we wanted to avoid increasing the complexity of decision-making for the user at this stage.


What We Learned

  • Large images of sample parts are more compelling and lead to higher clickthroughs
  • Adding a minimal 'filter by industry' option allows users to narrow down their material options and choose more easily, since we only allow one sample request at a time
  • Addition of the filter led to an increase in requests for materials that were usually hidden below the fold

Final Design

  • We decided on a sidebar list with a large preview space
  • Each step is outlined in the step tracker, which can also be clicked to navigate to other steps
  • The CTA is duplicated at the start and end of the page to promote clickthrough
  • The filter was minified to a dropdown, which allows the part previews to be well above the fold 
We introduced a feature allowing users who landed on the page through paid advertising to link directly to a preview of a pre-selected sample based on their specific industry.

This allows the user to navigate to check out without having to make a decision.


    E-mail is the first item to be captured, and is instantly saved for future retargeting. The preview on the right of the form is also interactive.

    This allowed us to reach out to the user despite their potential drop-off in the next part of the experience.



    Upon checkout, the user is prompted to contact sales, or view content that is related to the sample that was requested. 

    Mobile

    Over 40% of traffic consists of mobile users. We ensured that the entire sample range was easily accesible with thin cards which still show part detail, and a persistent CTA.





    Interactions

    The parts are often highly detailed and can be made more visually appealing if their three dimensionality is made apparent. We decided to shoot each sample on a turntable and map the photos to the user’s cursor Y position. The part initially animates in and the effect is discoverable on hover. Additionally, the 3D interaction worked on mobile devices with the help of the device gyroscope.




    Results

    We ran both the old and new designs for a month to 50% of visitors each, and learned that the new form led to a 35% increase in sample converstions compared to the older version.

    Request a sample here!




    Wash & Cure

    UI for post-processing machines on an 8-bit LCD display

    Site Navigation

    Redesigning the navigation for a rapidly growing website

    Form Cell

    Designing a print management system for a fleet of 3D printers

    Sample Request

    Increasing conversions by redesigning a key webpage

    The Digital Factory

    Web design and branding for an annual 3D printing conference

    Other Work

    A brief overview of other projects