Whimsical LogoWhimsical LogoWhimsical Logo

Brand
Get all logo versions.
Download

To-Do List App Template

A to-do list app template, in the design sense, is a set of wireframes for building the app itself: the screens for capturing tasks, scheduling them and seeing what's due. This free one has 15 screens from the Todoist iOS app, including an empty inbox, quick add, task detail, a date picker, Today and Upcoming views, browse, search and display options. Edit it online in Whimsical to design a task manager or a to-do feature.

Todoist's task capture and planning screens as editable wireframes, from quick add to Upcoming.

What's included

  • Capture. An empty inbox that reads Capture now, plan later, a quick add sheet with date, deadline, priority and project, and a full inbox with sub-task counts.
  • Task detail. Project, date, priority, a reminder 30 minutes before, deadline, location, sub-tasks and comments on one screen.
  • Date picker. Today, Tomorrow, This Weekend and Next Week shortcuts above a calendar, with a time, a duration and a repeat setting.
  • Today and Upcoming. An overdue section with Reschedule in Today, and a week strip in Upcoming that groups tasks by day.
  • Browse, search and display. Projects, favorites, filters and labels, search that includes completed tasks, and display options for list, board or calendar layouts with sorting and grouping.
  • Onboarding and plans. Sign up with Apple, Google or email, a For Myself or With My Team question, settings and a Premium plan screen.

Why start from a to-do list app template?

  • Make capture instant. Capture has to be faster than forgetting. Quick add is one task field with chips for date, deadline, priority and project, so nothing has to be filed first.
  • Design the empty inbox. It's the first screen every new user sees, and Todoist uses it to explain the inbox in two short lines.
  • Separate capture from planning. Inbox, Today and Upcoming split collecting tasks from scheduling them, the structure many task apps share.
  • Give overdue tasks a home. Today puts overdue tasks in their own section with a Reschedule action, above the day's plan.
  • Leave room for power users. Display options, filters, labels and search give heavier users control without cluttering the main views.

How to use this template

  1. Duplicate the template. Copy the 15 Todoist screens into your Whimsical workspace.
  2. Define a task. Decide which fields a task has, like due date, deadline, priority, labels or assignee, then edit task detail and quick add to match.
  3. Choose your views. Keep Today and Upcoming, or lean on the board and calendar layouts in display options.
  4. Test quick add. Count how many fields capture shows before it slows people down, and try typing dates in plain words.
  5. Plan collaboration. If teams will share the app, add sharing and assignment screens and follow the With My Team branch of onboarding.

To-do list app vs project management app

A to-do list app is built for individuals capturing and scheduling their own tasks, so it focuses on quick add, due dates and daily views. A project management app is built for teams, adding assignees, dependencies, timelines and status reporting. Todoist sits closer to the first, though its onboarding asks whether you'll use it for yourself or with a team.

Frequently asked questions

  • Design a to-do list app from capture outward. Start with one input that takes a task in seconds, with optional chips for date, priority and project. Then design where tasks land, usually an inbox, and how they're planned, with views like Today and Upcoming. Keep sorting and filters a level down. This template has both capture and planning screens ready to edit in Whimsical.

  • A to-do list app should have fast task capture, due dates and reminders, projects or lists, views for today and the coming days, search, and sorting and grouping options. Natural language dates help a lot: Todoist's Quick Add turns a typed phrase like tomorrow at 4 PM into a due date. This template wireframes the core with 15 screens from Todoist.

  • Todoist's iOS app. It's a long-standing reference for fast capture, and its quick add and inbox show how little a task needs at first. The 15 wireframes were built from screenshots on Mobbin, which sit next to them with links to each screen. Task text is generic sample content, and Whimsical isn't affiliated with Todoist.

  • This template was made with App Wireframe, an open-source agent skill that rebuilds app screens as editable Whimsical wireframes. Name another task manager and it pulls the key screens from Mobbin, then places each wireframe next to its screenshot. Building your own to-do app? Give it screenshots of your designs instead. Under the hood it's an AI agent using the Whimsical MCP server, with the Mobbin MCP server added for apps you name.

  • An empty to-do list screen should say what the space is for and how to fill it. Nielsen Norman Group's guidelines for empty states call for learning cues and a direct path to the key task. Todoist's empty inbox does it in a few words: Capture now, plan later, plus a line saying the inbox is the go-to spot for quick task entry.