Skip to content

[UI/UX] Implement Mobile-First Onboarding and Transaction Flows #12

Description

@Queenode

🟡 Priority: High
Difficulty: Hard
Estimated Effort: 4-5 days
Relevant Files: src/app/(mobile)/, src/components/mobile/
Labels: enhancement, priority:high, mobile

Requirements

  1. Mobile Experience Translation

    • Build the dedicated Mobile Experience screens from Figma: User onboarding, Wallet balance, Savings group overview, Contribution confirmation, Notifications, and Payout confirmations.
  2. Touch-Optimized Interactions

    • Ensure all buttons and interactive elements meet Apple/Google tap target guidelines (minimum 44x44px).
    • Implement swipe-to-dismiss for notifications and bottom-sheet modals for transaction confirmations instead of desktop-style center modals.
  3. Testing

    • Run tests on real mobile devices or BrowserStack to verify touch interactions and viewport height (100dvh) handling.

Metadata

Metadata

Assignees

No one assigned

    Labels

    GrantFox OSSIssue tracked in GrantFox OSSMaybe RewardedIssue may be eligible for a GrantFox rewardThird CampaignCampaign: Third Campaign

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions