Product Designer

Delivery

Allow Square sellers to accept delivery orders through their online store

 

Role

Research, scope definition, user interviews, prototype testing, copy writing, UI design, UX design

Timeline

October 2019–July 2020

Collaborated with

Product manager, engineering, design

Company

Square


The problem

Sellers using Square Online for their online business wanted to offer delivery as a fulfillment option for customers placing online orders, but could only do so by either hacking Square Online’s shipping set up or using third party marketplaces such as Uber Eats, Postmates, or Doordash.

Third party marketplaces take outrageous commissions on each order, and many sellers would prefer to bring delivery operations at least partially in house in order to increase their already thin margins and reclaim ownership over the relationships with their customers.

The opportunity

Square Online could allow sellers to take delivery orders through their own site, and allow them to use either their own or 3rd party couriers. Delivery orders would be integrated into their Square Point of Sale, streamlining operations and saving money. Finally, Square Online could enter into direct partnerships with the 3rd party delivery services, negotiating more favorable commissions for our sellers.

Understanding delivery

Delivery was a bit of a brave new world for Square. The company had just sold Caviar to DoorDash, but Caviar had never been truly first-party, operating as it did under its own brand, with its own seller-facing admin & settings. So we needed to take some time to understand the basic functionality that sellers would expect for delivery setup & order management.

I started with competitive research, looking at marketplace delivery companies such as Uber Eats, DoorDash, GrubHub, and Amazon Prime Now. I also looked at delivery bidding & management services, like Chowly and Olo, as well as delivery plugins for Shopify and TheOrdering.app. I scrolled through feature requests from Square sellers, as well as those in the Shopify and BigCommerce forums to see what functionality sellers were specifically asking for around delivery.

 
 

 
 

Based on the offerings of other companies in this space, and on seller requests, what features must we offer to create a compelling & remarkable first release?

 
 

 
 
list-of-features.png

I drew up a list of all the possible pieces of functionality that could be included in a delivery feature. Using what I had learned from my research as well as my own intuition, I narrowed that list down to what I believed were the core pieces of functionality that we could launch with in a reasonable time and be confident that we were delivering something sellers would find valuable.

I presented my proposal for the scope of the project to stakeholders from product, engineering, business development, and customer support, and it was unanimously accepted. Now, the real work could begin.

 
 
 

Design explorations

Square Online already allowed sellers to set up and accept pickup orders through their site, and the set up for pickup had a lot of similar requirements to the proposed setup for delivery. In order to avoid forcing sellers to duplicate effort, it made sense to explore how delivery and pickup set up could coexist.

I explored multiple approaches, from simply inserting delivery information into the existing structure to a more radical redesign that introduced a setup wizard.

Ultimately, after getting feedback from the design team and my PM, we thought that the setup wizard was worth pursuing. I created a higher fidelity prototype to test with users.

 
 
exploration-3-3.png
 
 

Prototype testing

After sharing my explorations with my product manager, engineering leads, and other stakeholders, we decided to test the setup flow with several Square sellers who had shown previous interest in a delivery feature. Using Orbit, Square Online’s design system, I quickly moved from wireframes to more high-fidelity screens, and put together a prototype in Figma.

Goals for testing

  1. Is the set up flow intuitive and usable, and does it match sellers’ expectations and mental models for a delivery feature?

  2. Is bulk set up useful?

  3. Some specific questions around individual features—e.g. do sellers need separate pickup & delivery hours?

 
 

What we learned

Overall, the setup flow was straightforward for sellers to navigate and understand. Sellers appreciated being able to configure multiple locations with the same settings.

One main point of confusion that came up consistently during testing, however, had to do with item fulfillment. In order to sell items online for pickup or delivery, not only does a seller need to enable those fulfillment methods for their locations, they also need to indicate which items in their catalog are available to be fulfilled by pickup or delivery. This is done in a totally separate part of the product from setting up pickup and delivery locations which annoyed some sellers and confused others. As one of our testers put it, “When I am done with set up, I should be done with set up.” Meaning, all set up required to enable delivery should be folded into the one flow, not split up across product areas.

