Reorder homepage to improve volunteer orientation and retention

[lalgee]

User story/persona As a user, I want to understand the following when I visit the Concordia homepage:

• What the site is for, including goals and outcomes (what has been accomplished and will be)
• What activities are available to me
• How to get started
• How to jump in
• Featured collections and challenges

Is your feature request related to a problem? Please describe. User research and feedback via email has shown that the homepage does not communicate to new users what By the People is or how to participate.

Additional context Specific recommendations from Winter 2020 user research include:

• Move “transcribe, tag, review” illustration of actions above carousel.

Acceptance Criteria The homepage quickly orients new users to the project and platform..

[lalgee]

We should also add obvious next-transcribable-asset and next-reviewable-asset links to the homepage. Though we sometimes use them in the carousel it’s not clear to folks how to consistently jump into activity if desired. This could simply be hyperlinked text.

[klee72]

@lalgee what are 'next-transcribable-asset' and 'next-reviewable-asset' links? and where do you want to place them on the homepage?

[lalgee]

If you add /next-transcribable-asset or /next-reviewable-asset links to the end of crowd.loc.gov or any campain url it will take you straight to an available page for that activity. So we'd want links that say something like "Jump into transcription" (https://crowd.loc.gov/next-transcribable-asset) or "Jump into review" (https://crowd.loc.gov/next-reviewable-asset)

We're open to design suggestions, but are thinking that it makes the must sense to put underneath the "Be a Virtual Volunteer" band? That way new users have to scroll past the band that contains instructions first.

[amandaperez]

030121-v1-Additional Links Layout.pdf

Hi @klee72, here is a first pass at adding the two links to the homepage.

[amandaperez]

030121-v2-Additional Links Layout.pdf

Hi @klee72 , I update the homepage with the new layout.

[klee72]

@lalgee: @amandaperez added a design comp above. Please take a look and let us know. TY

[lalgee]

thanks @amandaperez @klee72 ! we'll huddle and get you feedback tomorrow!

[lalgee]

Hi @amandaperez & @klee72 - Thanks so much for working on this! BTP team prefers the 1st page in v2 (with the orange icons on top and "Jump into a review"/"a transcription" text.

A few points of feedback:

• Please remove the "tag" icon and text. (we want to de-emphasize this form of contribution)
• Is it possible to create "get started" orange icon (linking to welcome guide) to substitute in place of tag? If not, just use the 2 icons for transcribe and review.
• Add "Surprise me!" in front of the "Jump into" text (To make clearer that they'll go to a random page)
• Add a little more spacing before "Jump into" to make clearer that it isn't related to the carousel slide above it.
• We want to update the text under "Be a virtual volunteer" but haven't had time to fully workshop it. Guessing that can be updated fairly easily by the devs after the reorganization?

[amandaperez]

030521-v3-Additional Links Layout.pdf

Hi @klee72, Here is a v3 of the mockup with

• Is it possible to create "get started" orange icon (linking to welcome guide) to substitute in place of tag? If not, just use the 2 icons for transcribe and review.
• Add "Surprise me!" in front of the "Jump into" text (To make clearer that they'll go to a random page)
• Add a little more spacing before "Jump into" to make clearer that it isn't related to the carousel slide above it.

[klee72]

@lalgee: @amandaperez uploaded a v3

[lalgee]

Love the magnifying glass icon @amandaperez ! V3 page 1 is looking really good, just a few more tweaks:

• Change "getting started" to "get started"
• Move "get started" to be the first icon. So order is get started, transcribe, review
• Text under orange icons is slightly different sizes, guessing that's fine since they're just comps
• Remove hyperlink from "Surprise me". It refers to the "jump to a" links, each of which will go to a random page to transcribe or review, respectively. For that reason, maybe the Surprise me text should also move closer to those links?
• Is there also a way to set the Surprise me section and jump in links off a little more from the carousel? We're still a little concerned folks may associate it with the carousel content. Perhaps even just a light line above it or color behind it?

Thanks!

[klee72]

@lalgee: I'll take care of first three of the list above when I'm actually modifying the code. And don't worry about the font size differences for now as these are just comps.

@amandaperez: can you look at the last two of the list? TY

[amandaperez]

030521-v4-Additional Links Layout.pdf Hi @klee72 and @lalgee, I have uploaded a v4 with the changes.

[lalgee]

Looks good! Thanks again @amandaperez

[klee72]

@lalgee Texts for "Be a virtual volunteer!" are in the template. Please provide the text for "Get started" and other text changes when you have a chance. TY

[klee72]

@lalgee: just wanted to follow up and see if you have the text for "get started". I have other codes ready to be pushed, and didn't want to push it with a placeholder "lorem ipsum".

[lalgee]

@klee72 Text for Get Started: "Learn how to volunteer"

[lalgee]

Looks great, Ki! A few tweaks:

• Please change get started link to https://crowd-test.loc.gov/help-center/welcome-guide/
• Change the text under "Be a virtual volunteer" to: Help transcribe Library of Congress documents. Volunteers create and review transcriptions to improve search, access, and discovery of these pages from history.
• Change the text under "Get started" to: Learn how to volunteer. Anyone can contribute!

[lalgee]

Perfect! I'll move to done @klee72 .