The User Interface
Trevor AI's user interface consists of 3 main components:
The Header Menu
The header menu on top of the app UI contains:
- Trevor's Logo, on the left, as the home button
- The currently visible calendar date, in the center, which opens the date picker when tapped.
- Filters for the calendar view, on the right, such as Daily, 3 Days, Weekly and Monthly.
- The main menu at the far right, illustrated by an icon of a meditating human, containing links to My Progress dashboard, Account Settings, Calendar Options, Pro Plan details, What's New, How-to Guide, Privacy Policy, Terms of Service, Cookie Policy and Logout button.
The Task Hub
The Task Hub (previously known as the "inbox") displays your tasks, organised by lists. It's located on the left side of the UI (below the header menu) on larger screens, or can be opened via a button on mobile.
By default, under each list the top 3 tasks are visible. Each list title can be clicked to expand it and show all of it's visible tasks, as well as the list's note.
Tasks can be dragged from the Task Hub into the calendar to schedule them.
The Task Hub also contains:
- The Add New Task Panel, used to create tasks
- You can type a title for a task to create it.
- You can assign the task to a list other than the default / starred list, by either clicking the hashtag '#' button or type '#' in the title field.
- You can define a date and or time using natural language, to create a new scheduled task.
- The Control Panel on top, which contains the following Task Hub options:
- A lists dropdown to expand a selected list, similar to clicking the list's title.
- A search field for tasks.
- 'Show Scheduled' and 'Show Completed' filters, which make scheduled and or completed tasks visible in the Task Hub, illustrated by icons.
- 'Show Overdue' filter, which only shows scheduled tasks which are overdue and have not been marked as completed
- A button to go to list management mode for adding and editing lists.
- Each Task contains:
- A checkbox to track it's completed state.
- A title, which is editable on tap.
- A default duration, predicted by Trevor's AI and easily editable by tapping on it.
- A scheduling icon, which expands the task on tap, revealing the following options:
- 'Repeat' dropdown, to set recurrence rules for tasks
- 'Set due date' button
- Quick and Smart scheduling suggestions, which are a grid of buttons indicating optimal times to schedule the task in the timeline based on availability and a prediction algorithm.
- Once a task is expanded, it's scheduling suggestions are visualised in the calendar as Suggestion Events.
- An expand icon, containing the Notes field for the task and options to Complete, Edit, Move to List and Remove the task.
The Calendar Timeline
Calendar timeline on the right side of the UI (below the header menu), showing both scheduled tasks and calendar events.
- Calendar events and scheduled tasks are synced with either Google Calendar and/or Microsoft's Outlook / Office365 Calendar.
- All events can be moved, resized and edited, similar to traditional calendar apps.
Event Menu
Events and scheduled tasks can also be clicked on, which displays an Event Menu that includes all the actions for scheduled tasks, listed above.
Scheduling Suggestions Widget
Located on the top left of the calendar component, as described in the AI Features section.
Mobile UI
On Mobile devices with smaller screens, below the header menu, either the Task Hub or the Calendar is displayed at one time. The Add New Tasks Panel is displayed as an overlay. The 3 options are toggled from a bottom navigation bar.
Keyboard Shortcuts
Laptops and desktop devices can use the following shortcuts
- Arrow Left shows previous calendar period (1 day, 3 days, weekly, monthly)
- Arrow Right shows next calendar period (1 day, 3 days, weekly, monthly)
- Shift + Arrow Left shows previous calendar day
- Shift + Arrow Right shows next calendar day
- Option + Space (on Mac) and Ctrl + Space on Windows and Linux focuses the Add New Task Panel