usnationalarchives / nara-bia-photos Goto Github PK

This estimate needs to be revisited based on the new map

This was removed from the experience as a result of user testing.

To be confirmed with NARA

• Threespot will use IIIF for the thumbnail images in the experience
• We will use the legacy deep zoom images for the image detail pages because building a presentation layer API is not in our scope; if NARA wants to provide a presentation layer and JSON manifests, we can use that

@matbrady Miran flagged that the image viewer controls should have labels on them when you hover, like they do in the Catalog.

See example here: https://catalog.archives.gov/id/7431269

Jason asked how will file units appear in the experience. Do we have any file units in our data right now?

• Reduce the slider track height from 4px to 2px
• Change the track & handle color from #abe2fb to #345D96
• When the handle is active, change the background color from #ffffff to #345D96 so the circle is filled in
• Remove the light blue box shadow from the handle on hover

Dev

Design

https://nara-bia-photos.herokuapp.com/search
https://nara-bia-photos.herokuapp.com/tribal-nations/cheyenne-river-sioux-tribe-10444557
https://nara-bia-photos.herokuapp.com/topics/agriculture

Related
#16
#11
#12

On hover, a blue border should appear around each card.

https://nara-bia-photos.herokuapp.com/states

Desired design

Related
#10
#87

Final comps are here: https://invis.io/SYYGPMHP8ZV

This is an evergreen issue that will be done over time as the site is built

Flagging an update to the functional specs doc related to this:

NARA has tagged (publicContributions.tags.tag) to all tribal org authorities from the seeding effort with "Native American Tribe". That query is here: https://catalog.archives.gov/api/v1?publicContributions.tags=%22Native%20American%20Tribe%22&type=organization

They will also add this tag to all other tribal org authorities for any tribe related to one of the 18k records in the finding aid so we do not have to maintain a whitelist of tribal nations

This is also relevant to #11 #18 #4 #16 #14

Issue

• States that do not have any records should not have a detail listing page and therefore not appear in dropdown menus or be clickable on the map.

Examples

From dropdown on state listing pages: https://nara-bia-photos.herokuapp.com/states/arkansas

From dropdown on states landing page: https://nara-bia-photos.herokuapp.com/states

From map hover state on states landing page: https://nara-bia-photos.herokuapp.com/states

• for example, Alabama does not have any associated records so the hover state should read 0 records and therefore NOT be clickable.
  

Related

#10 and #13

@SpenceJMNelson Based on NARA's feedback, we need to create a new image/graphic for the second strata of the About page that is more specific to the records in this finding aid and not all of NARA's records in general. They recommend removing any numbers since it's difficult to ensure those are accurate. They suggested making the graphic more indicative of the fact that they are working on digitizing more records rather than adding more records to their holdings.

Current image:

There are also a few other dev updates required:

• Update the text to match this doc: https://docs.google.com/document/d/1NV46I_OShQMtRGSnA6urN7NilOnojI0-2v2NWX5b2wA/edit?usp=sharing
  Note: They got rid of the superheader text in each of the main 3 sections
• Remove the warning icon next to the text in the top section
  

We need NARA to confirm details on hosting and goal with regard to frequency of running this. To discuss as a part of the #76

In the footer, please update the text "If you are having difficult finding information" to "If you are having difficulty finding information"

The page banner's filter dropdown menu collides with the filters & thumbnails below when opened.

https://nara-bia-photos.herokuapp.com/topics/agriculture
https://nara-bia-photos.herokuapp.com/tribal-nations/cheyenne-river-sioux-tribe-10444557

Related
#11
#12

Final comp is here: https://invis.io/THY2TVQZFJU

We are now including paths to all 3 discover sections: Tribal Nation, Topic, and State. These link to their respective landing pages.

On hover, a blue border should appear around each card.

https://nara-bia-photos.herokuapp.com/topics

Desired design

Related
#9

@matbrady @danielboggs keeping a list of things that we need to make sure are included in our documentation for NARA here:

