HomeUniteUs icon indicating copy to clipboard operation
HomeUniteUs copied to clipboard

Design: Host Account Creation

Open pixellady opened this issue 10 months ago β€’ 3 comments

🧩 Overview

This issue is for tracking design work related to #403. As a potential Host, I want to create an account on Home Unite Us so that I can login and apply to be a Host.

🧠 Context / Background

Create a secure account registration system for potential hosts to access the Home Unite Us platform and begin their application process to become verified hosts.


🎯 Problem Statement

Without a host account creation system, interested community members cannot register to be hosts,Β which limits the program's ability to expand and serve more youth.


πŸ‘€ Target User(s)

The target users of the Home Unite Us system are potential hosts. They are community members who are interested in registering and applying to provide housing for youth experiencing homelessness.


🎯 Goals & Objectives

Goal: Enable potential hosts to register and create secure accounts on the platform Business Objective: Expand the pool of available hosts to serve more youth experiencing homelessness User Objective: Begin the journey to become a verified host

βœ… Success Criteria (Design-Specific)

  • [ ] Potential hosts can access a registration page from the main landing page
  • [ ] Account creation form captures required information (name, email, phone, basic demographics)
  • [ ] Email verification system is implemented for account activation
  • [ ] Users receive confirmation email upon successful registration
  • [ ] Meets accessibility standards (WCAG 2.1 AA)
  • [ ] Can be handed off to Engineering with clear assets and specs

πŸ“‹ Functional Requirements (if applicable)

Only include if there are specific technical or business constraints that affect the design solution

  • Data fields that must be captured (for compliance/integration reasons)
  • Required integrations with existing systems
  • Specific user flows that cannot be changed due to technical constraints

🧩 Functional Constraints

*(Completed by PM if applicable). These are non-negotiable parameters that affect design decisions - things the designer can't change but must accommodate in their design approach. * List any constraints or guidance from Product or Tech:

  • Must integrate with [existing flow/system]
  • Requires [specific components or patterns]
  • Mobile-first or responsive

πŸ” Feedback Loops & Collaboration

*(completed by Design) *

  • [ ] Design kickoff meeting scheduled
  • [ ] Begin wireframes or discovery
    • Review Cycles: [e.g., Weekly syncs, async feedback]
    • Designer: Add screenshots of design and link to Figma page in comments
    • [ ] Iteration 1 - Add to Figma with explanation/comments
    • [ ] Iteration 2 - Add to Figma with explanation/comments
    • [ ] Final iteration - Add to Figma with explanation/comments

πŸ“‹ Deliverables

(Completed by Design) What specific design artifacts are expected?

  • [ ] User flows
  • [ ] Wireframes
  • [ ] High-fidelity mockups
  • [ ] Prototype (if needed)
  • [ ] Design specifications for handoff

⚠️ Known Risks or Open Questions

*(completed by PM) identifies uncertainties, potential blockers, or areas needing clarification that could impact the design work or project success. Gives designers a heads-up about potential challenges or decisions that haven't been finalized yet, so they can plan accordingly and flag issues early."

  • Are there uncertainties that may affect design direction?
  • Anything Engineering or stakeholders should weigh in on early?

πŸ”— Related Issues

  • User Story: [Link]
  • Research findings: [Link if applicable]
  • Technical constraints: [Link if applicable]

Action Items

  • Assign and Prep
    • [ ] Designer: Review User Story and self-assign
    • [ ] Designer: Conduct the necessary research (if applicable), clarify any questions
    • [ ] Designer: Work with PM and Design Lead to clarify any questions about the User Story
    • [ ] Designer: Designer work with Engineer team Lead to assign the appropriate size & complexity
    • [ ] Designer/Design Lead: determine if work should be split into multiple issues, if so, create issue(s) and link them in this issue (if applicable) or create as standalone.
  • [ ] Designer/Design Lead: determine and provide "start and end date" for Product to update.
  • [ ] Designer: Work with Design Lead to determine appropriate place/page to Draft Design in Figma
  • Draft and Review:
    • [ ] Designer: Draft Design
    • [ ] Designer: Change Issue Status to "For Review/Feedback Needed"
    • [ ] Designer: Add Label "Ready for: Design Peer Review"
    • [ ] Design 1st Level/Peer Review: Review and compare against Acceptance Criteria, provide feedback in comment section below, tag assignee.
    • [ ] Design 1st Level/Peer Reviewer: Change Issue Status to "Questions/Clarification" and add label "Ready for Dev Team"
    • [ ] Designer (Assignee): Change Issue Status to "In Progress"
    • [ ] Designer (Assignee): Review issue comment(s) and resolve accordingly
    • [ ] Repeat above steps until all Acceptance Criteria are accounted and comments are resolved
    • [ ] Design 1st Level/Peer Reviewer: Change Issue Status to "For Review/Feedback Needed" and add label "Ready for: Design Lead"
    • [ ] 2nd final/Design Lead: Review and compare against Acceptance Criteria, provide feedback (if any) in comment section below, add label "Ready for Design Team Member"
    • [ ] Repeat above steps until all Acceptance Criteria are accounted and comments are resolved
  • Let Product know that the design is ready for review
    • [ ] Designer: Change Issue Status to "For Review/Feedback Needed"
    • [ ] Designer: Add Label "Ready for: Product....Persona"
    • [ ] Designer: Tag the PM of the related User Story in a comment below and let them know that a draft is ready for review
    • [ ] Product: Review Design Screenshots and provide feedback
    • [ ] Repeat above steps until design is approved

πŸš€ Handoff Requirements

What needs to be completed before this moves to engineering?

  • [ ] Designer and Product: Review with Engineering for questions
  • [ ] Designer: Add link to Figma and Screenshots to a comment in the linked User Story
  • [ ] Design review and approval completed
  • [ ] Engineering handoff issue created
  • [ ] All design assets uploaded and documented

πŸ“Ž Resources & References

  • Existing Research: [403]
  • Brand Guidelines / Design System: [Link]
  • Previous or Related Designs: [Link]

pixellady avatar Mar 18 '25 21:03 pixellady