• Purpose

    • Collect customer feedback to improve product, site and service; route urgent issues to support; capture testimonials and NPS-style input.

  • Primary goals

    • Make it effortless to submit feedback.
    • Let users choose feedback type (bug, product, delivery, compliment).
    • Offer optional contact info for follow-up.
    • Show gratitude and next steps after submission.

  • Page layout & sections

    • Header: Title + short intro
    • Feedback form (visible immediately)
    • Quick rating (1–5 stars) and category selector
    • Optional screenshot/file upload
    • Privacy and expected response time note
    • Secondary: Past feedback summary or FAQ link (optional)
    • Footer CTA to contact support (phone/chat)

  • Exact microcopy

    • Title: Give Us Feedback
    • Intro: We’d love to hear from you — your feedback helps us improve our products and service.
    • Form labels & placeholders:
      • Feedback type (dropdown): “Choose a topic — e.g., Product, Delivery, Site, Returns, Other”
      • Rating (label): “How would you rate your experience?”
      • Feedback (textarea placeholder): “Tell us what happened or how we can improve…”
      • Order number (optional): “Order # (optional)”
      • Email (optional): “Email (optional) — so we can follow up”
      • Upload (optional): “Attach image or screenshot (jpg, png, pdf) — max 5 MB”
    • Buttons:
      • Primary: Submit Feedback
      • Secondary (optional): Send via Live Chat
    • Success message:
      • Thank you! We’ve received your feedback. If you provided contact info, we’ll reply within 48 hours.
    • Error messages:
      • “Please select a feedback topic.”
      • “Please enter feedback (at least 10 characters).”
      • “Invalid file type or file too large (max 5 MB).”

  • Form fields & validation

    • feedback_type: required (enum)
    • rating: optional (1–5)
    • message: required, min 10 chars, max 2000 chars
    • order_number: optional, regex /^[A-Za-z0-9-]{3,20}$/ (if provided)
    • email: optional, validate email format
    • attachment: optional, accepted types [jpg,png,pdf], max 5 MB

  • UX & accessibility

    • Focus the cursor in the message field on page load.
    • Use aria-labels and associate labels with inputs.
    • Provide keyboard-accessible star rating and file upload.
    • Provide live character count for message.
    • Ensure contrast for all labels and buttons.

  • Mobile behavior

    • Collapsible help/FAQ at bottom.
    • Big touch targets for rating and Submit.
    • Preview thumbnail for uploaded file.

  • Backend / implementation notes

    • Endpoint: POST /api/feedback
    • Payload: { type, rating, message, order_number?, email?, attachmentUrl? }
    • Response: 200 { ticketId, receivedAt }
    • Auto-create support ticket if type = “urgent” or message contains keywords (refund, broken, missing).
    • Send confirmation email if email provided.

  • Analytics events

    • feedback_form_opened
    • feedback_submitted { feedback_type, rating_present, order_number_present }
    • feedback_attachment_uploaded