Project image
Project image
Project image

Designing the picks and shovels for software interoperability

Ampersand

Timeline

2 years

Team

CEO, CTO, 4 engineers, sales

Early days

Ayan and Lauren, co-founders of Ampersand, engaged me very early in the ideation process before they had formed a company.

Over the early months, I explored different ideas with them, bringing them from whiteboard to prototype to potential customers. Through several more months of iteration, we built confidence in the concepts, and pitched to VCs.

The vision

Ampersand seeks to be the default way that developers build software integrations, offering everything teams need to build custom, native integrations into their own products. Just as AWS made buying and managing your own servers obsolete, Ampersand wants to make researching vendor APIs and writing custom code to integrate with different vendors obsolete.

We want developers to be able to build integrations in days, not months.

Thanks to the validation and well-developed prototypes, Ayan and Lauren raised a $4.7M seed round led by Matrix Partners along with angels like the co-founders of Dropbox, Airtable, and Firebase.

Process

Aligning on personas

While designing the early concepts, I realized the two personas we serve are so different that it became confusing to use the term 'users' since we would constantly mix up who we were talking about. I proposed the team center on two terms, 'builders' and 'consumers'.

Ampersand offers an SDK, hosted service, and UI library for developers who want to build new products that need to integrate with existing systems of record. As one example, a company like Clay (which builds AI for personalized outreach) needs to help its customers sync Clay with other systems within the customers' ecosystem like Salesforce or Hubspot. Clay's engineers are who we call the builders, and they are the ones who pay for Ampersand.

Clay's users, who interact with Ampersand's UI library within Clay to set up and manage integrations with their other tools, are who we call the consumers. They are usually non-technical users but know their organization's SaaS tools very well.

There is a third persona, which we are putting off to a later time, who are the customer success and support roles that work at builders' companies.

Reprioritizing toward MVP

Some of the concepts that were excellent for showing the builder interface to investors were not as valuable to builders, so we deprioritized them. One example is deprioritizating builder page in the product, so that we could focus more on setup and observability.

With the UI library, we found that what is most important to get right for consumers is setup and configuration, which allowed us deprioritize consumer-facing observability.

Some of the more creative ideas in observability were also deprioritized for straight-to-the-point UIs.

Information architecture

Here, we are showing a integration source (or provider)-centric view of your instances. Your Hubspot and Salesforce integration instances are facing some issues, in this example.

In this example above, we are showing a customer-centric view of your instances. Your customer OptimizeForce has turned on a ton of integrations, and a few are degraded or broken.

Every instance of an Ampersand-powered integration has two main attributes, the customer and the integration source (or provider, a term we switched to later).

Early on, I designed the builder dashboard with both customer-centric and provider-centric views. Both are equally valid representations of the architecture, but Lauren and I realized it was wise for us to choose one view to start with in order to conserve resources, and we decided to go with the provider-centric view.

Many edge cases

While we started in the concept phase with a UI library that was optimized for an average use case of an integration with Salesforce, a few standard objects and a few typical fields, we found that some early customers had very unique requirements.

  • Example 1: Lots of objects

  • Example 2: Lots of optional fields

  • Example 3: Lots of field mappings

  • Example 4: Lots of permissions/actions (read, update, subscribe)

  • Example 5: Lots of no-config objects

  • Example 6: A single UI for first-run and later-runs

  • Example 7: Turning off objects later

  • Example 8: Changing auth later

As I discovered each new use case, I adjusted the UI library to support it while also keeping in mind the holistic experience.

Self-serve as differentiator

From the beginning, we had conviction that self-serve would be a differentiator. Most other integration platforms in the space required going through a sales process, and Ampersand is uniquely positioned to appeal to developers who often prefer to try it out without talking to sales.

After designing a few variations of our onboarding, I ran a research study with 8 developers who fit our ICP. The participants started from our marketing page and were given some free time to learn about the platform and set things up.

From the study, I found weaknesses in developers' understanding of certain concepts as well as why certain setup steps we needed. This led to us renaming certain things and putting more emphasis on communicating certain ideas in our marketing and documentation pages.

While I work on the next iteration of in-product guidance, we found that adjusting docs was very helpful in helping developers get up to speed while allowing us to save time compared to building an in-product onboarding experience.

The right amount of scalability

Having worked in IAM at New Relic, my experience guided the team in setting up an IAM architecture that was scalable, with an organization and projects, as well as a roadmap for future objects like teams that would scaffold into the architecture.

Additionally, I set up a design system based on Simple UI and implemented primitive and semantic tokens so that both design and front-end workflows are more efficient and consistent.

Marketing site

Rather than hiring an agency to work on the marketing site, I designed it from scratch in-house, and managed contract developers who implemented it in Astro. All content is tracked via Github and composed with Markdown. The benefit is a site that we can iterate on over time.

Project image
Project image
Project image
Project image
Project image
Project image
Project image
Project image
Project image

Result

Early customers

Since raising seed, Ampersand has been working with early customers to refine the product and optimize the infrastructure. Our public launch was September 2024.

Ideas are like children. You don't just need to give birth to them; you also need to raise them, teach them, challenge them, and show them the world. Giving birth to an idea is a necessary condition and sets the boundaries for so much of what it can achieve. But if you're unable to raise it to become a world champion, it isn't worth anything.

lobochrome

portfolio of andrew sider chen

lovingly made in berkeley, california

Ideas are like children. You don't just need to give birth to them; you also need to raise them, teach them, challenge them, and show them the world. Giving birth to an idea is a necessary condition and sets the boundaries for so much of what it can achieve. But if you're unable to raise it to become a world champion, it isn't worth anything.

lobochrome

portfolio of andrew sider chen

lovingly made in berkeley, california

Ideas are like children. You don't just need to give birth to them; you also need to raise them, teach them, challenge them, and show them the world. Giving birth to an idea is a necessary condition and sets the boundaries for so much of what it can achieve. But if you're unable to raise it to become a world champion, it isn't worth anything.

lobochrome

portfolio of andrew sider chen

lovingly made in berkeley, california