The Product Design of our video calling API

How we approached the design of our Daily.co API

With our recently announced (March 2019) Daily.co video call API, we wanted to take a moment to highlight our design approach, for the API. That may sound counterintuitive. After all product design, in the most general of terms, is the process of creating something that solves a user's problem. Yet it’s certainly more nuanced than that.

For our team, product design requires understanding a user's requirements, their jobs-to-be-done, and their frustrations. We also must have a comprehension of any technical constraints, the competitive landscape, visual design systems, business requirements, usability and much more.

Holding onto that thought, it makes sense that the development of our API required deep levels of both, product design thinking and technical engineering prowess.

# Why build our API?

Let's start with a few simple questions, yet ones that never have simple answers. Spend enough time in startup world and you'll eventually be asked, "Who is your product for?" or "How is it better than X?".

These are good questions to ask, yet tough one to answer succinctly. So let's dive in deeper.

## Who is our API for?

From 10,000 feet this may seem like an easy one to answer, and in some respects it is. Our video call API is aimed at web and app developers. If you write code than our API is geared towards you. Our [developer documentation](https://docs.daily.co) reflects that.

Yet we also designed our API in a way that's **so easy to use** that any product team or designer with some basic front-end knowledge can prototype or construct a proof of concept without engineering support.

Holistically speaking, our API is aimed at developers and product teams looking to integrate a video calling solution into a product.

## How is the API different than our other products

[Daily.co TV](https://daily.co/tv) was the first product our founding team built. It's aimed at teams with offices, and remote workers. For example, if you have conference rooms in New York, and Berlin — plus remote employees — Daily.co TV is perfect for connecting everyone together. It also doubles as an always-on portal. Daily.co TV is a paid upgrade.

On the other hand our [free browser calls](https://www.daily.co/browser-calls) allow anyone to harness the power of video calls for free — through a desktop computer or mobile browser. [Sign up today](https://dashboard.daily.co) to claim your custom video calling subdomain.

[The API](https://daily.co/api) is our third product offering. You can get started for free, yet we offer two upgraded [tiers](https://daily.co/api/pricing) for companies at scale. Our API calls leverage much of the same technology as our browser calls, while adding the robust control developers need. At the same time, remote peers can join an API call via a Daily.co TV or browser.

In bullet form:

- Daily.co TV: conference room and always-on hardware
- Free browser calls: for remote employees and computer meetings
- Daily.co API: for developers looking to integrate video calling

## Why? Remote future

We want to bring video calls to as many folks as possible, our free browser calls cracked opened that door, yet the API pushes it wide open. With the API we can now offer our video calls — and the promise of remote collaboration — to many more users through talented builders and developers like yourself.

## How is our video API different?

Our API allows fast, easy setup in just minutes. Developers get UI-ready calls, and we're priced very competitively with a simple API pricing formula that's easy to understand. We differentiate with our ease of use, robust feature set, technical stability, security and usability. If you have any questions, don't hesitate to ping us either!

# Designing the API

Now that we know a little about why we built the API, let's highlight a few key portions of the design process.

## UI-ready and user friendly

Our <a href="https://daily.co/api/demo">API demo</a> highlights UI-ready calls

Usability is but one pillar of our design philosophy. We aim to remove friction and build user friendly experiences in everything we create. So let it be no surprise that we carried that methodology over to our API.

We wanted to ship an API that allowed developers to **focus on their** product experience. You should trust that Daily.co carries the burdens involved with designing video calls. That said, our API video calls come UI-ready, which means that all API generated calls are prepackaged with the same UI/UX functionality that our free browser users have come to love.

For example, calls created via the API feature the same layout; video grid; controller UI; responsive layouts; and interaction paradigms as our free browser product. Here’s a shortlist of some design scenarios that our UI-ready calls solve for:

- Responsive design
- In-call interactions
- Device permissions
- Camera/mic switching
- Bandwidth muting
- Browser support
- Chat
- Plus much more!

[Try our demo](https://daily.co/api/demo) to see a real time example of an API call.

## Upgrades and checkout

Animation of our checkout flow

Product design must account for a company's business plan. For us, the API also was a critical piece of our monetization strategy. We needed to design, not only the experience of an API video call but for a users checkout flow and much more. For example:

- Where, in product, does a user upgrade
- How does a user upgrade or downgrade
- Error and success cases for checkout
- Prorating and refund strategy
- Marketing and pricing explanations on Daily.co

## Responsive design

As a web-based tool, it's critical that we support different screen sizes, devices and formats. This is why we fully support an adaptive design language for all of our products. From, large desktop monitors, down to mobile phones, our UI responds appropriately.

## Design details

For now, API calls can be embedded in your product or site using an `iframe`. You cannot manipulate UI elements, or move them outside of that canvas. For version 2.0 we hope to offer more interface customization.

Visually, we use a custom designed (in-house) icon set that is minimal and always supported through typographic labels, for usability. The typeface used throughout is, [Graphik](https://commercialtype.com/catalog/graphik).

## API configuration

As alluded to earlier in this post, we’ve added quite a few [configuration options](https://docs.daily.co/reference#customizing-the-in-call-ui). If you’d rather not have chat, turn it off. Want to set up a broadcast — where only administrators can send video, audio and screen shares — go ahead!

Whether you are building a 1-to-1 mentor app or a livestream platform, our API gives you the ability to cater your end users experience.

## A collaborative, and iterative, team approach

We spent many months working through our API and we were fortunate enough to have several great beta partners using the API heavily, including [Standuply](https://standuply.com) and [YC Startup School](https://www.startupschool.org/). Concurrently, our engineering team worked on improvements to our Intercom Messenger app through — the lens of our API — to offer support for cloud recording. Each of these projects fed new knowledge into the design of our API.

For example, in working on our Intercom updates, we realized we needed new breakpoints and design updates, which as a designer I would then tackle in tandem.

Through conceptualizing and building our [demo app](https://daily.co/api/demo), we also realized that much of the functionality we offer (in-call) we wanted to leave up to a developer. For example, it felt important that a developer have control over start, leave and resize call methods, plus more. This way, developers can taylor the video call to their flow.

---

We are pleased to have released our public API and are excited to see what developers, like yourself, build with it! Our design approach is constantly evolving, yet many of our core principles are well defined. If you have any feedback, do not hesitate to reach out to us directly! We're just an [email](help@daily.co) or live chat away.

Daily.co is a complete platform for 1-click video calling.
Learn more about our products: Daily.co API, a video calling API for developers; Daily.co TV for conference rooms and always-on portals; or our free no download browser video calls.

Recent posts