[rexx010]

Overview

This contribution brings together four SwiftChain frontend design issues to improve interface feedback, merchant developer access, and consistent user interactions.

Figma Deliverables

• UI/UX Design (Light Mode): Global System Alerts UI #690 — Global System Alerts UI: Designed slide-in alerts for platform-wide information, including wallet and connection status changes.
• UI/UX Design (Light Mode): Global Toast Notifications #688 — Global Toast Notifications: Created reusable success, error, and warning toast patterns with clear visual distinctions.
• UI/UX Design (Light Mode): Merchant API Keys #684 — Merchant API Keys: Designed a developer-oriented interface for generating and managing API keys for automated shipping.
• UI/UX Design (Light Mode): Global Modals #686 — Global Modals: Established consistent warning modal layouts for important actions and potentially disruptive decisions.

Design Approach

• Applied the existing Light Mode visual language with readable typography, balanced spacing, and accessible contrast.
• Used reusable components and auto-layout to support consistency across the platform.
• Included responsive variants and organized frames, layers, and component structures for easier future implementation.
• Kept alerts, toasts, and modals visually distinct while maintaining a unified design system.

Validation

• Reviewed component consistency, alignment, spacing, and Light Mode styling.
• Checked responsive layouts and Figma layer organization against the stated acceptance criteria.

Scope

This contribution covers Figma UI/UX design only. No frontend code or application logic is included.

Related Issues

Closes #690
Closes #688
Closes #684
Closes #686

[drips-wave]

@rexx010 Great news! 🎉 Based on an automated assessment of this PR, the linked Wave issue(s) no longer count against your application limits.

You can now already apply to more issues while waiting for a review of this PR. Keep up the great work! 🚀

Learn more about application limits