[UI/UX] SpendWise UX/UI Improvements

[Limeload]

Description

We need to improve the UX/UI of SpendWise to enhance usability and overall user experience. The goal is to make the interface more intuitive, visually appealing, and consistent across all pages.

Tasks

• Redesign the dashboard with better visual hierarchy and spacing.
• Improve color scheme for better readability and accessibility.
• Standardize buttons, forms, and input fields.
• Add meaningful icons and illustrations where appropriate.
• Enhance mobile responsiveness for all screens.
• Conduct user testing to gather feedback on the new design.

Acceptance Criteria

• Dashboard layout is clear and easy to navigate.
• All colors, fonts, and components follow a consistent design system.
• Mobile and tablet views are fully responsive.
• Users report improved satisfaction during testing.

Examples

[github-actions]

📋 Issue Guidelines

Hi @Limeload! Thanks for opening this issue. We appreciate your contribution to the project! 🚀

Please note the following workflow guidelines:

• 🎯 First-come, first-serve basis: Issues are assigned based on who expresses interest first. Please comment on the issue to show your interest before starting work.

• ⏳ Wait for assignment: Please do not start working until a maintainer has officially assigned this issue to you. This prevents duplicate work and ensures proper coordination.

• 🔗 Link your PR: Once assigned, when you create your pull request, make sure to link it to this issue using Closes #32 or Fixes #32 in your PR description.

• ⏰ 2-day timeline: Aim to complete your work and submit a PR within 2 days of assignment. If you need more time, please comment on this issue to discuss an extension.

• ✅ CI checks must pass: Before requesting a review, ensure your PR passes all automated checks (TypeScript, linting, build, security). You can see the status in the PR checks section.

Need help? Feel free to ask questions in the comments or reach out to maintainers.

---

This is an automated message to help maintain our workflow standards.

[github-actions]

🎯 Issue Assigned

Excellent! This issue has been assigned to @Limeload. You're now ready to start working on it! 🎉

Your next steps:

1. 🔗 Link your PR: When you create your pull request, include Closes #32 or Fixes #32 in the PR description to automatically link it to this issue.

2. ⏰ Timeline reminder: You have 2 days from now to complete your work and submit a PR. The deadline is 10/19/2025.

3. ✅ Quality checks: Before requesting a review, make sure your PR passes all automated checks:

   • Ruby linting (RuboCop)
   • Test suite (RSpec)
   • Security audit (Brakeman, Bundler Audit)
   • Build verification

4. 📝 Communication: If you encounter any blockers or need clarification, please comment on this issue. We're here to help!

5. 🚀 Ready to start: You can now begin working on this issue. Good luck!

Pro tip: You can track your progress by updating this issue with status comments as you work.

---

This is an automated reminder to help maintain our workflow standards.