Timestamp is a notes and productivity app with the core idea of giving users feedback on how much their efforts are accumulating to motivate their growth. Users have access to multiple statistics to give them instant feedback in the moment or to watch as their numbers grow over time.
Timestamp was one more data heavy apps that I've designed for. Due to the nature of the app requirements, I knew that much of my design approach would be around creating strong list components that had multiple ways of filtering and sorting information. Pagination was another key requirement feature, due to possibility of the fast scaling data growth.
Next up, I built a custom modal form component that lets users easily switch between adding a Project, Task, or Note to the app. This form can be accessed in multiple ways to present users with options in how they use the app. Users can open the modal by clicking on a button in the global toolbar menu or add an item inline on their current Project or Task list.
The main data input of Timestamp is called a Note. Notes allow users to document what they work on each day in a flexible manner. Users can write only a few sentence fragments to jog their memory or create long-form notes with heavier formatting to organize their thoughts. Once a note is entered, it triggers automatic scripts that increment a users dashboard statistics.
Users have the option of working on Projects and Tasks for as long as they choose or can decide to complete an item and move on to something new. Once a Project or Task is completed, the app filters it into a Completed list where it can easily be accessed or reactivated for if a user decides to work on it again in the future.
Effective search features can help users feel more in control of their data. Timestamp gives users the ability to filter by Title, Description, Tag, or Date to help them refine their search capabilities. Results are displayed on cards that give quick snapshots of key details for easy skimming and filtering.
Users can navigate to the Activity page to see multiple statistics related to their effort. Timestamp organizes user data and breaks down activity by year, month, and daily statistics. Users can swap between year stats to see how much their effort has grown over time.
Setting up an app for multiple color modes can be challenging at times. Brand colors used for links and buttons might look great against a white background, but end up being too low contrast when it's inverted. Increasing the HSL lightness value of the main brand color by a few percentage points can keep colors accessible for key users without much optical difference on a darker background.
