Adjust and standardize "Share Your Wins" form page

[kristine-eudey]

Dependency

• Until we get the research drive and wiki cleaned up we don't know if the research happened or not.
• We need to determine if users prefer a single page form or they prefer the progressive version.

Overview

We need to adjust and standardize the Share Your Wins form pages (not connected to the site yet) so that they have more even spacing and match the design system

Action Items

Design

• Review the flow of the Share Your Wins form pages (enter placeholder text and continually click ‘next’ to view all pages- but don’t submit)
• Design improved and standardized replicas of the desktop and mobile versions of the Share Your Wins page- in the Wins Figma file
  • Start by duplicating the ‘Google form’ frame in the pink rectangle in the Figma file, and go from there
  • Make sure all text sizes follow the Design System typescale (for ex, in desktop 35px font should be 36px, and then 28px in mobile)
  • Make sure the to add more spacing above and below text where they are too crowded
  • Use standard button components from the Design System instead of the current white square buttons

Development

• Develop the design adjustments in the Share Your Wins
  Including:
  • Spacing/margin adjustments
  • Replacing buttons with reusable button components from the design system
  • Make sure there is no more white strip on the bottom of the page below the footer (it’s only on this page)

Resources/Instructions

Share Your Wins form page (not connected to the site yet)
Wins Figma design
Design System in Figma

[github-actions]

@anonymousanemone

Please add update using this template (even if you have a pull request)

1. Progress: "What is the current status of your project? What have you completed and what is left to do?"
2. Blockers: "Difficulties or errors encountered."
3. Availability: "How much time will you have this week to work on this issue?"
4. ETA: "When do you expect this issue to be completed?"
5. Pictures: "Add any pictures of the visual changes made to the site so far."

If you need help, be sure to either: 1) ask for help at a Tuesday or Sunday meeting, 2) put a "Status: Help Wanted" label on your issue and pull request, or 3) put up a request for assistance on the #hfla-site channel.

_{You are receiving this comment because your last comment was before Tuesday, August 10, 2021 at 12:10 AM.}

---

Note: This comment was created as part of a GitHub Action during its trial phase. If you find this GitHub Action to be disruptive/unhelpful, or if you believe there might be a bug, please leave a comment on this issue. All feedback will be used to further improve it. Thank you for your time.

[anonymousanemone]

1. Starting to work on copy of form, need to familiarize with the form and it's parts
2. I don't see the square button in the Figma? (when I go on the website, I see it, but I'm not sure where I should put that in in Figma)
3. 5 hours
4. By next Sunday

[github-actions]

@anonymousanemone

Please add update using this template (even if you have a pull request)

1. Progress: "What is the current status of your project? What have you completed and what is left to do?"
2. Blockers: "Difficulties or errors encountered."
3. Availability: "How much time will you have this week to work on this issue?"
4. ETA: "When do you expect this issue to be completed?"
5. Pictures: "Add any pictures of the visual changes made to the site so far."

If you need help, be sure to either: 1) ask for help at your next meeting, 2) put a "Status: Help Wanted" label on your issue and pull request, or 3) put up a request for assistance on the #hfla-site channel.

_{You are receiving this comment because your last comment was before Tuesday, August 17, 2021 at 12:02 AM PST.}

[anonymousanemone]

1. Standardized fonts and colors according to design system
2. None
3. 5 hrs
4. Wednesday