Design Volunteer Page (Join the ATD Team / Join the Science Community)

[KC243]

Overview

We will need to create a new page to allow users visiting the website to join the ATD team and the Hack for LA Data Science Community of Practice.

Action Items

• Create a high fidelity "Join the ATD Team" Page
  • Create lo-fi prototypes
  • bring lo fi prototypes to team for final decision
  • Build out a hi-fi page in figma
• Create a high fidelity "Join the Science Community" Page
  • Create lo-fi prototypes
  • bring lo fi prototypes to team for final decision
  • Build out a hi-fi page in figma
• Review work on drafts of volunteer done (as seen in comments below)
• Redesign volunteer page to be consistent with rest of the website's design (i.e. images, call to action buttons for each section). Make sure to include:
  • new header and footer with correct IA
  • a section for how to volunteer on the ATD team
  • a section (below) the ATD team for Data Science Community of Practice
• Review designs with team
• Add copy into design from UX writer from Write New Copy for Volunteer Page #251

Resources/Instructions

Figma
IA

[pbahle]

Here's a couple sketched prototypes for the join the ATD page.
I included the header and footer from the ATD high fidelity wireframes, as well as making sure we had separate options for both ATD and the science team, plus a relevant section to highlight either a team member's story or the project itself, please drop suggestions for other page elements

[mxajPrice]

Please add more context to the difference in joining AtD and HfLA Data Science.

• Access the Data repository
• Hack for LA Data Science Community of Practice repository

[mxajPrice]

please update your issue with the following info if you have not already

• Progress: "What is the current status of your project? What have you completed and what is left to do?"
• Blockers: "Difficulties or errors encountered."
• Availability: "How much time will you have this week to work on this issue?"
• ETA: "When do you expect this issue to be completed?"

[pbahle]

[](url

)
Progress: I've completed high fidelity wireframes of both join ATD and the data science team, with the exception of the copywriting
Blockers: What sort of text will go on the page
Availability: 1-3 hours
ETA: Next week, (assuming UX writing is also under my responsibilities)

[lrchang2]

@pbahle is this done? if so, please close this issue

[bkong]

@pbahle Can you please update this issue or close it if it's done?

[mxajPrice]

To be re-assigned.

[majkush]

I am happy to help whoever gets assigned this wireframe with the UX Writing. Please just reach out to me if I can be of help.

[lrchang2]

Need to redo pages to reflect "get involved' section on our current about page

[deepamohan22]

@mxajPrice @lrchang2
Progress: Tried Designing the Volunteer page
Blockers:
Availability: 6

hrs
ETA: 12 hrs

[deepamohan22]

[deepamohan22]

[lrchang2]

notes from 2/8/2023 team meeting

• team has decided to keep everything on one page
• get rid of form for "enter your information" to minimize data collection and use existing recruiting flows
• make 1st section "want to volunteer" more informational and letting people know about the opportunities out there. Aim is to lead people to respective github pages
  • ATD github
  • Data Science Community of Practice github
• make 2nd section "enter your information" more for people who know they want to volunteer (less resistance). Aim is to lead people to the Hack for LA Join Us page to start contributing asap

next steps:

• change sections to reflect notes from above
• work on mobile version

[deepamohan22]

@mxajPrice , @lrchang2
Progress: Added URL of AtD GitHub and Data science practice of community
Blockers: I can start Designing the volunteer page once I get a copy for UX writing New Copy of Volunteer page.
Availability: 6

[mxajPrice]

@lrchang2 and I were thinking this would be a button rather than a link, but perhaps @lesUXW can weigh in on what would look better.

[lesUXW]

Hi @lrchang2 and @mxajPrice, I also think a button would be visually better, and also easier for anyone to see it as a CTA.

[deepamohan22]

@lrchang2 , @mxajPrice
Changed from URL to Button

[deepamohan22]

[deepamohan22]

@lrchang2 @mxajPrice
Progress: Completed the mobile version Volunteer page
Blockers: I can add the new texts once I get the latest copy from Leslie

[lrchang2]

@deepamohan22 some quick design updates for consistency:

• make all buttons have the one with black text (about us- contact us section and volunteer page)
• update home page footer's IA to match other pages
• delete all social media icons off of the footer except for github

[deepamohan22]

@lrchang2 @mxajPrice
Updated volunteer page

[lrchang2]

note:

• underlined text in button means it's a link and is not a design choice
• next step is to update copy with updated copy with the formatting of bolding one that we voted on during the meeting

[deepamohan22]

@lrchang2 @mxajPrice ,
Final copy

Updated the volunteer page with updated copy of texts.
Added copy in Current Hi fi Wireframes

[lrchang2]

@deepamohan22 this looks great! only ask is that on the Desktop version, for the 2nd section for the community of practice, since we have the space, can you extend the bullet point text to be on one line?