Act as a senior full-stack developer, UI/UX designer, and product engineer. Build a complete, functional, mobile-first web application called "ProfitMate". IMPORTANT: Do not just create a mockup, static landing page, or visual prototype. Build a genuinely interactive application with working calculations, functional buttons, input validation, and persistent local data storage. 1. APP PURPOSE ProfitMate is a free, easy-to-use business profit calculator for people worldwide, including shop owners, restaurant owners, freelancers, small businesses, and online sellers. The app helps users calculate product costs, selling prices, profits, profit margins, expenses, and break-even points without requiring accounting knowledge. The application must be useful internationally, regardless of the user's country, language, or currency. 2. LANGUAGES Implement a complete language selector with: - English - Arabic - French - Spanish - Portuguese - German Requirements: - Automatically detect the device's preferred language on the first visit when supported. - If the device language is unsupported, default to English. - Allow users to change the language manually at any time. - Translate all interface text, buttons, labels, menus, messages, validation errors, and reports. - Support right-to-left layout for Arabic and left-to-right layout for other languages. - Remember the selected language. 3. UNIVERSAL CURRENCY SYSTEM This is a critical feature. Do NOT hardcode a single currency. Provide two methods for selecting the currency: A. Choose from a comprehensive list of world currencies, including: - USD — US Dollar - EUR — Euro - GBP — British Pound - DZD — Algerian Dinar - CAD — Canadian Dollar - AUD — Australian Dollar - MAD — Moroccan Dirham - SAR — Saudi Riyal - AED — UAE Dirham - EGP — Egyptian Pound - INR — Indian Rupee - JPY — Japanese Yen - CNY — Chinese Yuan - BRL — Brazilian Real - MXN — Mexican Peso - CHF — Swiss Franc - TRY — Turkish Lira - ZAR — South African Rand Include all other commonly used ISO 4217 currencies where practical. B. Allow users to create a custom currency by entering: - Currency name - Currency symbol - Currency code, if available - Number of decimal places, from 0 to 4 Examples of custom currencies: - My Currency - Local Business Credits - A user-defined currency symbol Currency requirements: - Use the selected currency throughout the entire application. - Format numbers according to the selected language and locale. - Support currencies that use zero, two, or three decimal places. - Allow the user to change the currency at any time. - Store the currency preference locally. - Never assume that changing the currency automatically converts monetary values using exchange rates. - Clearly explain that changing the currency changes the display unit and does not convert existing amounts. - Do not require an external currency API or paid service. 4. MAIN DASHBOARD Create a modern, professional dashboard with: - Total sales - Total costs - Gross profit - Net profit estimate - Profit margin - Number of products - Recent calculations Provide date filters where appropriate: - Today - Last 7 days - Last 30 days - All time All dashboard values must be calculated from the user's saved data, not hardcoded demo numbers. Show a helpful empty state when no data exists. 5. PRODUCT PROFIT CALCULATOR Allow users to enter: - Product name - Unit cost - Additional costs per unit - Selling price per unit - Quantity sold Automatically calculate: - Total unit cost - Profit per unit - Total revenue - Total cost - Total profit - Profit margin percentage - Markup percentage Use 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. Handle zero values and invalid inputs safely. Never display NaN or Infinity. 6. SELLING PRICE CALCULATOR Allow users to enter: - Total unit cost - Desired profit margin percentage Calculate the recommended selling price using: Selling price = Total unit cost / (1 - Desired margin / 100) Reject margins below 0% or greater than or equal to 100%. Display the expected profit per unit and profit margin. 7. EXPENSE TRACKER Allow users to: - Add an expense name. - Enter the amount. - Select a category. - Add a date. - Edit and delete expenses. Provide expense summaries by category and date. Do not count the same expense twice in the profit calculation. 8. BREAK-EVEN CALCULATOR Allow users to enter: - Fixed costs - Selling price per unit - Variable cost per unit Calculate: Contribution per unit = Selling price - Variable cost Break-even quantity = Fixed costs / Contribution per unit Break-even revenue = Break-even quantity × Selling price Round the required break-even quantity UP to the next whole unit. If the selling price is less than or equal to the variable cost, explain that break-even cannot be reached under the current assumptions. 9. PRODUCT MANAGEMENT Allow users to: - Add products. - Edit products. - Delete products. - Search products. - Sort products. - View product cost, selling price, and expected profit. Include sample data only in a clearly labeled optional demo mode. Let users start with a completely empty workspace. 10. DATA STORAGE AND PRIVACY The first version must work without: - User registration - Login - Paid APIs - A paid database - A subscription - An external server Use IndexedDB or another appropriate local browser storage solution to save products, expenses, settings, and calculation history. Data must persist after refreshing or reopening the app on the same browser. Include: - Export data to JSON. - Export reports to CSV. - Import a previously exported JSON backup. - Clear all local data after an explicit confirmation. Validate imported data before saving it. Clearly inform users that local data may not automatically synchronize across different devices or browsers. Do not pretend that local browser storage is cloud storage. 11. DESIGN Create a premium-looking interface inspired by high-quality modern SaaS dashboards. Design requirements: - Mobile-first responsive layout. - Works on Android, iPhone, tablets, and desktop browsers. - 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. - Smooth but subtle transitions. Avoid excessive animations, unnecessary gradients, clutter, and oversized headings. The app must be usable on small phone screens. 12. INSTALLABLE WEB APP If supported by the environment, make the application a Progressive Web App (PWA). Include: - A web app manifest. - Appropriate app icons. - A service worker for caching the app shell. - An installation prompt or clear installation instructions. - Offline access to the core calculator features after the app has been loaded and cached. Do not claim that offline support works until it has been implemented and tested. 13. TESTING Test all major calculations using known examples. Test case 1: Unit cost = 100 Additional unit cost = 20 Selling price = 200 Quantity = 10 Expected results: Total unit cost = 120 Profit per unit = 80 Total revenue = 2000 Total cost = 1200 Total profit = 800 Profit margin = 40% Markup = 66.6667% approximately Test case 2: Total unit cost = 60 Desired profit margin = 40% Expected selling price = 100 Expected profit per unit = 40 Test case 3: Fixed costs = 1000 Selling price = 100 Variable cost = 60 Expected contribution per unit = 40 Expected break-even quantity = 25 Expected break-even revenue = 2500 Also test: - 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 - Mobile responsiveness Fix any errors found during testing. 14. FINAL DELIVERABLE Build the actual working application in the current environment. Do not stop after providing a plan or code snippets. Generate the interface, implement the calculations, connect all buttons, add local storage, and run the available tests. At the end, provide: 1. A working preview. 2. Instructions for testing the app on a phone. 3. Instructions for installing it if PWA support is available. 4. A summary of completed features. 5. Any known limitations. 6. Instructions for exporting the source code and deploying it using a free hosting option. The first version must prioritize reliability, simplicity, privacy, and genuinely working features over unnecessary complexity.
Sign in to leave a comment
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!