Summary
Objective:
To enhance RainbowVI’s website by improving its usability, accessibility, and overall user experience, while providing training opportunities for aspiring UI/UX designers.
Project Scope:
- Conduct UX research to identify pain points and improvement areas.
- Redesign the webs app layout, navigation, and UI components for better engagement.
- Ensure mobile responsiveness and accessibility (WCAG standards).
- Create wireframes and prototypes for new features and improvements.
- Collaborate with developers for design implementation.
- Conduct usability testing and iterate based on feedback.
Team Structure:
- Trainee Roles: 2–5 UI/UX Designer Trainees (based on workload and mentorship capacity).
- Supervision: Led by Vi Ly with support from developers.
- Collaboration Tools: Figma, Asana, Slack, Google Meet.
Timeline:
- Duration: 8 weeks, 4 hours per day.
- Phase 1 (Weeks 1–2): Research & Wireframing.
- Phase 2 (Weeks 3–6): Prototyping & Design Implementation.
- Phase 3 (Weeks 7–8): Testing, Implementation & Finalization.
Outcome & Benefits:
- For RainbowVI: A well-designed, user-friendly website that improves engagement.
- For Trainees: Hands-on experience, contribution certificate, job reference, and portfolio-building opportunities. Participate workshop with professional.
Planning of 8-week, 4-hour-per-day work schedule for a UI/UX designer to improve a current website.
The plan follows a research, design, prototyping, testing, and refinement approach.
Goal: Understand the product, users, and goals.
- Day 1-3:
- Intro to company, team, and project vision.
- Walkthrough of current MVP (features, tech stack, pain points).
- Review existing research/data.
- Day 4-5:
- Desk Research: Research about web app for young users.
- Competitive Analysis: Audit 2-3 competitor apps for UI/UX patterns.
✔ Deliverable: Research summary + 3-5 actionable insights.
Goal: Identify user pain points and prioritize problems.
- Day 1-3:
- Plan user interviews/surveys (if users are available).
- Create user personas (or refine existing ones).
- Day 4-5:
- Journey Mapping: Map current user flows (where do users struggle?).
- Meeting: Vote on top 3 UX issues to tackle (e.g., onboarding, navigation).
✔ Deliverable: User personas + journey maps + prioritized problem list.
Goal: Identify key pain points through testing and quickly iterate.
- Day 1-4: Run Tests & Synthesize Findings
- Conduct usability tests (remote or in-person).
- Note pain points (e.g., "Users missed the CTA button").
- Cluster findings into themes (e.g., "Navigation confusion").
- Day 5: Rapid Redesign Sprint
- Sketch quick solutions to the top 3 issues.
✔ Deliverable: Usability test notes + quick sketches
Goal: Innovative concepts.
- Day 1-3: "Blue Sky" Ideation
- Meeting: "How might we radically improve [key user flow]?"
- Explore unconventional UI patterns (e.g., 3D, voice UI, generative AI elements).
- Day 2-5: Art Direction & Visual Style
- Experiment with 2-3 distinct visual styles (e.g., neumorphism, brutalist, minimalist).
- Test color palettes, typography, and motion concepts.
- Present wild ideas to the team, then vote on 1-2 to refine.
✔ Deliverable: Refine Mood boards + 2 high-concept Figma explorations.
Goal: Refine solutions visually and interaction-wise, elevate the experience with memorable moments
- Day 1-3:
- Prototype subtle animations (e.g., button feedback, loading states).
- Use Figma/ProtoPie/Lottie Files for motion studies.
- Day 4-6:
- Convert top wireframes into high-fi Figma prototypes (match the design system).
- **Focus on micro-interactions (buttons, transitions).
- **Create "Easter eggs" (e.g., celebratory confetti after task completion)
- Day 7-9:
- Internal Demo: Present to the team for feedback.
- Accessibility Check: Audit contrast, keyboard nav, etc.
- Testing: Plan to test the new system with the users (Tasks, communication)
- Day 10:
- Developer Handoff: Document design rationale for devs
- Iterate Designs: Update prototypes based on feedback.
✔ Deliverable: polished Figma screens + accessibility report + usability testing plan
**: good to have
Goal: Validate designs with real users and prepare for implementation
- Day 1-3:
- Conduct moderated tests (Zoom or in-person).
- Synthesize findings (e.g., "80% failed to find settings").
- Day 4-5:
- Iterate Designs: Update prototypes based on feedback.
- Prepare for implementation: Pair with devs to answer design questions, review built features (dev vs. design).
✔ Deliverable: Test report + Developer-ready Figma files + style guide updates.
Goal: Work on the implementation with devs.
✔ Deliverable: Final MVP with new implementation.