Weekly Warm-Ups 1: Checklist App
First weekly warm-up challenge was to build a Checklist App. I wanted to build something simple and not too distracting. Users could log in with either an email and password, Facebook account, or Gmail account. Each checklist could be personalized to have a different color theme to quickly recognize the list the user wanted to access. List items were separated into two categories: Incomplete and Complete. Lists could also be filtered by item name via an input field. Each list item could be left as minimal as possible with only an item name being required. Additional information, such as priority, due date, notes, and an uploaded image/photo could also be attached. When the checkbox next to the item is checked, that item would move to the completed tab after 3 seconds (giving the user time to undo checking an item if checked by mistake). An entire list could also be checked off by using the checkbox right next to the list name.
Sketches
Sketched out a few screens in OneNote. Thought about keeping the app simple, but having the options to add additional information to each list item. Took ideas from Jira and Microsoft Planner for expanded item information.
Figma Prototyping
Very quick prototype to demonstrate a user's workflow. Got additional icons from Figma icon libraries.
Hi-Resolution Mockup
Added options for light and dark mode. Wanted to keep the app looking mostly 'flat' to have it as less distracting as possible.
