meta-coins

byanay

Make a japanse design pomdoro app with timer,stopwatch i get coins for study mins and i can buy custom brekas with no limits of duration i can set of timer with PIP mode and app in english language

HomeShopTimerBreak
Home

Comments (0)

No comments yet. Be the first!

System Requirements

System Requirement Document
Page 1 of 4

Meta-Coins

Introduction

The Meta-Coins project is a personal application designed to integrate traditional Japanese design elements into a Pomodoro-style productivity tool. It focuses on time management by offering features like a timer, stopwatch, and a reward system using coins for study minutes. The app is intended for personal use, emphasizing a traditional, non-AI/automated context.

System Overview

Meta-Coins is a productivity application that combines time management techniques with a reward system. Users can earn coins based on their study minutes, which can be used to purchase custom breaks. The application supports Picture-in-Picture (PIP) mode and is available in English. The design is inspired by traditional Japanese aesthetics, providing a serene and focused user experience.

Functional Requirements

  • As a User, I should be able to use a timer to manage my study sessions.
  • As a User, I should be able to use a stopwatch to track time without limits.
  • As a User, I should earn coins for every minute spent studying.
  • As a User, I should be able to purchase custom breaks using the coins earned.
  • As a User, I should be able to set the duration of custom breaks without any limits.
  • As a User, I should be able to use the app in Picture-in-Picture (PIP) mode.
  • As a User, I should be able to use the app in English.
  • As a User, I should experience a traditional Japanese design aesthetic throughout the app.
Page 2 of 4

User Personas

  • User: An individual seeking to improve productivity through a traditional, non-AI-driven Pomodoro app with a focus on Japanese design aesthetics.

Core User Flows

  • User starts the timer -> Studies -> Earns coins -> Uses coins to purchase a custom break -> Sets break duration -> Resumes study.
  • User starts the stopwatch -> Tracks time -> Stops stopwatch when needed.
  • User enables PIP mode -> Continues using other apps while tracking time.

Visuals Colors and Theme

  • primary: #1A1A1A (deep charcoal)
  • primary_light: #3A3A3A (soft charcoal)
  • secondary: #D4AF37 (golden)
  • accent: #FF4500 (vibrant orange)
  • highlight: #FFD700 (bright gold)
  • bg: #F5F5F5 (light gray)
  • surface: rgba(255, 255, 255, 0.9) (soft white)
  • text: #000000 (black)
  • text_muted: #7F7F7F (gray)
  • border: rgba(0, 0, 0, 0.1) (light black)
Page 3 of 4

Signature Design Concept

The Meta-Coins app will feature a unique interactive design concept inspired by traditional Japanese Zen gardens. The home page will resemble a serene Zen garden with raked sand patterns that animate subtly as the user interacts with the app. Users can drag their finger across the screen to create new patterns in the sand, providing a calming and interactive experience. The timer and stopwatch will be represented as stones in the garden, which users can tap to start or stop. This design will be implemented using framer-motion for smooth animations and interactions.

Interaction Model & Motion Direction

  • Interaction Model: Parallax
    • The app will use a parallax effect to create a sense of depth as users scroll through different sections. The Zen garden elements will move at different speeds to enhance the immersive experience.
  • Internal Pages: Static
    • Internal pages like settings and history will have minimal motion to maintain focus on content.

Non-Functional Requirements

  • The application must be responsive and function seamlessly across various devices.
  • The app should maintain a high level of performance, ensuring smooth animations and transitions.
  • The design should be intuitive and easy to navigate, aligning with traditional Japanese aesthetics.
Page 4 of 4

Tech Stack

  • Frontend: React for Web
  • Backend: Python with FastAPI
  • Database: MySQL or MariaDB, using Alembic for migrations
  • Local Orchestration: Docker, docker-compose

Assumptions and Constraints

  • The application is intended for personal use, focusing on traditional, non-AI-driven features.
  • The app will be available in English, with no current plans for additional language support.
  • The design will strictly adhere to traditional Japanese aesthetics.

Glossary

  • Pomodoro Technique: A time management method using a timer to break work into intervals.
  • PIP Mode: Picture-in-Picture mode, allowing users to view the app in a small window while using other applications.
  • Zen Garden: A traditional Japanese garden style, often featuring sand and rocks, used for meditation and reflection.
Home design preview
Home: View Zen Garden
Home: Start Timer
Home: Start Stopwatch
Timer: Study Session
Timer: Earn Coins
Shop: Browse Breaks
Shop: Purchase Break
Break: Set Duration
Break: Start Break
Stopwatch: Track Time
Stopwatch: Stop Tracking
PIP: Enable Mode