• How homepage images are managed
• How topics, states, and Tribal Nations are managed
• How curated images are managed on the three landing pages
• How art directed images in the banners on the three landing pages are managed
• How the map is managed on the state landing page (is it an image?)
• How the Tribal Nations included in the homepage Explore dataviz are manages
• How the Famous Native American images on the homepage are managed
• How image assets are managed
• How descriptions of the states, topics, and Tribal Nations on listing pages are managed
• How the mini map on the Tribal Nations listing page is managed
• About page content
• Booting/Running the application locally
• AWS specific configuration (@danielboggs)

SVGs for spinners:

spinner-svg.zip

Codepen showing animations:

https://codepen.io/SpenceJMNelson/pen/WNrVGMr

Progression:

In general, I think we should place a minimum height on the element containing the photo grid so that the footer doesn't momentarily jump into view when cards are loaded in. Additionally I think it would be nice if the cards faded in quickly rather than appeared to signal that it's a new grid of items with each search/filter.

Initial State:

User states typing
green search button switches to spinner, helper text fades out and main spinner fades in

User pauses long enough for search to initiate
main spinner fades out, first row of items fades and translates in from bottom in sequence, remaining cards fade in as a whole as the count and density controls fade in

search is complete
green search spinner disappears

search is complete
green search spinner disappears

user adds tag
photos quickly fade out, main spinner appears as long as necessary and new photos fade in.

Note: We need a solution for showing records with more than one asset associated.

Please update "Photos" to "Records" and capitalize "tribal nations" on all the state landing page tiles where it says "Photos related to # tribal nations...". It should say "Records related to # Tribal Nations..."

State landing page state cards "Photos" > "Records"

The search field hint text currently says, "Enter a name." Please update it to "Enter a keyword or phrase"

https://nara-bia-photos.herokuapp.com/search

Related
#16

What do we need to do to hand this off to NARA? Should that happen pre-QA or pre-UAT?

To Do

• Add notes/reqs from RFQ
• Get an update from NARA on whether this is going live when we hand it off or not
• When does that happen? October or December?
• Should we test on their environment? Anything weird about that? Recommend QAing on their environment
• Need to understand their hosting setup to be able to finalize the approach for updating records "in real time" / automatically

Final comp is here: https://invis.io/PHYGPPB2TC7

This is a modal now, not a drawer

Final comp is here: https://invis.io/K7YGPS8G6X9

This exists on the Homepage only. Clicking records on listing pages and search results will immediately direct you to the image detail.

Filing a separate ticket for this so it doesn't get lost.

Please replace the placeholder banner images on the Tribal Nation, Topics, and States landing pages with the final images in drive: https://drive.google.com/drive/folders/1p9Uqc0T2IWHyrcXU0cxTqeXENLL5IWpb

Related
#8
#9
#10

On breakpoints between ~770–1050px wide, the NARA logo and finding aid name break to multiple lines.

Let’s drop the "National Archives" type, and make the logo/finding aid name and nav labels smaller.

Dev

Desired design

Related
#2

Search should be represented by a magnifying glass icon instead of a "search" label

Dev

Design

Related
#2

Please update the images with the ones NARA has selected for the:

• Homepage grid
• Famous Native Americans section
• State landing
• Tribal Nations landing (to show between letters)
• Topics landing
• Topic detail pages

All images URLs are here: https://docs.google.com/spreadsheets/d/1Uf2eYkxmT_T2ejNDj9PrXNwH9Pw1zeCWhH4QBZsV5nI/edit?usp=sharing

@danielboggs Jason has added a single variant name to a single tribe in the Catalog, but I think we can use this as a model for being able to include variant names in search queries:

Here is the one we added the variant name to: https://catalog.archives.gov/api/v1?naIds=10444557

Cheyenne River Sioux Tribe with variant name of Cheyenne River Lakota Nation (Oyate)

Please update the list of topics throughout the app with the final list from NARA:

