Beamery Forms capture candidate data at key moments, such as when they apply for jobs and sign up for events. Using this data, recruiters engage and nurture promising candidates to fill their hiring needs. However, Beamery Forms had several usability issues, leading to high drop-off and low conversion rates. This caused recruiters to lose valuable leads and struggle to reach their hiring goals.
in lost sales
of users affected
To stay ahead of competitors and keep customers happy, we needed to reimagine Beamery Forms to improve user experience and increase conversion.
My high-level goals were to:
As the sole Product Designer on this project, I led the full design process from discovery to delivery. The MVP was launched in April 2020 and I oversaw two more releases before leaving Beamery in July 2020. I worked with a cross-functional team of 8 Engineers and 1 Product Manager.
We faced several unknowns at the start of the project:
- What kind of users are we designing for, and what are their unique needs? - What is working well in our current approach, and what needs improving? - What metrics are we trying to impact, and what might success look like?
To address these questions, my Product Manager and I took the following steps:
1. Consult internal resources
To understand usability issues, customer complaints, and feature requests, we analyzed ProductBoard insights and customer support logs.
2. Interview internal stakeholders
To create team alignment and understand technical constraints, we interviewed Engineering Leads and Customer Success Managers.
3. Interview users
To understand our users’ needs, frustrations, habits, and expectations, we conducted eight interviews with end-users.
4. Evaluate competitors
To identify market gaps and opportunities, I conducted a Heuristic Evaluation and SWOT Analysis of three key competitors.
After interviewing 8 end-users, we found that:
There is no one-size-fits-all approach.
The recruiting teams that use Beamery ranged from intimate, three-person teams to complex, multinational operations. Seeing our users' diverse needs highlighted that we would need to support a number of different personas and use cases in order to succeed.
Recruiters are time-poor.
A recruiter's job is multifaceted, demanding, and time-consuming. To make their lives easier, we would need to provide delight and efficiency in the form of time saving shortcuts and automated workflows.
Mobile support should be a priority.
Mobile compatibility was a low priority at Beamery. This was justified, in part, by web analytics that indicated that 99.5% of our users are on desktop devices. However, our research revealed users would use Beamery on mobile devices if only our technology supported it!
Accessibility drives product value.
Inaccessible features in our app prevented users from completing basic goals. A vision-impaired candidate struggled to use our Forms because we didn’t support screen readers. We had a clear business case for accessible features.
After identifying three of the most commonly-used form builders through user interviews, I conducted a Heuristic Evaluation and SWOT Analysis to understand how we could contribute original innovations to the field rather than reinventing the wheel.
From this exercise, I saw that there were some excellent form builders on the market. To set us apart from competitors, I identified three key unique selling points:
To measure product success and adoption, we outlined the following metrics:
Accessibility: 100% compliance of all components to WCAG AA standards.
Satisfaction: Increase Customer Satisfaction Score (CSAT) by 5%.
Conversion: Increase candidate conversion (form submissions out of unique visits) by 20%.
Traditionally, the user journey ends after a form is submitted:
With Beamery, a form is only the first step of the candidate engagement journey. After submitting a form, candidates are added to job vacancies, invited to recruitment events, and added to automated email campaigns.
Rather than simply upgrading our form builder, we designed and shipped a candidate conversion builder that can create connected workflows of forms, landing pages, email templates, and pop-ups to sustain candidate engagement.
Submitting a form is only the beginning. Convert page visitors into engaged candidates with the ultimate goal of hiring them to fill your talent needs. Don’t just build forms, build end-to-end candidate conversion flows.
Assess and optimise the performance of your conversion flows with a data-driven list.
See your updates in real-time with a live preview panel. Receive suggestions to ensure that your design complies with web accessibility standards.
Create conversion flows in multiple languages. Customise your content for different regions.
Beamery Convert can be used on varied devices to enable a new era of mobility.
Built with lightweight components (that are keyboard and screen reader compatible), our new forms are accessible, fast, and responsive.
To visualise the current user journey and identify key moments that caused frustration and delight, I created a set of user journey maps. This revealed that asking candidates to sign in before accessing the form led to high drop-off rates. As a result, we removed sign-in and instead offered Single Sign-On as a time-saving option.
Based on our user interviews, I segmented hypothesised user types into personas. These personas helped build internal empathy for users while highlighting that our users should not be lumped into one monolithic category.
When working on enterprise B2B products, it’s easy to become consumed by business priorities and deadlines while losing sight of your user's needs. To place ourselves in users' shoes, we utilised the user story framework when outlining feature requirements.
I prioritised our user stories according to persona needs, perceived technical feasibility, and business objectives. By creating a user story map, I was able to help my team visualise the full user journey while understanding what iterative steps it would take to reach an ideal end-state.
Before exploring interaction steps and potential solutions, I identified four design principles and linked each to a value proposition. These principles guided our design and development approach while setting key criteria to test built designs against:
Save time with suggested question labels and form templates. Delight users with predictive technology that simplifies complex workflows.
Amplify your company brand with intuitive form styling options. Target international users with tailored, relevant content.
Convert candidates to hires through integration with Beamery’s CRM. Drive users to the next step in their hiring journey.
Drive performance through helpful and actionable metrics. Alert users of system status at all times to make them feel secure.
My design process always starts with creating user workflows, where I outline and optimise interaction steps. These workflows also serve as blueprints for Engineers by mapping every interaction state that needs to be developed.
In our old Beamery Forms workflow, users had to create, edit, build, and share their form in one overwhelming interface.
To rapidly ideate possible solutions (such as mobile vs. desktop views and static vs. dynamic interaction panels), I produced low-fidelity sketches that we validated through internal usability tests.
Once we had an agreed approach, I used Whimsical to wireframe potential solutions before validating them again through internal testing. We didn't use actual users for this step because of the lengthy approval process required to set up testing sessions with them.
After weighing test results, I identified two approaches. My Engineering Lead helped me shape a satisfying MVP that would also lay the foundations for an ideal end-state.
Beamery's existing design language provided a helpful set of constraints that enabled me to quickly develop my wireframes into high-fidelity prototypes. To test the prototypes, we conducted both moderated and unmoderated usability tests with end-users. Here are some of the design decisions that we made along the way:
User interviews suggested that recruiters want preset templates to speed up their workflow, yet usability tests revealed that templates would add minimal value for most users. As a result, we removed templates from our MVP and brought users directly to the builder when they clicked 'Create.' This was a win-win, reducing our development time while minimising friction for users.
Previously, users could link form questions to custom data properties like ‘Salary Expectations,’ ‘Interest Areas,’ and ‘Earliest Start Date’. After learning from our Customer Success Managers that failing to link questions made data messy and unactionable, we decided to make question linking the first compulsory step when building .Users responded positively to this during testing. This also gave us the opportunity to offer predicted suggestions for question text, which saved users' and offered a sense of delight.
Without linking form questions to custom fields, form responses couldn’t be searched or filtered in our CRM, rendering the data unusable.
Making question linking the mandatory first step framed users’ thinking to optimise how data is used in their CRM.
When adding single-select and multi-select questions to a form, users can select which answer options can be selected by candidates. They also need to rename these answer options, since internal naming conventions and codes were typically used.
Data logs revealed that some users had questions with 100+ answer options (e.g. countries or universities), rendering this design unusable.
I proposed a searchable multi-select input that can easily accommodate unlimited options. Once selected, answer options can be renamed in a separate section.
After creating flows in multiple languages, users can select the languages that they want to publish. I initially proposed a modal to focus users' attention on the given task, but it obstructed the valuable information behind it. As an improvement, I proposed a slider panel that allowed users to interact with their work while reviewing it.
Our prototypes received consistently high (80+) usability scores, thus I was confident that users could successfully completing tasks in due time with minimal guidance. While engineers were building the first releases, I continued testing, iterating, and making improvements to upcoming versions.
Usability Report: Flow Builder V1
Usability Report: Flow Builder Multi Language
Our MVP was released in April 2020, and I oversaw two more releases before leaving Beamery in July 2020. To ensure that the built product matched usability standards, I conducted heuristic evaluations and scenario testing. While still in its early stages, Beamery Convert has already improved user experience and business performance:
(Initial goal: 20%)
increase in active users
faster load time
For confidentiality reasons I have omitted the actual values for these metrics.
Customers are actively using and adopting Beamery Convert while it also serves as key draw for prospective customers. Upcoming features, such as multi-language support, a content library of popular question labels and responses, and a wider range of page elements are currently in the pipeline.
Treat engineers like users.
Our team faced tight deadlines, heavy workloads, and considerable setbacks throughout this project. To build a collaborative and resilient team culture, I interviewed engineers regularly and incorporated their feedback into my design deliverables. In response to their feedback, I:
1. Added animated prototypes to my design specifications.
2. Involved engineers in facilitating user interviews and usability tests.
3. Led team workshops and classes on design tooling and best practices.
Who are your user's stakeholders?
Outside of our users, we needed to consider every player in the talent ecosystem. Recruiters use Beamery to build relationships with candidates, and also to meet hiring targets set by their managers. Our solution could either bolster or jeopardise their professional credibility, so every design decision needed to be supported by data and user insights.
Build mobile first whenever you can.
The nature of work is changing: people are no longer bound to desks and screens. We want to be productive while we’re on the bus, cooking dinner in the kitchen, and watching Netflix on the sofa. At the start of the design and development process, invest time into building a solid mobile-first foundation, rather than trying to retroactively integrate mobile support later.