Designing boards
Widget reference
All 26 widgets, what each is for, what it needs, and how it behaves when a feed is unavailable.
Twenty-six widgets. Each sizes its content from its own box, so most of the craft is choosing the right one and giving it enough room.
Media
| Widget | For | Needs |
|---|---|---|
| Image | One picture, fitted or filled | An uploaded file |
| Gallery | A folder on rotation | An uploaded folder or a synced network folder |
| Video | A clip, looped or once | H.264 MP4 recommended |
| Playlist | Mixed media in order | Items, each with its own dwell |
| Audio | Background sound or a chime | An audio file; off by default |
Text
| Widget | For | Needs |
|---|---|---|
| Text | Headline, body, price | Typing |
| Ticker | A crawling notice line | Typing, or a feed |
| Announcement | A full-bleed interrupt | Typing |
| Shape | Rules, blocks, dividers | Nothing |
Not every board wants a ticker. A crawling line on a board that is otherwise still draws every eye in the room to the least important thing on it.
Time
| Widget | For | Needs |
|---|---|---|
| Clock | Analogue or digital | Nothing |
| World clocks | Several cities in a strip | Time zones |
| Countdown | Time to a moment | A target date and time |
| Calendar | An agenda or month view | An ICS URL |
The calendar widget renders several events, not just the next one — a day with four things on it should look like a day with four things on it.
Data
| Widget | For | Needs |
|---|---|---|
| Table | Rows, aligned and paginated | CSV or JSON |
| Chart | Bar, line or donut | Figures or a feed |
| Gauge | One number against a target | A figure or a feed |
| Live text | A value pushed over the network | Something on the LAN to push it |
| RSS | Headlines | A feed URL |
| Weather | Conditions and forecast | A place, and internet |
| Storage meter | Free space and cache size | Nothing |
Interaction and web
| Widget | For | Needs |
|---|---|---|
| QR code | A link, menu or Wi-Fi handshake | A URL or payload |
| Directory | Names, rooms and arrows | A list |
| Buttons | Touch targets that switch layouts | A touch screen |
| Search field | Keyboard-driven lookup | A data source |
| Web frame | Any page, framed | A URL, and internet |
| Custom HTML | Your own markup | HTML and CSS |
Behaviour when a feed fails
Every fetching widget holds its last good value rather than blanking. The full table is in how offline works.
Choosing between two that overlap
- Table vs directory — table for figures and columns, directory for names and wayfinding arrows.
- Gallery vs playlist — gallery for pictures on one interval, playlist for mixed media each with its own.
- Web frame vs custom HTML — the frame when somebody else maintains the page, custom HTML when you do and want it to match the board.