ProfitMate is a free, easy-to-use business profit calculator for people worldwide — shop owners, restaurant owners, freelancers, small businesses, and online sellers. It helps users calculate product costs, selling prices, profits, profit margins, expenses, and break-even points without requiring accounting knowledge, and it must be useful internationally regardless of the user's country, language, or currency.
This document is the System Requirements Document for the first version of ProfitMate. The first version prioritizes reliability, simplicity, privacy, and genuinely working features over unnecessary complexity. It must be a genuinely interactive application with working calculations, functional buttons, input validation, and persistent local data storage — not a mockup, static landing page, or visual prototype.
The product is delivered as a mobile-first web application that runs entirely in the user's browser, stores all data locally, and requires no registration, login, paid API, paid database, subscription, or external server.
ProfitMate is a single-page, mobile-first web application. Its working surface is a local workspace: the user's products, expenses, settings, and calculation history live in the browser's local storage (IndexedDB or an equivalent local browser storage solution) and persist after refreshing or reopening the app on the same browser.
The application provides:
The application is delivered through a React frontend, a shared FastAPI backend process, and a MariaDB database service as provisioned infrastructure. The product's first-version behavior is local-first and requires no external server for its core function; the provisioned backend and database are infrastructure available to the environment and do not introduce registration, login, cloud storage, or any product capability beyond what is specified here.
Removed from scope
ProfitMate is a working instrument, not a brand statement. The user opens it to answer concrete questions — what does this product cost me, what should I charge, what did I spend, when do I break even — and expects the answers to be correct, legible, and available on a cheap phone in bright daylight, in their own language and currency.
Delivery ownership. The first version works without user registration, login, paid APIs, a paid database, a subscription, or an external server. All products, expenses, settings, and calculation history are saved in local browser storage and persist after refreshing or reopening the app on the same browser. There is no application-owned account identity and no cloud synchronization. The app must clearly inform users that local data may not automatically synchronize across different devices or browsers, and must never pretend that local browser storage is cloud storage.
Access. Every page is reachable without identity. The Landing page is the anonymous entry that explains the product before the user enters the local workspace; all working pages are part of that same local workspace.
Currency boundary. Changing the currency changes the display unit only. It never converts existing amounts using exchange rates, and no external currency API or paid service is required.
Offline boundary. Offline access to the core calculator features is claimed only after the service worker and app shell have been implemented and tested. Until then, offline support must not be claimed.
Future boundary. No future-version requirements were stated by the user. Everything in this document is current.
Each requirement is a distinct story point with provenance, lifecycle facts, and observable acceptance.
FR-01 — Genuinely interactive application (explicit) As a small business owner / seller, I should use a genuinely interactive application with working calculations, functional buttons, input validation, and persistent local data storage, so that ProfitMate is a real tool rather than a mockup, static landing page, or visual prototype.
FR-02 — Free profit calculator for non-accountants (explicit) As a small business owner / seller, I should calculate product costs, selling prices, profits, profit margins, expenses, and break-even points without accounting knowledge, so that I can understand my business profitability.
FR-03 — International usefulness (explicit) As an international user managing language and currency, I should use the app regardless of my country, language, or currency, so that it is useful to me wherever I operate.
FR-04 — Language selector with six languages (explicit) As an international user managing language and currency, I should select English, Arabic, French, Spanish, Portuguese, or German from a complete language selector, so that I can use the app in my language.
FR-05 — Device language detection with English fallback (explicit) As an international user managing language and currency, I should have the app automatically detect my device's preferred language on first visit when supported, and default to English when unsupported, so that the app opens in a language I understand.
FR-06 — Manual language change and persistence (explicit) As an international user managing language and currency, I should change the language manually at any time and have the selected language remembered, so that my preference persists.
FR-07 — Full translation coverage (explicit) As an international user managing language and currency, I should see all interface text, buttons, labels, menus, messages, validation errors, and reports translated, so that no untranslated text appears.
FR-08 — RTL for Arabic, LTR for others (explicit) As an international user managing language and currency, I should see a right-to-left layout for Arabic and left-to-right layout for other languages, so that the layout matches my reading direction.
FR-09 — World currency list (explicit) As an international user managing language and currency, I should choose from a comprehensive list of world currencies including USD, EUR, GBP, DZD, CAD, AUD, MAD, SAR, AED, EGP, INR, JPY, CNY, BRL, MXN, CHF, TRY, ZAR, and all other commonly used ISO 4217 currencies where practical, so that I can use my own currency.
FR-10 — Custom currency creation (explicit) As an international user managing language and currency, I should create a custom currency by entering a currency name, currency symbol, optional currency code, and number of decimal places from 0 to 4, so that I can use currencies such as "My Currency", "Local Business Credits", or a user-defined symbol.
FR-11 — Currency used throughout and locale formatting (explicit) As an international user managing language and currency, I should see the selected currency used throughout the entire application with numbers formatted according to the selected language and locale, so that figures read correctly for me.
FR-12 — Decimal-place support (explicit) As an international user managing language and currency, I should have currencies that use zero, two, or three decimal places supported, so that my currency's precision is respected.
FR-13 — Change currency at any time, stored locally (explicit) As an international user managing language and currency, I should change the currency at any time and have the currency preference stored locally, so that my choice persists.
FR-14 — No automatic conversion; clear explanation (explicit) As an international user managing language and currency, I should never have changing the currency automatically convert monetary values using exchange rates, and I should see a clear explanation that changing the currency changes the display unit and does not convert existing amounts, so that I am not misled.
FR-15 — No external currency API (explicit) As a small business owner / seller, I should use the app without an external currency API or paid service, so that the app remains free and self-contained.
FR-16 — Dashboard metrics (explicit) As a small business owner / seller, I should see total sales, total costs, gross profit, net profit estimate, profit margin, number of products, and recent calculations on a modern, professional dashboard, so that I can assess my business at a glance.
FR-17 — Dashboard date filters (explicit) As a small business owner / seller, I should filter dashboard values by Today, Last 7 days, Last 30 days, and All time, so that I can focus on a period.
FR-18 — Dashboard values from saved data; empty state (explicit) As a small business owner / seller, I should see dashboard values calculated from my saved data, not hardcoded demo numbers, and a helpful empty state when no data exists, so that the dashboard is truthful.
FR-19 — Product profit calculator inputs (explicit) As a small business owner / seller, I should enter product name, unit cost, additional costs per unit, selling price per unit, and quantity sold, so that I can compute product profitability.
FR-20 — Product profit calculator derived values (explicit) As a small business owner / seller, I should automatically see total unit cost, profit per unit, total revenue, total cost, total profit, profit margin percentage, and markup percentage, so that I understand the product's economics.
FR-21 — Product profit formulas (explicit) As a small business owner / seller, I should have the calculations use exactly these formulas: Total unit cost = Unit cost + Additional costs per unit; Profit per unit = Selling price − Total unit cost; Total revenue = Selling price × Quantity sold; Total cost = Total unit cost × Quantity sold; Total profit = Total revenue − Total cost; Profit margin (%) = Total profit / Total revenue × 100 when revenue is greater than zero; Markup (%) = Profit per unit / Total unit cost × 100 when total unit cost is greater than zero, so that results are correct and predictable.
FR-22 — Safe handling of zero and invalid inputs (explicit) As a small business owner / seller, I should have zero values and invalid inputs handled safely, and I should never see NaN or Infinity, so that the app remains trustworthy.
FR-23 — Selling price calculator inputs and formula (explicit) As a small business owner / seller, I should enter total unit cost and desired profit margin percentage and receive a recommended selling price using Selling price = Total unit cost / (1 − Desired margin / 100), so that I can price products to hit a target margin.
FR-24 — Selling price margin rejection (explicit) As a small business owner / seller, I should have margins below 0% or greater than or equal to 100% rejected, so that the calculation stays mathematically valid.
FR-25 — Selling price expected profit and margin display (explicit) As a small business owner / seller, I should see the expected profit per unit and profit margin in the selling price calculator, so that I can verify the recommendation.
FR-26 — Expense add/edit/delete (explicit) As a small business owner / seller, I should add an expense name, enter the amount, select a category, add a date, and edit and delete expenses, so that I can track spending.
FR-27 — Expense summaries by category and date (explicit) As a small business owner / seller, I should see expense summaries by category and by date, so that I can understand where money goes.
FR-28 — No double-counting of expenses (explicit) As a small business owner / seller, I should not have the same expense counted twice in the profit calculation, so that profit figures are accurate.
FR-29 — Break-even calculator inputs and formulas (explicit) As a small business owner / seller, I should enter fixed costs, selling price per unit, and variable cost per unit and receive Contribution per unit = Selling price − Variable cost, Break-even quantity = Fixed costs / Contribution per unit, and Break-even revenue = Break-even quantity × Selling price, so that I know when I break even.
FR-30 — Break-even quantity rounded up (explicit) As a small business owner / seller, I should have the required break-even quantity rounded UP to the next whole unit, so that the quantity is achievable.
FR-31 — Break-even unreachable explanation (explicit) As a small business owner / seller, I should see an explanation that break-even cannot be reached under the current assumptions when the selling price is less than or equal to the variable cost, so that I understand the limitation.
FR-32 — Product management (explicit) As a small business owner / seller, I should add, edit, delete, search, and sort products, and view product cost, selling price, and expected profit, so that I can manage my catalog.
FR-33 — Optional demo mode; empty workspace (explicit) As a small business owner / seller, I should have sample data included only in a clearly labeled optional demo mode and be able to start with a completely empty workspace, so that my data is never confused with samples.
FR-34 — No registration, login, paid APIs, paid database, subscription, or external server (explicit) As a small business owner / seller, I should use the first version without user registration, login, paid APIs, a paid database, a subscription, or an external server, so that the app is free and private.
FR-35 — Local storage persistence (explicit) As a small business owner / seller, I should have products, expenses, settings, and calculation history saved in IndexedDB or another appropriate local browser storage solution, persisting after refreshing or reopening the app on the same browser, so that my work is not lost.
FR-36 — JSON export, CSV report export, JSON import, clear all (explicit) As an international user managing language and currency, I should export data to JSON, export reports to CSV, import a previously exported JSON backup, and clear all local data after an explicit confirmation, so that I can back up, move, and reset my data.
FR-37 — Validate imported data (explicit) As an international user managing language and currency, I should have imported data validated before saving, so that corrupt or invalid backups do not damage my workspace.
FR-38 — Local-storage privacy notice (explicit) As an international user managing language and currency, I should be clearly informed that local data may not automatically synchronize across different devices or browsers, and the app must not pretend that local browser storage is cloud storage, so that I understand the limits.
FR-39 — Premium SaaS-inspired interface (explicit) As a small business owner / seller, I should use a premium-looking interface inspired by high-quality modern SaaS dashboards, so that the app feels professional and trustworthy.
FR-40 — Design requirements (explicit) As a small business owner / seller, I should have a mobile-first responsive layout that works on Android, iPhone, tablets, and desktop browsers, with clean typography, accessible contrast, light and dark modes, professional dashboard cards, simple charts with useful labels, attractive empty states, clear forms and error messages, bottom navigation on mobile and a sidebar on desktop where appropriate, and smooth but subtle transitions, so that the app is usable and pleasant.
FR-41 — Avoid excess and small-screen usability (explicit) As a small business owner / seller, I should not encounter excessive animations, unnecessary gradients, clutter, or oversized headings, and the app must be usable on small phone screens, so that it stays focused and legible.
FR-42 — PWA if supported (explicit) As a small business owner / seller, I should have the application be a Progressive Web App if supported by the environment, with a web app manifest, appropriate app icons, a service worker for caching the app shell, an installation prompt or clear installation instructions, and offline access to the core calculator features after the app has been loaded and cached, so that I can install and use it offline.
FR-43 — No premature offline claims (explicit) As a small business owner / seller, I should not be told offline support works until it has been implemented and tested, so that I am not misled.
FR-44 — Calculation testing with known examples (explicit) As a small business owner / seller, I should have all major calculations tested with known examples — Test case 1 (unit cost 100, additional unit cost 20, selling price 200, quantity 10 → total unit cost 120, profit per unit 80, total revenue 2000, total cost 1200, total profit 800, profit margin 40%, markup ≈66.6667%), Test case 2 (total unit cost 60, desired margin 40% → selling price 100, profit per unit 40), and Test case 3 (fixed costs 1000, selling price 100, variable cost 60 → contribution per unit 40, break-even quantity 25, break-even revenue 2500) — so that the calculations are verified.
FR-45 — Additional testing coverage (explicit) As a small business owner / seller, I should have zero revenue, zero cost, negative input rejection where appropriate, decimal numbers, large amounts, different currency symbols, Arabic right-to-left layout, language switching, saving and restoring data, importing and exporting backups, and mobile responsiveness tested, and any errors found fixed, so that the app is reliable.
FR-46 — Build the working application (explicit) As a small business owner / seller, I should receive the actual working application built in the current environment — interface generated, calculations implemented, all buttons connected, local storage added, and available tests run — so that I can use it immediately.
FR-47 — Final deliverable documentation (explicit) As a small business owner / seller, I should receive a working preview, instructions for testing the app on a phone, instructions for installing it if PWA support is available, a summary of completed features, any known limitations, and instructions for exporting the source code and deploying it using a free hosting option, so that I can test, install, and deploy it.
FR-48 — Prioritize reliability, simplicity, privacy, working features (explicit) As a small business owner / seller, I should have the first version prioritize reliability, simplicity, privacy, and genuinely working features over unnecessary complexity, so that the app is dependable.
FR-49 — Local storage availability for all data (required_inference) As a small business owner / seller, I should have local browser storage available for products, expenses, settings, and calculation history, so that the accepted persistence journey is executable.
FR-50 — Device language detection with English fallback on first visit (required_inference) As an international user managing language and currency, I should have device language detection with English fallback on first visit, so that the accepted first-visit journey is executable.
FR-51 — Service worker and manifest cached before offline claims (required_inference) As a small business owner / seller, I should have the service worker and manifest cached before offline calculator use is claimed, so that offline claims are truthful.
Product context. Shop owners, restaurant owners, freelancers, small businesses, and online sellers use ProfitMate to calculate product costs, selling prices, profits, margins, expenses, and break-even points without accounting knowledge. They work in the local workspace on their own device and browser, often on a phone while counting stock or pricing a product.
Primary goal. Understand business profitability quickly and correctly — what a product costs, what to charge, what was spent, and when the business breaks even — without accounting expertise.
Distinct accepted responsibilities.
Relevant inputs or decisions. Business figures (costs, prices, quantities, margins, fixed and variable costs, expense amounts, categories, dates); date-filter selection; whether to enable demo mode; whether to save a calculation to history.
Interactions with other accepted participants. Shares the same local workspace and settings with the international user managing language and currency; the currency and language chosen there govern all figures and text this persona sees.
Observable success. Correct, NaN-free calculations; accurate dashboard totals from saved data; expenses counted once; break-even results rounded up and explained when unreachable; data persisting after refresh.
Product context. Users worldwide need the app to work regardless of country, language, or currency. They select or create a custom currency, switch interface language (including Arabic RTL), and manage local data through export, import, and clearing, expecting preferences and data to persist on the same browser.
Primary goal. Use ProfitMate in their own language and currency, with clear understanding of what local storage does and does not do, and the ability to back up, move, and reset their data.
Distinct accepted responsibilities.
Relevant inputs or decisions. Language choice; currency choice or custom currency definition; theme (light/dark); export/import/clear decisions; confirmation of clearing.
Interactions with other accepted participants. Shares the same local workspace and settings with the small business owner / seller; the language and currency chosen here govern all figures and text that persona sees.
Observable success. Interface fully translated with correct RTL/LTR direction; monetary values formatted per language and locale with the correct decimal places; no automatic conversion; validated imports; confirmed clearing; truthful privacy notice.
The creative direction is authoritative: Typographic infrastructure for everyday profit — Fira Sans order with signal-line colour, after Erik Spiekermann. The register is "reliable instrument you can read at a glance" — warm competence, not fintech gloss and not editorial swagger.
Light mode tokens
#F4F1EA#FFFDF8#DED8CB (1px)#1A1A18 (14.5:1 on the ground)#0F6B4F (5.6:1 on paper)#E0531F (never for large fills)#6E6A61#F2B705Dark mode tokens
#17181A#202225#F2EFE7#3FA57F#FF7A45Typography
font-variant-numeric: tabular-nums and 600 weight so columns align like a timetable.clamp(26px, 4vw, 39px). The single largest money figure (net profit): clamp(32px, 6vw, 52px) with tabular numerals. Card values 20–25px. Body 15–16px with 1.55 line-height. Helper/validation text 13px. Nothing above 52px.Shape language
#DED8CB) plus an optional 0 1px 0 rgba(26,26,24,0.04) edge.Layout
Imagery
Avoid
Readable text and controls stay whole at every viewport: headlines, wordmarks, labels, numbers, cards' text, and controls stay entirely inside the viewport and their container at 375px, 768px, and 1280px, wrapping or scaling (e.g., font-size: clamp(...) with its mobile size) to fit, and no other element covers any part of them. Imagery, decoration, and motion may be cropped, bled, rotated, overlapped, or cut as the direction asks, as long as they cover no readable text or control. With prefers-reduced-motion, provide a usable static arrangement.
The public entry is the Landing page, and the first working screen is the Dashboard. The signature concept is a ruled instrument panel on warm paper:
#F4F1EA with a sticky top bar carrying the wordmark left and language, currency, and theme controls right, all 44px tap targets.clamp(26px, 4vw, 39px), a one-line muted description of ProfitMate's purpose and audience, a capability summary of the calculators and tools, a privacy statement (local-only, no registration or login), and a single primary entry control into the local workspace. No hardcoded demo numbers are presented as the user's data.clamp(32px, 6vw, 52px)) and carries a small green or vermilion delta chip. Below it, a two-thirds/one-third split: a flat bar chart of revenue vs cost vs profit with axis labels in 12px muted, and a "Recent calculations" ruled list where each row shows product name, quantity, and a right-aligned profit figure.Interaction Model: Animated Motion Tempo: restrained Hero Dimensionality: flat
Landing Hero Motion Brief
prefers-reduced-motion removes the fade and the line draw; all content remains visible and usable in a static arrangement.No 3D/WebGL scene is required; the direction's hero dimensionality is flat.
Assumptions
Constraints
No completed page designs yet.
Completed design pages will appear here when they are ready to preview.
No completed page designs yet.
Completed design pages will appear here when they are ready to preview.
No comments yet. Be the first!