Due Today

Winter/Spring 2023 Spark Project

4 min readJul 3, 2023

Introduction

Occasionally, a few assignments get lost in the mountain of work we have to do as students. Due Date Tracker solves this problem. We are a one-stop shop schedule manager for UC Davis students. Whether you have assignments on external websites on top of those on Instructure’s Canvas or you only have assignments in Canvas, our product allows you to be on top of all of your academic commitments and assignments.

The Team

Steve Chen — Project Manager
Samantha Zhang — Designer
Victoria Kerslake — Designer
Daksh Jain — Developer
Sohum Goel — Developer
Shuying Li — Developer
Borna Niknahad — Developer
Vinay Bidin — Developer

Timeframe

Jan — Jun 2022 | 16 weeks

Tools

React, Figma, Redux, Redux Persist, Canvas API, MongoDB, Express, NodeJS, Mongoose, React Calendar, React Carousel

The Project

Design

Low-Fi Wireframes:

For our low-fi prototype, we wanted to use a color palette that would be relaxing to see for the user. Instead of a color palette that is flamboyant, we decided to use cooler shades of blue to give off this relaxed effect.

Mid-Fi Wireframes:

We iterated upon our low-fi design to develop a brand identity. At this point of design, our choice of the color palette was finalized. As mentioned above, we would use cooler shades of blue and purple to evoke calmness. We leveraged the use of graphics to ensure users have a clear understanding of the mission and purpose of our project.

Hi-Fi Wireframes: REFER TO THE PROJECT SECTION

After developing a brand identity, we sought to create a seamless UI interface for the user. Our design is simplistic in nature, allowing users to easily understand the function of certain elements on a given page. We made a few changes from our transition to hi-fi wireframes. The one major change in our design was the background gradient. The last major feature change was the inclusion of a notes page.

Development

Home Page

Frontend:

Google Login
React Carousel

Backend:

Google Sub Saved in MDB database

Integration Page

Extensively Interacts with Canvas API
Filters Assignments by Day
Log Personal Notes
Persisted Notes
Assignment Progress Functionality

Profile Page

Extensively Interacts with the Backend
Dynamically Rendered — Name, Email, Canvas Token if provided
User Canvas Token Validation

Takeaways & Challenges

Designers: Synergyzing in a Cross-Functional Team

Our projects had two important pillars: design and development. Each team needed to be strong on its own. Once we completed a sprint, however, we need to come back together and update each other on the progress we made in the prior week. Without synergy between the two teams, we would not have worked well together. As the weeks progressed in this cohort, we progressively got closer as a team and worked together to complete the cohort strong.

Developers: Informing Everyone of Big Changes

There were many occasions where keeping individuals in the dark cost us a large amount of time, delaying our development. For example, one of our developers changed the file structure of our project and the PM was not in the know. Our PM, Steve Chen, merged those changes and it almost blew up of main remote repository on GitHub. After that incident, we because extra communicative, ensuring every big change was documented on our Slack.