Don’t Worry be API (when designing)

There has been an explosion in the number of online tools and services offering APIs and integrations in recent years. A big part of why Slack grew so fast was because it provided the ability to connect to its APIs making it easy for Slack´s customer to extend the core functionality.
‍

As a team of designers, we often wondered how could we use all these amazing services in our app designs without having to ask developers for help — we had so many ideas but found we were frequently frustrated by not being able to implement them.

‍

Moving from “no code” to “yes API”

‍

When we looked around at the “no code” tools that helped non-developers build functionality we found that you often had to learn a whole new tool. We wanted a way to leverage all these amazing APIs without learning yet another tool at all (there are already too many of them out there).

‍

What we realised is that we could allow them to work in their favourite design tool (well okay — Figma — for now), and then just provide a way to connect their design to the functionality they needed just using APIs. This meant less learning for the designer, whilst still being flexible enough to connect to whatever API based service was needed.

The end result — Bravo Studio — is a really powerful tool that can be used for anything from realistic prototypes to full blown enterprise apps.

Because I’m API

‍

Before you go much further in exploring the API space I think it’s worth me explaining a few of the essential terms and acronyms:

• API — is short for application programming interface, and its purpose is to describe how one computer system can talk to another one.
  ‍
• RESTful API — There are lots of standards for APIs, so some older systems can be harder to communicate with, but generally, on the web the most common API is a RESTful API.
  ‍
• Request — The core communication action of an API.
  ‍
• GET, POST, PUT, PATCH, DELETE Verbs — These are the different types of request for a RESTful API. The most common requests are GET to get data and POST to send data.
  ‍
• Body — Where the data being sent or received is contained in the request.
  ‍
• Headers — These are properties that are sent with a request, highlighting such things as the type of data in the request body, and security information.
  ‍
• Authentication — Often, an API needs to be authenticated so that the receiving service knows that the right person is making the request. The most common way is to have an Authentication header in the request, which contains a key to prove the access should be allowed.
  ‍
• JSON — This is a format for exchanging data that makes it simpler to be processed by computers.
  ‍
• Webhooks — This is a request that gets triggered by a service, so for example, when you submit a Typeform, you can have Typeform trigger a webhook to send a request with the submission data.

Shiny API People

‍

So, what sort of API based services are there? These days pretty much every service has an API of some description, but they vary in how deep the integration goes. Here are a few of our favorites:

• Airtable: A web-based database. This is one of the best ways of storing data online which can be easily administered while providing a way of connecting with APIs (it probably has some of the best documentation too).
  ‍
• Typeform: One of the best ways of collecting data - one question at a time.
  ‍
• Salesforce: To be honest this is not fun to work with; but many companies use it to manage their sales data and it has a good API.
  ‍
• Contentful: This is an API based Content Management system it’s basically a way to administer large amounts of content.
  ‍
• Zapier: This is a really useful service that can connect APIs together so you can have a Typeform submission be sent directly to be stored in an Airtable.
  ‍
• Postman: A super helpful tool that lets you test and experiment with APIs.

‍

I’m only API when it rains

By now I am sure you are dying to know how to put all this together and start turning you designs in to awesome mobile apps. Well, this is something I can help with.

If you head over to https://www.bravostudio.app, you can sign up and start building. We would love to hear your feedback and learn what you have built.

‍