laser-fintech

byMohammed Bakri Osman

High-fidelity Fintech mobile app UI. Design System: Midnight Navy background (#0B1221), Sand Gold accents (#C5A059), Glassmorphism style with 24px corner radius. Typography: Professional Arabic (Cairo) and English. Minimalist, premium, bank-grade aestheticCreate a set of 5 screens. Screen 1: Splash screen with a center-aligned gold 'S' Sanad logo on #0B1221 background. Screens 2-4: Onboarding screens with luxury 3D illustrations of a shield (Guaranteed Escrow), two people shaking hands (P2P), and a speed bolt (Fast Delivery). Each has a gold 'Next' button at the bottom. Screen 5: Role selection with two large glassmorphic cards: 'Expat' and 'Merchant' with gold icons

Login
Login

Comments (0)

No comments yet. Be the first!

Project Tasks32

#1

Implement Theme & Design System

Backlog

As a developer, I want to implement the core design system and theme for laser-fintech so that all screens follow the luxury glassmorphic aesthetic. This includes: setting up the Midnight Navy (#0B1221) background, Sand Gold (#C5A059) accents, Off-White (#F1F5F9) text, Slate Gray (#2E3A4B) muted tones, glassmorphic surfaces with 24px corner radius, Bento Grid layout system, bilingual typography (Cairo for Arabic, system font for English), full RTL/LTR support for Arabic and English, and fluid transition/animation primitives (pulse, parallax, confetti). Remove any scaffold pages not needed by the SRD. This task must be completed before all other UI tasks.

AI 70%
Human 30%
High Priority
2 days
AI Credits:6
Frontend Developer
#21

Implement User Auth API

Backlog

As a user, I want to use a backend API for registration, login, and biometric token management so that I can securely access my laser-fintech account. Endpoints: POST /auth/register, POST /auth/login, POST /auth/biometric. Supports phone number + password authentication. Built with FastAPI + MySQL.

AI 80%
Human 20%
High Priority
2 days
AI Credits:7
Backend Developer
#4

Build Role Selection Screen

Backlog

As a user, I want to see a Role Selection screen with two large glassmorphic cards ('Expat' and 'Merchant') with gold icons, so that I can identify my user type and be directed to the appropriate flow. Supports Arabic RTL layout. Navigates from Onboarding, leads to Login screen.

Depends on:#1
Waiting for dependencies
AI 85%
Human 15%
High Priority
0.5 days
AI Credits:3
Frontend Developer
#5

Build Login Screen

Backlog

As a user, I want to see a Login screen with glassmorphic input fields for phone number and password, and a prominent gold fingerprint icon for biometric login, so that I can securely sign into my account. Supports Arabic RTL layout. Navigates from Role Selection, leads to KYC Verification.

Depends on:#1
Waiting for dependencies
AI 85%
Human 15%
High Priority
1 day
AI Credits:4
Frontend Developer
#22

Implement KYC Verification API

Backlog

As a user, I want to use a backend API for KYC identity verification so that my ID can be scanned, submitted, and reviewed for compliance. Endpoints: POST /kyc/submit, GET /kyc/status. Integrates with document scanning and status tracking stored in MongoDB.

Depends on:#21
Waiting for dependencies
AI 78%
Human 22%
High Priority
2 days
AI Credits:7
Backend Developer
#3

Build Onboarding Screens

Backlog

As a user, I want to experience three onboarding screens with luxury 3D illustrations (Competitive Bidding, Guaranteed Escrow, Fast Delivery), each with a gold 'Next' button at the bottom, so that I understand the app's core value propositions. Transitions between screens should be fluid and seamless with parallax effects. Supports bilingual Arabic/English display with RTL layout. Navigates from Splash to Role Selection.

Depends on:#1
Waiting for dependencies
AI 85%
Human 15%
High Priority
1.5 days
AI Credits:5
Frontend Developer
#32

Implement Admin Control API

To Do

As the owner, I want to use a backend API for the Admin Dashboard so that I can view platform metrics, manage users, set fees, pull profit reports, and withdraw accumulated earnings. Endpoints: GET /admin/overview, GET /admin/users, PATCH /admin/users/:id, GET /admin/fees, PATCH /admin/fees, GET /admin/reports, POST /admin/withdraw. Role-protected with admin-only JWT. Built with FastAPI + MySQL.

Depends on:#21
Waiting for dependencies
AI 80%
Human 20%
High Priority
2.5 days
AI Credits:8
Backend Developer
#6

Build Registration Screen

To Do

As a user, I want to see a Registration screen with four glassmorphic input fields (name, email, phone number, password), so that I can create a new laser-fintech account. Supports Arabic RTL layout. Navigates from Login, leads to KYC Identity Verification.

Depends on:#1
Waiting for dependencies
AI 85%
Human 15%
High Priority
1 day
AI Credits:4
Frontend Developer
#7

Build KYC Identity Verification Screen

To Do

As a user, I want to see an Identity Verification screen with a live camera view and a green laser frame for scanning my ID, so that I can complete KYC compliance. Supports Arabic RTL layout. Navigates from Registration, leads to Verification in Progress screen.

Depends on:#1
Waiting for dependencies
AI 80%
Human 20%
High Priority
1 day
AI Credits:5
Frontend Developer
#2

Build Splash Screen

To Do

As a user, I want to see a Splash screen with a center-aligned gold 'S' laser-fintech logo on a Midnight Navy (#0B1221) background with a pulse animation, so that I have a premium first impression of the app. Implement based on the existing Splash (v1) JSX design. Entry point of the Expat and Merchant user flows. Navigates to the Onboarding screen.

Depends on:#1
Waiting for dependencies
AI 90%
Human 10%
High Priority
0.5 days
AI Credits:4
Frontend Developer
#16

Build Transfer Success Screen

To Do

As an expat user, I want to see a Success screen with gold confetti animation, a checkmark, a transaction summary, and a 'Download Receipt PDF' button, so that I can celebrate the completion of my transfer and save proof of transaction. Supports Arabic RTL layout. Final screen of the Expat transfer flow.

Depends on:#1
Waiting for dependencies
AI 85%
Human 15%
High Priority
0.5 days
AI Credits:4
Frontend Developer
#8

Build KYC Progress & Success Screens

To Do

As a user, I want to see a Verification in Progress screen with a gold circular progress ring and a Verification Successful screen with a large green emerald checkmark, so that I have clear feedback on my KYC status. Supports Arabic RTL layout. Navigates from Identity Verification, leads to Expat Dashboard or Merchant Dashboard based on role.

Depends on:#1
Waiting for dependencies
AI 85%
Human 15%
High Priority
0.5 days
AI Credits:4
Frontend Developer
#11

Build Recipient Details Screen

To Do

As an expat user, I want to see a Recipient Details screen with glassmorphic input fields for name, city, and phone number, and a gold 'Continue' button, so that I can specify who will receive my transfer. Supports Arabic RTL layout. Navigates from Amount Input, leads to Bidding screen.

Depends on:#1
Waiting for dependencies
AI 85%
Human 15%
High Priority
0.5 days
AI Credits:4
Frontend Developer
#13

Build Transaction Preview Screen

To Do

As an expat user, I want to see a Transaction Preview screen with a receipt-style layout showing final amounts, fees, and a 'Lock Funds' action, so that I can confirm all transaction details before committing. Supports Arabic RTL layout. Navigates from Bidding, leads to Escrow Tracker.

Depends on:#1
Waiting for dependencies
AI 82%
Human 18%
High Priority
1 day
AI Credits:5
Frontend Developer
#31

Build Admin Profit Withdrawal Screen

To Do

As the owner, I want to see a Profit Withdrawal screen with a summary of accumulated platform profits and a gold 'Withdraw to Bank' button, so that I can transfer my earnings directly to my bank account at any time. Supports Arabic RTL layout. Navigates from Admin Dashboard.

Depends on:#32#1
Waiting for dependencies
AI 78%
Human 22%
High Priority
0.5 days
AI Credits:5
Frontend Developer
#27

Build Admin Dashboard Screen

To Do

As the owner (Mohammed Bakri Osman), I want to see a comprehensive Admin Dashboard displaying all ongoing transactions, active users, revenue streams, and platform health metrics in a glassmorphic layout, so that I can monitor and control all platform operations at a glance. Supports Arabic RTL layout. Navigates from Admin Login.

Depends on:#1#32
Waiting for dependencies
AI 75%
Human 25%
High Priority
2 days
AI Credits:7
Frontend Developer
#28

Build Admin Fee Management Screen

To Do

As the owner, I want to see a Fee Management screen where I can set and adjust transfer fees, bidding commissions, and premium service charges in real-time, so that I can maximize profitability and react to market conditions. Supports Arabic RTL layout. Navigates from Admin Dashboard.

Depends on:#32#1
Waiting for dependencies
AI 75%
Human 25%
High Priority
1 day
AI Credits:6
Frontend Developer
#30

Build Admin User Management Screen

To Do

As the owner, I want to see a User Management screen where I can view all registered users, approve pending accounts, suspend suspicious accounts, or ban users, so that I can maintain platform integrity and security. Supports Arabic RTL layout. Navigates from Admin Dashboard.

Depends on:#32#1
Waiting for dependencies
AI 75%
Human 25%
High Priority
1 day
AI Credits:5
Frontend Developer
#29

Build Admin Profit Reports Screen

To Do

As the owner, I want to see a Profit Reports screen with dynamic gold line/bar charts showing daily, weekly, and monthly earnings, so that I can track revenue trends and make informed business decisions. Supports Arabic RTL layout. Navigates from Admin Dashboard.

Depends on:#32#1
Waiting for dependencies
AI 75%
Human 25%
High Priority
1.5 days
AI Credits:6
Frontend Developer
#23

Implement Transfer & FX Rate API

To Do

As an expat user, I want to use a backend API for real-time currency conversion (SAR to SDG) and transfer initiation so that I can see live rates and send money. Endpoints: GET /rates/live, POST /transfer/initiate. Integrates with live FX data source.

Depends on:#21#22
Waiting for dependencies
AI 80%
Human 20%
High Priority
2 days
AI Credits:7
Backend Developer
#9

Build Expat Dashboard Screen

To Do

As an expat user, I want to see my Dashboard showing SAR and SDG balances in a large glassmorphic card with quick action buttons (Send, Receive) and a live market rates ticker below, so that I can monitor my finances at a glance. Supports Arabic RTL layout. Navigates from KYC Success, leads to Amount Input screen.

Depends on:#22#21#1
Waiting for dependencies
AI 80%
Human 20%
High Priority
1.5 days
AI Credits:6
Frontend Developer
#24

Implement Bidding Engine API

Backlog

As an expat user, I want to use a backend API for the 3-tier bidding system so that I can receive ranked merchant offers (Best Rate, Fastest, Top Rated) and lock my chosen offer. Endpoints: GET /bids/available, POST /bids/select, POST /bids/lock. Stores bids in MySQL.

Depends on:#23#21
Waiting for dependencies
AI 80%
Human 20%
High Priority
2.5 days
AI Credits:8
Backend Developer
#10

Build Amount Input Screen

Backlog

As an expat user, I want to see an Amount Input screen where I can enter SAR and see the corresponding SDG conversion in real-time using a ticker-style display, so that I know exactly how much the recipient will receive. Supports Arabic RTL layout. Navigates from Expat Dashboard, leads to Recipient Details.

Depends on:#23#1
Waiting for dependencies
AI 80%
Human 20%
High Priority
1 day
AI Credits:5
Frontend Developer
#12

Build Bidding Screen

Backlog

As an expat user, I want to see a 3-tier Bidding screen with three colored cards (Gold frame: 'Best Rate', Cyan frame: 'Fastest', Pink frame: 'Top Rated'), each with a wide gold 'Select' button, so that I can choose the merchant offer that best suits my needs. Supports Arabic RTL layout. Navigates from Recipient Details, leads to Transaction Preview.

Depends on:#1#24
Waiting for dependencies
AI 80%
Human 20%
High Priority
1.5 days
AI Credits:6
Frontend Developer
#25

Implement Escrow & Chat API

To Do

As a user, I want to use a backend API for live escrow tracking and secure encrypted messaging so that I can monitor my transaction stages in real-time and communicate with my counterpart safely. Endpoints: GET /escrow/status, POST /chat/send, GET /chat/messages. Uses WebSocket for real-time updates. End-to-end encryption applied.

Depends on:#21#24
Waiting for dependencies
AI 78%
Human 22%
High Priority
2.5 days
AI Credits:8
Backend Developer
#15

Build Secure Chat Screen

Backlog

As a user, I want to see a Secure Chat screen with encrypted messaging (gold bubbles for sender, navy for receiver) and a persistent warning banner 'Do not share numbers outside the app', so that I can communicate securely with the merchant while maintaining escrow protection. Supports Arabic RTL layout. Navigates from Escrow Tracker, accessible to both Expat and Merchant.

Depends on:#1#25
Waiting for dependencies
AI 80%
Human 20%
High Priority
1 day
AI Credits:5
Frontend Developer
#26

Implement Merchant Portal API

To Do

As a merchant, I want to use a backend API for managing bidding requests, active orders, wallet earnings, and payouts so that I can efficiently run my merchant operations. Endpoints: GET /merchant/bids, GET /merchant/orders, GET /merchant/wallet, POST /merchant/payout. Integrates with MySQL for order data and MongoDB for wallet analytics.

Depends on:#24#21#25
Waiting for dependencies
AI 80%
Human 20%
High Priority
2 days
AI Credits:7
Backend Developer
#14

Build Live Escrow Tracker Screen

To Do

As an expat user, I want to see a Live Escrow Tracker with a vertical animated timeline showing transaction stages (Deposited in Green, Merchant Notified in Gold, In Delivery pulsing Orange), so that I have full transparency into my transfer's progress. Supports Arabic RTL layout. Navigates from Transaction Preview, leads to Secure Chat.

Depends on:#25#1
Waiting for dependencies
AI 80%
Human 20%
High Priority
1.5 days
AI Credits:6
Frontend Developer
#17

Build Merchant Dashboard Screen

Backlog

As a merchant, I want to see a Merchant Dashboard showing available bidding requests with location tags in a fast card system, so that I can quickly identify and respond to transfer opportunities in my city. Supports Arabic RTL layout. Navigates from KYC Success (Merchant role), leads to Active Orders.

Depends on:#26#1
Waiting for dependencies
AI 80%
Human 20%
High Priority
1.5 days
AI Credits:6
Frontend Developer
#18

Build Active Orders Screen

Backlog

As a merchant, I want to see an Active Orders screen for managing my ongoing transactions, so that I can track and fulfill my accepted bids efficiently. Supports Arabic RTL layout. Navigates from Merchant Dashboard, leads to Secure Chat.

Depends on:#1#26
Waiting for dependencies
AI 80%
Human 20%
Medium Priority
1 day
AI Credits:5
Frontend Developer
#19

Build Wallet Overview Screen

Backlog

As a merchant, I want to see a Wallet Overview screen with a gold line chart showing my weekly earnings, so that I can monitor my income trends and financial performance at a glance. Supports Arabic RTL layout. Navigates from Secure Chat, leads to Payout screen.

Depends on:#1#26
Waiting for dependencies
AI 80%
Human 20%
Medium Priority
1 day
AI Credits:5
Frontend Developer
#20

Build Payout Screen

To Do

As a merchant, I want to see a Payout screen with my local bank details and a prominent gold 'Withdraw Funds' button, so that I can transfer my earnings to my bank account quickly and easily. Supports Arabic RTL layout. Final screen of the Merchant flow. Navigates from Wallet Overview.

Depends on:#26#1
Waiting for dependencies
AI 85%
Human 15%
Medium Priority
0.5 days
AI Credits:4
Frontend Developer
Splash: View Logo
Onboarding: Browse Features
Role Selection: Choose Expat
Login: Sign In
KYC: Verify Identity
Dashboard: View Balance
Amount Input: Enter Transfer
Recipient Details: Add Recipient
Bidding: Select Rate
Escrow Tracker: Track Transfer