← back to the gallery

Todoist: warm task-planning landing with clear interface examples and hand-drawn accents

Tier
inspiration
Roles
hero, explainer, capability, feature, proof
Feel
light, playful, minimal, warm, saas
Motion
pan, reveal
Source
public-site
Site
https://todoist.com
Licence
Captured from a Refero-hosted recording and the live site; description only, no redistribution of the source.
Captured
2026-10-06
Captures
frames: https://images.refero.design/styles/refero.design/video/2f30775f-dfdb-4214-8fda-f677141984b8.mp4
both: https://todoist.com

What it does

A concise statement sits beside a task-list window and phone on a warm pale background. Customer evidence leads into white and beige examples of capture, organization and calendar planning. People and proof figures add scale before a yellow illustrated video cover and colorful template previews.

Section roster

1. Task-planning introduction with desktop and phone examples. 2. Customer evidence. 3. Task capture example. 4. Organization and focus interface. 5. Calendar planning example. 6. People and proof figures. 7. Illustrated video cover. 8. Template previews.

Why it works

The document moves from a simple promise to recognizable task and calendar views. Small hand-drawn accents soften the precise interface structure without overwhelming it.

Source and capture notes

Refero [style page](https://styles.refero.design/style/729ba7a8-35d5-44f3-abc0-1078ff6a3467) and [recorded video](https://images.refero.design/styles/refero.design/video/2f30775f-dfdb-4214-8fda-f677141984b8.mp4); [live site](https://todoist.com) checked on 2026-10-06. The recording is a point-in-time reference; current site content may differ. Descriptions distinguish the recording from the current page where they differ. Layout and motion notes come from sampled recording frames and automated live captures; interactive controls were not comprehensively tested. The current opening updates the usage and review figures. The live consent notice was dismissed using its real Close this consent banner control.