UX as an API

William Bartlett

e-mail: w.bartlett@treeptik.fr
Twitter: @bartlettstarman
LinkedIn: punkstarman
GitHub: punkstarman

7 November, 2019 William Bartlett (@bartlettstarman) #Devoxx #uxasanapi 7 November, 2019 1 / 29

William Bartlett

Programmer
Agile coach
DevOps consultant
Fan of ergonomics

Mandatory Hand Raising Time

Disclaimers

This talk is not about

amazing UX
gorgeous graphic design
fully-loaded APIs

This talk is about a cool way of combining all of the above

Introduction

APIs abound

What are we using APIs for?

APIs abound

What are we using APIs for?

What tactics are we using to build our API landscape?

The English Plan

The Italian Plan

The Brazilian Plan

The French Plan

The Goal

The goal is the end-user

The Goal

The goal is the end-user

The end-user usually consumes a GUI

Micro-frontends

https://micro-frontends.org/

Third Party APIs

Problem

How to help customers seamlessly integrate your API into their UI?

Solution

Have API serve themeable UI fragments!

Related Work

There is nothing new under the sun

All of this has happened before, and it will all happen again. — J.M. Barrie, Peter Pan

Examples

Embedding

Ads
Chatbots
Charts
YouTube videos
Authentication
Payment
GDPR compliance

Web Components as API

Web Components

Part of the platform (webcomponents.org)
JavaScript modules served over HTTP
Custom HTML elements
Scoped CSS
Properties

Examples

YouTube
Google Maps
GitHub
Atlassian Jira, Confluence
Cookie consent

Demo

O gods of Demo, we beseech thee

Gotchas

CORS
Dependency versions ➡️ Rollup
Package size vs developer experience ➡️ Lit-Element

Conclusion

UI fragment API

themeable
seamless
documenting API usage

Going Further

Security, trust
Edge side includes
Organisms vs and molecules (Atomic Design, Brad Frost)
Animations