Conversation

Maggie 🔜 visting SFO 🇺🇸
@Mappletons
1/ We've been working a new protocol at
@hashintel
It's called the block protocol (but NOT about blockchain or NFTs!) It allows you to build reusable blocks (aka. components) that are interchangeable across website/apps It takes a minute to explain, but I’ve drawn pictures…
Diagram of a set of individual blocks mapping onto the block protocol, and being inserted into multiple web apps like documents and website builders.
28
771
Maggie 🔜 visting SFO 🇺🇸
@Mappletons
2/ Blocks are the fancy interactive elements you can add to most doc editors and websites nowadays – text, tables, checklists, images, embeds, etc. You’ve seen these in apps like Notion, Wordpress Gutenberg, and Coda
A web app with a series of individual blocks types inside, and a picture of the typical block picker menu that appears when you type slash into one of these editors.
2
26
Maggie 🔜 visting SFO 🇺🇸
@Mappletons
3/ At the moment most apps create these from scratch and keep them contained within their ecosystem. You can’t move blocks from one app to another. So we keep reinventing the same blocks over and over. Everyone spends more time building. Fewer people get to use what’s been made
Three block based apps with three different table blocks inside them, with red crosses between them signalling that you can't move any of these table blocks between the applications
1
44
Maggie 🔜 visting SFO 🇺🇸
@Mappletons
4/ The Block Protocol (BP) is an attempt to save us from this sad fate of walled block gardens. Blocks that follow the protocol can be embedded into any app that follows the protocol. It’s the DMZ of interoperability. Build a block once, embed it anywhere that accepts BP blocks
A diagram of a single block that displays a book cover, title, and author being embedded into three separate web apps that follow the Block Protocol.
2
42
Maggie 🔜 visting SFO 🇺🇸
@Mappletons
5/ BP blocks can *read data* from the apps they’re embedded in, and send suggested updates back. Blocks declare what kind of data they expect to receive (numbers, strings, email address) & what they can do with it (display, transform) Which leads us to structured data…
A web app with blocks inside. An arrow shows that the web app's database can send data to the blocks inside it, and a dashed arrow in the other direction shows a block can send suggested updates back to the database.
A diagram of the UI structure of a block showing slots where an image, name, and a set of three tasks can fit. We also see a diagram of the data structure the block expects to receive; it expects a Person object that has a picture, a name, and a tasklist.
1
26
Maggie 🔜 visting SFO 🇺🇸
@Mappletons
6/ One lofty, formidable dream we’re going after with the BP is to help enable the semantic web. The possible data types that BP blocks accept aren’t just numbers and strings. They also recognise things humans would recognise as types: Person, Company, Book, Movie, etc.
A list of human-friendly types blocks might accept that includes Person, Book, Movie, Company, Article, Game, Festival, Restaurant, Recipe, Flight, and Map. We also see a diagram of the "Recipe" and "Flight" types going into two blocks that visually display their data inside of blocks.
2
48
Maggie 🔜 visting SFO 🇺🇸
@Mappletons
7/ We can define these human types with ‘schemas’ – sets of properties and values. Eg. A “flight” schema would have properties like “departureAirport” and “flightNumber” This enables us to build specialised blocks that display specific kinds of data. Blocks like…
A diagram of the schema for a flight showing the typical properties a flight might have; a departure time, a flight number, an airline, and a departure and arrival airport. We see this schema pointing towards a JSON file that holds the values of these properties inside it. Eg. departure airport: "LHR". We then see than JSON object being passed into a block component that renders it with a graphical display of the flight number, destination, and a small map of the flight path.
2
24
Maggie 🔜 visting SFO 🇺🇸
@Mappletons
9/ There’s been a 🦆-ton of previous work on schemas & the semantic web. We’re not reinventing any wheels. We’re respectfully building off previous art. People can use existing schemas (eg. schema.org), BUT we also let people extend schemas and define their own…
2
22
Maggie 🔜 visting SFO 🇺🇸
@Mappletons
12/ To recap: We now have a standard way… to create reusable blocks… that can read / write semantic data… and be used in any app that opts into the ecosystem. Which saves us from block fortresses. And blocks create structured data by default, without devs manually doing it.
4
20
Maggie 🔜 visting SFO 🇺🇸
@Mappletons
If you're a developer curious about building blocks and want to keep tabs on the project, ⭐️ starring and 👀 watching the Github repository is a good way to get updates: github.com/blockprotocol/ I'll add updates here in the coming months too. It's early days; we're just beginning
github.com
GitHub - blockprotocol/blockprotocol: The open block protocol Þ
The open block protocol Þ. Contribute to blockprotocol/blockprotocol development by creating an account on GitHub.
5
34