To comply with my NDA, I have omitted and obfuscated all confidential information. The information below is my own and does not necessarily reflect the views of Box Inc.
Details
Box Inc
2019
A simple, secure way to get files and information from anyone
Send a file request
Easily and securely gather documents from anyone with just a link.
Embed it
Add a file request to an internal or public website, like the Small Business Administration did to intake over 500K PPP loans for COVID disaster relief.
Attach a form
Form entries automatically get attached as metadata. Metadata can be used to make content easier to search and organize, or trigger a business processes.
Kickstart a process
Auto-start review and approval process every time files are uploaded.
How Box Forms can help your team
HR
Securely obtain employment-related docs (e.g. I-9 or background check authorization) from…
read more
…new hires before their start date. With File Request, HR can clearly request specific documentation and additional required information. No more back-and-forth communication and sharing of sensitive attachments using personal email addresses.
IT
Obtain security and compliance certifications from partners so Relay can route them to legal and compliance teams to review.
Manufacturing
Request product specifications from contracted companies. These types of files are too large to…
read more
…send via email and typically require dedicated FTP sites. With File Request, the manufacturer sets up a single folder for receiving specs and requires companies to fill out associated details. No more splitting files or dealing with cumbersome FTPs.
Finance
Gather quarterly budget asks from departments in a ‘Budget Requests’ folder, without sharing any confidential information in that folder.
Marketing
Source promotional assets from creative agencies. With File Request, marketers gather…
read more
…assets and related metadata directly in Box and kick off internal review processes with the brand team. No more emails floating around with multiple versions of highly confidential product launch assets.
Sales
Ask account executives to submit demo videos into an intake folder for a sales pitch contest.
Power your team’s workflows
For example, finance teams can use file request to solicit vendor invoices, use Relay to determine contract value and route invoices through the approval process.
Case Study
The Challenge
Powering complex business processes
Since the release of Relay (Automations 2.0), our team spoke with hundreds of customers and end users to better understand their experience and identify unmet needs. Our goal was to increase Relay adoption and we knew missing features were preventing users from migrating their existing workflow processes to Box.
Relay was too limited to address complex, higher value business processes. For example, we found finance and legal teams often used ticketing systems that were built into a submission form. Depending on how submitters completed the form, one of a half-dozen review and approval processes would start.
Additionally, there were still many paper and email based processes lingering across industries and lines of business – most of which compensated for dated internal systems that were unable to include people who were external to the company.
File Request 1.0
At the time, Box users could send a “File Request” link to anyone. The link directed individuals to a simple upload page that allowed them to securely add files to a folder without accessing its content, and without having to sign into Box.
Strategy
The plan was to rebuild File Requests 1.0 so that it could better serve as a form to request documents, information, and integrate into Relay workflows to satisfy more complex use cases.
My Role
I led the design of File Requests 2.0 from June 2019 – November 2019. My efforts included customer interviews, user testing, design strategy, and all visuals presented in this case study. Additionally, I worked alongside Ravneet Uberoi (product manager), Vaishnav Gorur (marketing strategist), as well as Daniel Kim, Virender Gupta, Nachiket Deo, Seth Voltz, and Stephen Hiller (development).
Special thanks to Vandy Pai for spearheading the design effort and all the concept work.
Discovery
Identifying upstream opportunities
Our sales, consulting, and go-to-market teams were engaging with Relay customers daily. Sales catalogued feature gaps and headwinds that impacted attachment rates. Our consulting team identified challenges that affected adoption. And product and marketing interviewed users to assemble a use case library of over 100 workflow examples.
Chief among the patterns that emerged was the need to request files and data from partners, vendors, and customers through a form. With the submitted content users could automate business processes in Box, like budget approvals or contract reviews.
Sizing customer needs
Ravneet Uberoi (our product manager) divided document collection customer use cases into three categories to highlight a broad need across verticals and lines of business.
Review & Approval
Individuals submit documents to kickstart a review and approval process.
View use cases
A food distribution company requires department leads to complete a capital appropriations request doc to budget approval.
An insurance company needs new vendors to submit invoices with W-9 to get paid.
A large investment company needs all invoice associated with a deal to be tagged with deal data when submitted.
New project and budget request • Invoice approval • Contract review • Worker injury claims • Medical leave request
Asset Management
Submitted documents are appended with information (gathered through a form) to make them easier to find.
View use cases
A telecommunications company built custom product documentation library on Box. Content needs metadata and tags to make content easier to sort through.
A large department store chain needs to organize campaign photos based on metadata attributes.
A large enterprise SAAS company needs to tag all go-to-market assets with metadata to enable discovery in their GTM portal.
Marketing & sales digital asset library • Department portals
Project Collaboration
Documents are requested by a dependent team or company to start a collaborative process.
View use cases
A global car manufacturer needs engineers to send global supplier a link to upload large engineering specs and notify the team to begin work.
An insurance company wants agents to enter metadata on all client documents when a new client is onboarded.
Document handoff with a 3rd party (agency, vendor, supplier, customer) • Internal department coordination (brand, design, compliance)
Existing solutions were pieced together
We found customers using a hodgepodge of tools to automate their processes. Their systems were pieced together, difficult to maintain, highly technical or home grown, and required IT manage them. Secondly, many of the form tools we came across allowed process owners to collect data (not content). There was nothing off-the-shelf that enabled them to request files through a form and easily connect to a business process.
Goals and objectives
Our goal was to enable business users (not just IT) to collect content and information from internal and external collaborators, and power business processes through a simple and secure interface.
This aligned with Box’s broader strategic principles of empowering end users (reducing need for IT), providing horizontal solutions for all industries and functions, and building products that simplified work. Additionally, we believed it was a strategic differentiator that would have a direct impact on revenue.
Success criteria
Ravneet broke down our goals into a three part framework:
Goal
Box is highly differentiated from our competitors
File Request drives product engagement
Signal
File Request feature drives new deals and logos
File Requests actively receives submissions
Metric
Influenced ARR
% new ARR influenced by File Request
Monthly Active File Requests
# of File Requests with a submission in 28 day period
Design Strategy
Segmenting the user’s experience
Terms like file requests, process management, workflow, and metadata were foreign to most people using Box. The challenge was to position File Request so that it was relevant to everyone, easy to learn, and easy to use thereafter. To ensure all the capabilities we were baking in didn’t create barriers to adoption, I reoriented customer use cases based on complexity (the number and length of steps involved to complete a goal).
General use cases
Users needed a way to ask internal and external collaborators to upload documents or media files to a folder, without allowing them to see the contents of the folder. This was the simplest and most broad use case (~80%).
Advanced use cases
Advanced users had a process they needed to digitize or optimize. Their processes nearly always included an attached submission form to help them reference and review the uploaded files (~15%).
Automation use cases
Business process owners needed a way to request or collect files and data to kickstart a Relay workflow process. Process automation use cases were the most niche and high value (~5%).
Guiding principles
To accommodate the spectrum of use case personas, their technical abilities and familiarity with business process management, we crafted 3 design principles to guide our efforts.
Be familiar
Familiarity warms users to trying something new and makes learning easier. It’s good to leverage established interaction and visual paradigms so users can connect our product experience with others they’ve experienced.
Focus on easy habits
People try before they buy. Our product experience should be progressive, focusing users on the most foundational activities to reduce time to value and warm them to a new way of working.
Make the technical accessible
If it looks complicated, it probably is. Simplify, reframe and seamlessly integrate heady features so they don’t impose on the experience, but make them easy to discover and use.
Interaction & Visual Design
Mapping the user journey
Mapping our personas’ key tasks along their user journey structured our creative process to consider the end-to-end experience. We started with mapping the first version of File Requests and discovered a lot of gaps. Nearly everything needed to be reevaluated to enable users to create their own content form. And first use was being considered for the first time.
First Use
Awareness
How does someone learn about file requests?
Discovery
How can someone find it when they need it?
Orientation (Welcome!)
How can someone quickly and confidently get started?
Repeated Use
Prepare
How can someone customize their file request?
Send
How can someone secure and share it?
Reply
How can someone respond quickly from any device?
Review (A-HA! Success)
How can someone know when files are uploaded?
Power a process
How will users kickstart a review process every time files are submitted?
* Icons used in this section belong to the SF Symbol library
Awareness & Discovery
When HR teams need to collect documents from a new hires, how would they know to use File Requests?
To start, we added “File Request” to the folder collaboration menu, because users described it as a “way to share a folder with others.” Doing so also raised the feature’s visibility – making it easier to discover and find later on.
And to market the addition, we displayed a new badge with a hotspot to introduce it.
Original Design
Originally, File requests were harder to find and only discoverable within the overflow menu.
Orientation
When loan officers need to collect additional finance documents to complete a student loan application, how could they confidently use file requests?
Most users did not need to customize their file requests. To prioritize users who wanted a quick transaction, as well as first time users, the “share link modal” was focused on introducing the feature and optimized to copy the share link.
Original Design
The share link modal included every feature available. To accommodate more, we had to break them into categories and move them a click. Doing so allowed us to simplify the experience by reducing the number of actions and set a clearer hierarchy.
Welcome Guide
The tool-tip guide highlighted key features and guided users through the experience for the first time.
Prepare & Send
When entertainment studios need to collect creative submissions, how can they customize a file request to fit their needs?
The form builder enabled users to tailor any request to their needs. The editor mirrored the recipient’s view so authors could customize requests without ambiguity. To support WYSIWYG editing, we included a theme preview, in-line text inputs, physical form fields, unobtrusive “add a field” menu, and drag & drop reordering.
Brand it
Authors could modify the file request page header and logo using the theme menu.
(Most admins customize Box to display their logo and company color. If configured, they’ll also see them as options in the file request theme menu.)
Add a form
The WYSIWYG Editor makes it easy to add fields and preview changes. Form responses are appended to documents as metadata to help users to search, sort, and organize submissions.
Send or embed it
Share a link to request files from anyone and get notified when they’re uploaded.
User can also embed the form on a website to collect submissions from a larger audience. Like when Atlantic Records requested fans submit videos of themselves dancing to “Savage” by Megan Thee Stallion for a TikTok promo.
Concepts
Every high-value use case we identified included requesting files + information. However, adding a form to file request wasn’t straight forward, because our team was dependent on a metadata service built long before I joined Box and was designed with a lock and key. Users would have to create a metadata template before they could add a form to a file request.
Our early concepts prominently placed metadata as part of the customization experience. However after user testing and dozens of conversations with customers, we settled on making it less prominent, because it added a lot of cognitive load to those unfamiliar with metadata and challenged anyone who wanted to send a “quick request” (higher volume use cases).
Simple Modal
This was a preliminary concept shared with key stakeholders to evaluate the business opportunity and user need. The MVP requirements outgrew the modal so we expanded it full screen.
Form Field Menu
Designed by Vandana Pai, this concept prominently featured a “form configuration” menu that allowed users to specify a save location, metadata fields, and add more upload zones.
However, nearly all user testing participants were confused by the metadata menu, because they couldn’t characterize it and it wasn’t like the other form authors they’ve used.
Multi-Sectioned
This concept divided the form into three sections to focus users on one at a time. Each section included instruction to guide users through the task.
However, it wasn’t a WYSIWYG anymore, because the help content didn’t show when previewed. User testing participants also couldn’t tell what was editable and what wasn’t, because the text was all styled the same.
Lastly, participants couldn’t tell metadata was optional, which would have affected request completion rates.
WYSIWYG
The final design made a full effort to mirror the authoring experience with the uploader’s.
We achieved this by tucking Metadata into the “Add a field” submenu, which simplified the editing experience. Rather than introducing metadata immediately, we introduced it progressively.
WYSIWYG + Sharing Sidebar
This concept made an attempt to merge the sharing modal with the builder to usher more users into the editor (without impeding anyone who just wanted to share quickly).
However, it was descoped due to time constraints.
Reply
When contractors are requested to submit creative work to comic studios, how do they respond quickly and confidently?
The submission experience was intended to feel like a standard submission form. Users are provided with instructions to add files, fill out a few fields, and “submit” their response.
Original Design
File requests v1 based on our 2014 design language.
Fully Responsive
The submission page was design to fit any screen and webpage.
Review
When hotel maintenance submits images of damaged furniture for ordering, how will procurement know?
Process owners receive an email and Box notification when people respond to their request. They can click through to view uploaded documents and attached form responses.
Power a process
How can an aerospace procedure coordinator automate an approval process whenever updated flight manuals are submitted for review?
With Relay, process owners can trigger a review and approval workflow any time files are uploaded. They can also specify a condition to start one process vs another (e,g, flight manuals may require different approvers depending on the aircraft).
Results
Validating our use cases
Prior to release, “File Requests” functionality was involved in closing a significant number of large logos. After release, the number of monthly active File Request grew 15x MoM. It was special to see the use cases we designed for amongst the many customers shared with us.
Branch managers at a regional bank are using it to collect Small Business Administration loan applications remotely while their branches are closed*
HR teams at a large hospital network are using it to collect IDs to provide COVID-19 benefits to front-line medical staff*
Production teams at a music label are using it to collect audio files from recording sessions*
Insurance claims officers are using it to collect footage for auto and property claims*
Non-profits are using it to collect applications to provide aid to troubled foster youth*
Universities are using it to plan virtual graduation ceremonies or to collect students’ homework*
* Use cases written by Ravneet Uberoi
** Icons used in this section belong to the SF Symbol library
Project Reflections
Use cases are everything
Ravneet spent time with IT admins to learn how they build process management solutions for departments across their companies. She mapped dozens of business process use cases and learned all the varying ways they were built. Her efforts boosted our confidence and increased our accuracy.
- We were able to better compare our proposed solution with others.
- Reviews and interlocks focused on real people and measured opportunity.
- We had more rational for prioritization decisions.
- Other teams were able to use our insights.
Use cases made nearly every review smoother, because they provided objectivity, clarity, and helped everyone stay aligned.
Research can be scrappy
Without a research team or an online user testing account, we had to get creative with lean ways to recruit participants and test our work. In addition to Ravneet socializing designs with customers and design partners, I reached out to recruiting for new hire contact info.
Ravneet and I were able to run over a dozen usability tests in-person and remotely. Our moderated sessions provided users with just enough context to explain the first step in a scenario they clicked through. At each step, one of us would ask them describe what they’re seeing and what they’d do next. Our goal was to evaluate comprehension, sentiment, and where users may get stuck.
The participant pool wasn’t entirely representative, but we connected with people who were new to file requests and identified issues that would have frustrated users.