Paper prototype do today app and wearable
- 1. Assignment Paper Prototyping Name: Vipul Gaur Email ID: Vipul.gaur@gmail.com
- 2. Assignment Instructions Suppose you’re working as a PM at DoToday, a startup working on a next-gen to-do list and task management app. Seeing the rise in usage of wearable devices, the company is developing apps for both smartphones and smartwatches (like Moto360, Galaxy Gear, etc). As the sole product manager working on the apps, you have a few ideas regarding the design and functionality of the apps. To communicate these to your team, you need to develop paper prototypes for the app. Note: You need not worry about how the apps for smartphone and smartwatch will communicate between each other and what data can be shared. Only think of the functionalities you would like to have in both of these apps and sketch the paper prototypes based on that. Also, don't worry about the nuts and bolts like login or registration; concentrate on the cool stuff. 1. Create the required paper prototypes and place the screenshot of each screen on relevant slides 2. Prepare a slide showing the flow of your paper prototype
- 3. Mobile
- 4. Screen 1|Mobile (First Screen Post Sign-up) Initial Prototype Defaults to pending task. Swipe to view completed tasks in upper pane. Toggle between Work and Home Views Icons Legend Email Tasks Appointments Notes To-Do-List Grocery Work Home “DT” Icon to take user back to Work or Home views Reminders Search Navigation to view items due Today, coming Week or in future “Quick Actions” Section will allow user to add items in various categories quickly
- 5. Screen 2|Mobile (Reminders) Initial Prototype Click on “…” to delete or stop reminders Icons Legend Email Tasks Appointments “DT” Icon to take user back to Work or Home views - Clicking delete will remove the reminder from the list. - Stop reminder will not show any more reminders for that task. Pan to view more reminders.
- 6. Screen 3|Mobile (Email Tasks) Initial Prototype Click on “…” to delete email task or to add new sub tasks or notes related to email task Click on “more..” to view detailed view of email task Green and red header at task level indicates completed and pending tasks. By Default all tasks are shown they can be filtered using filter icon. User can mark the email task closed or re- open the existing email task. User can share email task with contacts using email or SMS. Email tasks can be created for work or for home by forwarding emails at work.dotoday@dotoday.com or home.doday@dotoday.com Scroll down to view email details
- 7. Screen 3|Mobile (Email Tasks) Initial Prototype Icons Legend Add Sub-Task Add – Related Notes Share Task More icon to expand email details Icon indicating linked sub- task Icon indicating linked notes Filter Email SMS - Sharing Using Email - When user clicks on email icon on sharing layover, System will use the default email app within the mobile and add the Email task as subject line. - Body of task will have a short link to open the email task. - Email Recipient (s) will be able to click the link to view the details. - User will be able to draft the email below this section. - SMS sharing will only text in following format: <User, want to share email related task with you. Click <short link> for more details. - Clicking on linked tasks and notes will take the user to the linked item.
- 8. Screen 4|Mobile (To-Do-List) Initial Prototype Click on “…” to delete to-do-list task or to add new sub tasks or notes related to to-do-list task Click on task to access to-do- list details. Green and red text within task shows when the task is due or when it got completed. By Default all tasks are shown they can be filtered using filter icon. User will be able to delete and mark task as complete. They can also reschedule time and date. User can share email task with contacts using email or SMS or WhatsApp. Chick on Share link to view sharing options
- 9. Screen 4|Mobile (To-Do-List) Initial Prototype Icons Legend Change Date Change Time Linked Items Indicator WhatsApp - Change Date icon will let the user change the due date for the task. On click of change date icon, calendar will open and user can select a new date. - Change Time icon can let the user change due time for the task. On click of a change time icon, app will give option to change time. - When user selects Share using WhatsApp option, short URL for the task will be created and app will open WhatsApp for sharing with contact. - Clicking on linked tasks and notes will take the user to the linked item.
- 10. Screen 5|Mobile (Appointments) Initial Prototype Click on “…” to cancel or reschedule appointment Click on task to access appointment details. Green and red text within task shows when the appointment is starting or when it got finished. By Default all tasks are shown they can be filtered using filter icon. User will be able to delete and mark task as deleted. They can also reschedule time and date. User can share the task through email or event. Scroll down to view email details Click on “…” to delete past appointment or add tasks and notes post discussion.
- 11. Screen 5|Mobile (Appointments) Initial Prototype Icons Legend Add New Event - Change Date icon will let the user change the due date for the appointment. - All will attach the appointment into ICAL format while sharing with other contacts. - User can add a new appointment by clicking “+” on the appointments screen as well.
- 12. Screen 6|Mobile (Grocery) Initial Prototype Click on “…” to delete grocery item Click on item to view details User will be mark the task complete by clicking “Ok” button or go back to list view by clicking cancel Pan down to view more items Click on “+” to add new item to list
- 13. Wearables
- 14. Screen No. 1,2|Wearlables (Home Screen and Work Screen) Initial Prototype Icons Legend Work View Home View Tasks created directly through Email Appointments To Do List Notes Home Screen NavigationSwipe To change the pending dates grouping. Click on Icons or red (pending) or green (Completed) number to view next screen Swipe To change between completed and pending tasks
- 15. Screen No. 3|Wearlables (Reminders) Initial Prototype Icons Legend Reminder (Bell Icon) Close Button Pan to view all reminders Click on bell icon at the top to view list of all the reminders - Icons next to reminder item to indicate the reminder type. - User can press “Close” button to dismiss the reminder. - Text next to icon to indicate due time. Click the reminder type icon to open the original item which triggered the reminder.
- 16. Screen No. 4,5|Wearlables (Home Screen and Grocery) Initial Prototype Icons Legend Tasks created directly through Email (Email to: dotoday.home@dotoday.com) Appointments To Do List Notes Home Screen Navigation Grocery List Cancel Item Click on Grocery Icon to open Grocery list - Grocery item will be shown in following format. “Item, quantity” Example: Sugar, 2 KGs - User can select the item on check- box to mark it completed and item will be moved out from the pending list. Click on item to view detail Defaults to pending items. Swipe to view completed items
- 17. Icons Legend Completed Linked sub-tasks Pending sub-task Add Sub-Task Add linked Note Complete button Reopen Screen No. 6|Wearlables (Email Tasks Work/Home) Initial Prototype Defaults to pending task. Swipe to view completed tasks Pan to view next email - Users can create email tasks in work and home views by sending email to work.dotoday@dotoday.com and home.dotoday@dotoday.com. - Users will be able to view sub-tasks and notes on click of icons. - Click on home icon on top will take the user back to work or home views. - User will be able to mark the email task complete or reopen existing completed email task.
- 18. Icons Legend Linked Tasks indictor Add a New Task Linked Items icon Save Completed Screen No. 7 |Wearables (To Do List – Task List) Initial Prototype Defaults to pending task. Swipe to view completed tasks Click on “+” to add a new To- do-List item Click on the task to view task details Pan to view more details - User can add sub-tasks and related notes to existing tasks. - New task can be added by clicking “+” button at the top. - User can mark the pending task as completed on task details page.
- 19. Screen No. 8 ,9,10|Wearlables (Existing Appointment List and New Appointment) Initial Prototype Defaults to pending task. Swipe to view completed tasks Icons Legend Reschedule SMS WhatsApp Shared Selected appointment icon (Office) Click on “+” to add a new appointment Click item to view details Click on Share icon - User can reschedule, share or cancel existing appointment from details page. - User will be able to share the appointment in SMS and WhatsApp. - SMS and WhatsApp sharing will only text in following format: <User, want to share email related task with you. Click <short link> for more details.