Todo app

byJovakwin Litinov

Build a todo app

HomeTasksNotificationsLoginDashboard
Home

Comments (0)

No comments yet. Be the first!

System Requirements

System Requirement Document
Page 1 of 4

Todo App System Requirements Document

1. Introduction

The purpose of this document is to outline the system requirements for the "Todo App" project. This application is designed to help individual users manage their tasks efficiently by providing features such as categorization and detailed reminders.

2. System Overview

The Todo App is a task management application aimed at individual users. It allows users to create, categorize, and set reminders for their tasks. The app is designed to be intuitive and user-friendly, ensuring that users can easily manage their daily activities and improve productivity.

3. Functional Requirements

  • As a user, I should be able to create a new task.
  • As a user, I should be able to categorize tasks into different categories.
  • As a user, I should be able to set detailed reminders for each task.
  • As a user, I should be able to edit existing tasks.
  • As a user, I should be able to delete tasks.
  • As a user, I should be able to view all tasks in a list format.
  • As a user, I should be able to mark tasks as completed.
  • As a user, I should be able to filter tasks by category.
  • As a user, I should be able to receive notifications for upcoming tasks based on set reminders.
Page 2 of 4

4. User Personas

  • Individual User: A person who uses the app to manage personal tasks and improve productivity. This user values simplicity and efficiency in task management.

5. Core User Flows

  • User logs into the app -> creates a new task -> categorizes the task -> sets a reminder -> task is added to the list.
  • User views the task list -> selects a task -> edits task details -> saves changes.
  • User receives a notification -> opens the app -> marks the task as completed.

6. Visuals Colors and Theme

  • primary: #1E90FF (Dodger Blue)
  • primary_light: #63B8FF (Light Sky Blue)
  • secondary: #FF6347 (Tomato)
  • accent: #32CD32 (Lime Green)
  • highlight: #FFD700 (Gold)
  • bg: #F5F5F5 (White Smoke)
  • surface: rgba(255, 255, 255, 0.9)
  • text: #333333 (Dark Gray)
  • text_muted: #777777 (Gray)
  • border: rgba(200, 200, 200, 0.5)
Page 3 of 4

7. Signature Design Concept

The Todo App will feature an interactive "Task Universe" on the home page. Users will see their tasks represented as floating planets in a 3D space. Each planet's size and color will correspond to the task's priority and category. Users can click on a planet to view task details or drag to rotate the universe and explore other tasks. This concept will be implemented using @react-three/fiber and @react-three/drei for the 3D environment, providing an engaging and memorable user experience.

8. Interaction Model & Motion Direction

The landing page will utilize a "parallax" interaction model, creating a sense of depth and immersion as users scroll through their tasks. This will be complemented by animated transitions and hover effects to enhance user engagement and provide a dynamic experience.

9. Non-Functional Requirements

  • The application should be responsive and accessible on various devices, including desktops, tablets, and smartphones.
  • The app should ensure data security and privacy for all user information.
  • The system should be able to handle up to 10,000 concurrent users without performance degradation.
Page 4 of 4

10. Tech Stack

  • Frontend: React for Web
  • Backend: Python with FastAPI
  • Database: MySQL or MariaDB, using Alembic for migrations
  • Local orchestration: Docker and docker-compose
  • Server-side orchestration: Kubernetes

11. Assumptions and Constraints

  • The app is intended for individual users and will not initially support collaborative features.
  • The application will be developed with a focus on the UK market, considering local time zones and preferences.
  • The app will not include AI capabilities in its initial version.

12. Glossary

  • Task: An item that a user wants to manage, which can include details such as a title, description, category, and reminder.
  • Category: A classification that helps organize tasks into groups.
  • Reminder: A notification set by the user to alert them about a task at a specified time.
  • User: An individual who interacts with the app to manage personal tasks.
Home design preview
Home: View Task Universe
Login: Sign In
Dashboard: View Task List
Dashboard: Filter by Category
Tasks: Create New Task
Tasks: Set Category
Tasks: Set Reminder
Dashboard: View Updated List
Tasks: Edit Task
Tasks: Save Changes
Tasks: Mark Complete
Notifications: View Alerts