PROJECT 2: Hmong American Farmers Associations (HAFA)
Mobile App Design from Research to High-Fidelity Prototype
PROJECT 2: Hmong American Farmers Associations (HAFA)
Mobile App Design from Research to High-Fidelity Prototype
Role: UX Researcher
Duration: 16 weeks
Team: Developers, designers, project managers
Overview
Joined the Hmong American Farmers Association (HAFA) project midway through development to lead user research through in-person interviews, collaborating with cross-functional teams to create high-fidelity prototypes that enabled seamless handoff to developers with demonstrable interactions.
Background
HAFA required a mobile app built from scratch to support their community. The project involved building a mobile application from the ground up, as opposed to improving an existing product, requiring extensive foundational research to inform the design.
Research Questions
What are the core user needs and workflows that the HAFA mobile app must support?
How can the app design align with the community's values and usage patterns?
What interaction patterns and features are most critical for the initial release?
Methodology
In-Person User Interviews
Conducted comprehensive in-person interviews with HAFA community members to understand cultural context, work practices, and community-specific needs that could only be fully captured through face-to-face interaction.
Recruited diverse participants representative of the HAFA farming community, ensuring inclusion of various experience levels and technical proficiencies.
Gathered contextual insights on mobile device usage patterns, connectivity challenges in rural/farming environments, and interaction preferences that informed mobile-first design decisions.
Documented all interview data systematically in Notion, creating searchable, tagged interview notes for efficient cross-referencing and pattern identification.
Collaboration & Prototyping
Collaborated extensively with cross-functional teams (developers, project managers, designers), establishing regular sync meetings and communication protocols.
Created high-fidelity, interactive prototypes in Figma with fully specified interactions, micro-animations, and state transitions that enabled developers to understand the complete interaction model.
Maintained seamless communication using Notion for shared documentation, ensuring all design decisions, research insights, and interaction specifications were transparent and accessible.
Ensured prototypes included demonstrable interactions (clickable prototypes with hover states, transitions, error states) for clear developer handoff, reducing ambiguity and revision cycles.
Design Handoff Process
Documented comprehensive interaction specifications and design rationale in Notion, linking each design decision back to specific user research findings and usability principles.
Conducted iterative design reviews with development team, gathering technical feasibility feedback early and adjusting designs to balance user needs with implementation constraints.
Provided ongoing support during implementation phase, conducting design QA and usability validation to ensure final implementation maintained fidelity to research-informed design intent.
Analysis & Findings
User Needs Identified
Offline-first functionality:
In-person interviews revealed users need core app functionality to work offline with intelligent data sync, fundamentally shaping app architecture and prioritizing offline usability over real-time features.
Cultural context and language accessibility:
Research uncovered need for culturally sensitive design respecting community values, leading to design decisions prioritizing clarity, respect, and community-centered language.
Mobile-first workflows optimized for one-handed use:
Participants demonstrated mobile device usage often occurs while handling equipment, requiring one-handed interaction capability and informing button placement, gesture design, and thumb-friendly zones.
Design Decisions
Progressive disclosure with offline-first architecture:
Implemented progressive disclosure patterns surfacing core functionality first, prioritized offline functionality ensuring users could complete critical tasks without connectivity.
Familiar navigation patterns with community-specific customization:
Chose standard mobile navigation patterns (bottom tab bars, familiar iconography) to reduce learning curve while customizing content based on community-specific workflows.
Error prevention and recovery:
Designed robust error states and recovery flows for mobile field environments, implementing confirmation dialogs, auto-save functionality, and clear error messages.
Recommendations & Impact
Delivered Solutions
High-fidelity Figma prototypes with fully specified interactions
Impact: 40% reduction in design-development revision cycles and faster implementation timeline.
Comprehensive design system documentation in Notion
Impact: Created shared knowledge base linking research findings to design decisions, adopted as standard practice for subsequent projects.
Offline-first mobile app architecture
Impact: Addressed critical user need, ensuring app usability in rural/farming environments with unreliable connectivity, significantly improving app adoption and retention.
Collaboration Outcomes
Seamless developer handoff with 40% reduction in revision cycles: High-fidelity prototypes with demonstrable interactions eliminated ambiguity and enabled faster development velocity.
Clear communication protocols established using Notion-based documentation standards, becoming templates for future cross-functional collaboration.
Reflection
Key Challenges & Solutions
Joining mid-project required rapid onboarding and context-building. Addressed by conducting thorough review of existing research artifacts, scheduling deep-dive sessions with team members, and conducting additional targeted interviews to fill knowledge gaps, enabling quick productivity while contributing fresh perspective.
Building from scratch (vs. improving existing product) necessitated extensive foundational research, user journey mapping from zero, and consideration of platform constraints (iOS/Android) from the outset. Addressed by conducting comprehensive user research early, creating detailed user journey maps, and establishing design system principles before diving into specific features.
Lessons Learned
In-person interviews were invaluable for understanding cultural context, community values, and environmental factors (connectivity challenges, one-handed usage contexts) that would have been difficult to capture through remote interviews. The ability to observe body language and environmental context provided rich insights that directly informed design decisions.
High-fidelity prototypes in Figma serve as powerful communication tools that enable stakeholders (including developers) to experience and understand the user experience before implementation. Interactive prototypes with demonstrable interactions reduced miscommunication and enabled more informed technical decision-making.
Building new products requires more extensive upfront research compared to improving existing products. The investment in comprehensive user research and journey mapping paid dividends by preventing costly redesigns and ensuring the app addressed real community needs from day one.
I also produced a redesign for this project! If you'd like to view that part of the project, please click here.