Full designs

After testing, we felt confident in the approach for setting up delivery. I now just had to flesh out the rest of the flows and build out all the screens.

Additionally, we needed to know how the delivery fulfillment method would affect sellers’ published sites and the checkout flow, so I flew to New York for a week to work with the designer on the Buyer Experience team, which owned the published site experience. She and I spent a week going over the buyer-facing requirements and building out the published site and checkout flows for desktop and mobile.

 

 
 

Because the changes we were making to support delivery affected multiple parts of the sellers’ and buyers’ experiences, we wanted to ensure the result was cohesive and remarkable across the various surfaces.

 
 

 

The Buyer Experience designer and I put together an end-to-end review of the entire experience for both sellers and buyers, which covered:

  1. Seller set up

  2. How a buyer would place an order for delivery from the seller’s site

  3. How a seller would receive and fulfill that order

  4. The points of communication about that order between the buyer and seller

We presented this comprehensive journey to Square Online’s leadership. We uncovered a few spots in the experience that required a little extra polish, and began gearing up for the hand-off to engineering.

 

But then… COVID-19

By the time designs were complete and engineering was ready to begin building, it was the very beginning of March 2020. States began issuing shelter-in-place orders, halting in-person shopping and dining over night. Suddenly, sellers could only make money if they had the ability to take online orders and offer delivery.

The comprehensive and thoughtfully designed delivery feature we had spent the last month finalizing was suddenly something that could make or break many sellers’ businesses—we had to act immediately.

I went back to the drawing board with the support of my product manager.

 
 

 
 

How could we strip the functionality down to what worked, and could be built in a matter of weeks rather than months?

 
 

 
 

We revisited one of my earliest explorations that had delivery functionality inserted into the existing pickup UI. This solution left the door open for future iterations to the improve the UX along the lines of the original, finalized designs.

I quickly created new designs, while my product manager prioritized the features that we would build as iterative fast-follows to our first launch.

 
 
My designs for adding delivery to the existing pickup set up, with notations to indicate to engineering what was changed

My designs for adding delivery to the existing pickup set up, with notations to indicate to engineering what was changed

 
 

We released this functionality in 3 weeks, and saw immediate adoption. We continued to release additional functionality, adding on more of the bells and whistles that had been part of the original spec, launching these almost weekly during the following months.

We also began pushing forward with what we were calling On-Demand Delivery, working to onboard Postmates as our first 3rd party courier partner, to allow sellers to take delivery orders and have Postmates couriers automatically dispatched to pick up and deliver them.

 
 

UX Improvements

As a result of the push to release delivery as quickly as possible, we had sidelined the UX improvements to the set up flow, but as we added on more of the fast follow features, the pickup & delivery settings page was becoming increasingly bloated & overloaded, and I looked for an opportunity to push for the redesign I had proposed before COVID hit.

That opportunity came as we began work on On-Demand Delivery. Engineering was less rushed at this point, and had the bandwidth to work on front-end improvements. On-Demand Delivery had additional required settings that highlighted even more the need to redesign the set up flow to clarify to sellers how to set up their locations to accept delivery orders.

I worked directly with one of our front-end engineers on a simplified version of the setup flow that I had designed months prior, that included the setup wizard, but removed the bulk location setup functionality in order to reduce the complexity in developing it.

In the end, after the major wrench that was COVID, the push to release delivery in its simplest form, and the introduction of the Postmates integration, we ended up with a simplified but still streamlined experience for sellers to enable pickup and delivery for their locations.

After only 1 month, Square Online had processed almost 3000 delivery orders with a total value of almost $500,000, and is continuing to grow exponentially as we iterate.

 
 
 

Final experience