Agriculture
Animals
Art and Artifacts
Buildings
Bureau of Indian Affairs Personnel
Camps
Children
Clothing
Communities
Construction
Councils
Dances
Events
Fishing
Food preparation
Groups
Dwellings
Hunting
Portraits
Recreation
Reservations
Manufacturing
Landscapes
Leaders
Military Service
Music
Schools
Transportation

You can also see the list here: https://www.archives.gov/citizen-archivist/missions/bia-photographs

The size of 21 includes 13 points for integration/handling, so this should be the first landing page developed

All listing pages should be built together because they are essentially all the same page. Most effort is allocated to this page for tracking/planning.

Final comps are here: https://invis.io/D8YGPOMMCXH

This is a modal now, not a drawer

Since we're loading many images at once and we need to have some kind of visual indicator to the user that an image will be loaded in this space. This could be something simple like a gray tile or a simple animation. Please connect with @danielboggs on this.

The h1 font size doesn't scale down on mobile. Please make these adjustments on mobile:

font-family: PublicSans-Bold;
font-size: 32px;
line-height: 38px;

Dev

Style guide

Related
#1
#11
#12
#16

The text below the map is currently 16px. Please reduce the font size to 13px with 20px line height

Dev

https://nara-bia-photos.herokuapp.com/states

Related
#10

NARA's copy doc is here: https://docs.google.com/document/d/1nMdUA-iJiLA6x6YbQ6eIFcn2KrUs-xY7j11m40wbJ-0/edit?usp=sharing

This does not include final language for the About page, which is noted in #7, or the citation or "also in this series" description, but those are noted in #14

Issue

• The tribe listing map should link to the state(s) that have records associated with that tribe.

Expected Experience

• As a user, if I click on the state under the tribal listing page map, I would like to be taken to the state listing page filtered by the tribe whose listing page I was just on

Example

https://nara-bia-photos.herokuapp.com/tribal-nations/cherokee-nation-10445840

Should link here: https://nara-bia-photos.herokuapp.com/states/oklahoma?tribalNations[0]=Cherokee%20Nation

Related

#11

@danielboggs to review the specs from Jason that outline the unique URL structure of some of the assets in S3 and make sure we can use that to finish the IIIF implementation. This is currently preventing the following pages from being complete:

• Search #16
• Tribal Nations detail/listing #11
• Tribal Nations landing #8
• Topic detail/listing #12
• Topic landing #9
• State detail/listing #13
• State landing #10
• Homepage grid #3

Client requested we confirm WCAG compliance for the region labels on the State Landing #10 map

States Landing Page - http://nara-bia-photos.herokuapp.com/states

Example page: https://nara-bia-photos.herokuapp.com/tribal-nations/cheyenne-river-sioux-tribe-10444557

The tool tip is missing from the header on all 3 landing pages

• Tribal Nations
• Topics
• States

This should include the title of the image and a link to its detail page. Currently, we're using the same images on all 3 pages.

Design: https://invis.io/CZYV22TK2BW

Site: https://nara-bia-photos.herokuapp.com/tribal-nations

Remove the text wrapping around checkboxes

Add a space between labels & the parenthetical count

Dev

Desired design

https://nara-bia-photos.herokuapp.com/search
https://nara-bia-photos.herokuapp.com/tribal-nations/cheyenne-river-sioux-tribe-10444557
https://nara-bia-photos.herokuapp.com/topics/agriculture

Related
#16
#11
#12

Final comp is here: https://invis.io/PEY3K0JQATW

We are not using IIIF on these image detail pages.

On mobile, "Photography Finding Aid" breaks to two lines. The full name should scale down.

Dev

Design

Related
#2
#40

Overview/Functionality

• Elevate the active filters on the BIA search page so that users do not have to scroll through a long list of tribes (for example) to find those that will actually yield results
• For example, the keyword search for 'buildings' currently delivers the dropdown on the left but would become something like the dropdown on the right if we were to elevate the active filters to the top:
  

NOTE: holding off on changes until we have the full set of 18k tagged records