Use scheduling for arranging a time plan with attendees, availability, recurrence, reminders, and conflicts; booking for reserving a service/resource slot; calendar view for inspecting scheduled items; and date picker for choosing a single date field.
Use scheduling for arranging a time plan with attendees, availability, recurrence, reminders, and conflicts; booking for reserving a service/resource slot; calendar view for inspecting scheduled items; and date picker for choosing a single date field.
Practice the judgment: Imagine this situation: A recurring series expands in the wrong local time because the timezone was hidden or changed silently. Write the person's goal, choose one of these patterns, and show the state that helps the person continue. Use the decision rules and source trail below to explain your choice.
Review the underlying principle →| Dimension | Scheduling | Calendar view | Date picker | Time picker | Date range picker | Notification center | Conflict state |
|---|---|---|---|---|---|---|---|
| UI or UX | UI + UX - Workflow for arranging time, attendees, availability, recurrence, and reminders | UI + UX - Date and time grid for scheduled events, availability, and conflicts | UI + UX - Single-date text field with attached calendar menu | UI + UX - Time input with filtered slot list, period selector, and timezone selector | UI + UX - Two date fields with attached range calendar and apply controls | UI + UX - Durable user-opened notification history and action drawer | UI + UX - Competing-version resolution state |
| UI guidance | Render scheduling as a coordinated time-planning workflow with title, calendar, attendees, required and optional people, rooms or resources, location or conference link, date, start and end time, timezone, recurrence, availability, reminders, and save or send outcome. | Render a calendar view around a visible date range, mode switcher, today marker, weekday or time-axis labels, timezone, selected date, and event blocks with start, end, title, status, and all-day or timed placement. | Render a labelled date text field with a persistent format hint and a calendar button that opens a month grid aligned to the field. | Render a labelled time field with persistent hint text, filtered time suggestions, clear selected state, AM/PM control when using 12-hour display, and timezone control when interpretation depends on location. | Render separate labelled start and end date fields with persistent format hints, a calendar trigger, and a shared calendar menu that shows both endpoints and the days between them. | Provide a persistent notification entry point, usually a bell or inbox control, with a count that represents new unseen notifications rather than every unread item forever. | Show both competing versions near the affected object, field, paragraph, file, row, or branch with source labels such as Your edit, Server version, Mina's edit, Target branch, and Current published value. |
| UX guidance | Use scheduling when users arrange a meeting, event, availability rule, or recurring time plan that must account for people, calendars, rooms, buffers, time zones, recurrence, reminders, invitations, or conflicts. | Use calendar view when users need to understand or manage scheduled items by their position in time: date, weekday, duration, overlap, availability, recurrence, or resource assignment. | Use a date picker when choosing a date requires calendar context such as weekday, nearby availability, booking windows, deadlines, or recent/future scheduling. | Use a time picker when users are scheduling or choosing a specific clock time from predictable increments such as 15-minute or 30-minute appointments. | Use a date range picker when users need to select or inspect a continuous period such as a report window, trip, event, booking, campaign, or eligibility span. | Use a notification center when users receive enough asynchronous system or collaboration updates that they need a durable place to review, triage, and act later. | Preserve each version, explain why automatic merge was unsafe, guide users through the smallest conflicting unit, and make the post-resolution result reviewable before committing. |
| Good UI | A meeting scheduler shows required attendees, free/busy bars, suggested times, selected timezone, room availability, video link, recurrence, reminders, and a Send invitation button. | A clinic schedule shows June 2026 week view, today marker, timezone, business hours, all-day staff training, timed appointments, room labels, overlap warning, and a More link for crowded days. | An appointment booking field shows Appointment date, hint mm/dd/yyyy, a calendar button, July 2026 grid, disabled weekends, today marker, and selected July 14 date. | An appointment time field shows a label, hint that typing filters 30-minute slots, a 9:30 AM selected option, AM/PM selector, Eastern timezone selector, and canonical value 09:30:00. | An analytics report control shows Since and Until text fields, quick choices for Today and Last 7 days, a two-week calendar grid, selected August 3 start, selected August 14 end, and a filled band for days inside the range. | A bell opens a drawer with Unread and All filters, showing comment mentions, approval requests, export results, and background-job failures in newest-first order. | A field report says Conflict on supervisor comment, shows Your offline edit from 11:06 beside Server edit by Mina at 11:07, and offers Keep mine, Keep server, and Merge comment. |
| Bad UI | A recurring event editor hides whether changes apply to one occurrence or the whole series. | Calendar navigation resets filters, selected calendars, selected date, or opened event unexpectedly. | A grid of unlabeled numbers uses pale grey for unavailable dates but still lets users click them before showing a late error. | A dropdown lists 1,440 minute-by-minute options even though appointments are only available every half hour. | A calendar highlights only the first and last dates, leaving included days visually indistinguishable from unselected days. | Users ignore the center because duplicate low-value messages inflate the badge. | A save banner says Something went wrong and only offers Retry after another user changed the same field. |
| Good UX | A team lead adds three required attendees, sees one conflict at 10:00, chooses an 11:30 suggested time, adds a room and video link, sends invitations, and sees pending responses. | A dispatcher switches from month to week, opens Wednesday, sees three overlapping room bookings, chooses an available slot, and receives conflict-aware feedback before saving. | A user opens the calendar, sees weekends unavailable, moves to August, chooses Tuesday 11 August 2026, and reviews stored value 2026-08-11. | A user types 9, filters the list to 9:00 AM and 9:30 AM, chooses 9:30 AM, selects Eastern time, and submits canonical value 09:30:00 America/New_York. | A user chooses Last 7 days, sees 2026-08-08 through 2026-08-14 filled in the calendar, reviews both inputs, then applies the range. | Opening the notification drawer clears the new-notification badge while unread items remain available for later triage. | A user tries to sync an offline field report, reviews only the two changed fields, merges one comment, keeps the server contact number, and commits a resolved version. |
| Bad UX | A user moves one weekly event and unintentionally shifts every event in the series. | A user taps +3 more in a crowded date cell but the calendar navigates away instead of showing the hidden events for that day. | A user selects a disabled Saturday because it was only dimmed, then loses their previous month when the error appears. | A historical time-of-birth field forces a scheduling dropdown even though the user needs to type the exact recorded time. | A dashboard refreshes on every hovered day while the user is still deciding the end date. | Users mark all notifications read and lose the only record of an export job they still need to download. | The app silently keeps the newest server value and deletes the user's local note. |
| Best fit | Users coordinate time across people, resources, calendars, availability, or recurrence. | Users need to scan or manage scheduled events across dates, days, weeks, months, or resources. | Users are scheduling, booking, planning, or selecting a recent or future date. | Users choose appointment, meeting, delivery, pickup, reminder, or service times. | Users need to select a reporting, analytics, booking, scheduling, campaign, or eligibility period. | Users receive multiple asynchronous updates across objects, jobs, collaborators, approvals, or reminders. | Concurrent users, devices, branches, or background jobs changed the same object or location. |
| Avoid when | The user only needs one remembered date or time field. | Users only need to select one date for a form field. | The date is far in the past, such as a birthday or historic document date. | The answer is approximate, relative, unknown, or naturally expressed in words. | The task asks for only one exact date. | The product has only occasional current-action feedback that a toast or inline status can handle. | The user is managing an unpublished draft lifecycle rather than resolving competing edits. |
| Required state | Draft event state | Default calendar state with visible range, view mode, timezone, today marker, selected date, and event count. | Closed labelled text field with visible date-format hint and calendar button. | Empty labelled time field with persistent hint and optional timezone default. | Empty start and end fields with visible labels, date-format hints, and a calendar trigger. | Closed entry-point state with zero, new-unseen, and unread-but-seen counts. | Conflict detected state naming affected object and source versions. |
| Accessibility burden | Use labelled fields for title, attendees, required/optional role, date, start time, end time, timezone, recurrence, location, conferencing, reminders, and calendar selection. | Expose date navigation, mode switch, visible range, selected date, today, timezone, and event count as text. | Give the calendar button an accessible name and state that distinguishes opening from closing the menu. | Use a visible label and persistent hint that explain filtering, increments, and time range. | Label start and end fields separately and associate each hint and error with the correct field. | Announce new notification arrival with status semantics when appropriate, but avoid interrupting users repeatedly for low-priority center items. | Associate each conflict message with the affected field, row, line, paragraph, or file. |
| Common misuse | Treating scheduling as only a date field and a time field. | Using calendar view as a decorative month card for unscheduled content. | Using a calendar picker for a date of birth or other remembered historic date. | Using a minute-by-minute dropdown for a schedule that only accepts 30-minute increments. | Collapsing the range into one unlabeled field with ambiguous dash-separated dates. | Treating the badge count, unread count, and total notification count as one number. | Treating a conflict as a simple retryable save error. |