Closed anthonycuellar closed 3 years ago
During the client demo today, it was determined that the social media icons were not needed in the page options. We have simplified the page options to print and email on desktop and email on mobile in the prototypes. We will talk to CIS then the FCI team to gain more insight. Desktop: https://publicis.invisionapp.com/share/KN10COU5UYCW#/450121241_desktop_-_No_Dropdown Mobile: https://publicis.invisionapp.com/share/3C10NGGUXTYQ#/450121813_2-Mobile
During the client working session today, it was determined that page options for email were not needed on mobile in the prototypes. We will rely on native share options on mobile. We will keep print and email on desktop.
Feature description
Persistent page options - allows user to print, email, and share to social media. Font size adjustment available on certain content types.
Description of Task to be worked on
Propose a design for the visual and function of page options. May include recommendations to add or remove features.
Problems to solve + Questions to Answer
Documented on Notion: https://www.notion.so/Page-Options-acbf5b361da143f6ae4f26c520c14231
Sub-Tasks
Add links to related tickets as needed.
Inputs and References
Links to discovery or research work to consider
Mural: https://app.mural.co/invitation/mural/publicissapient7269/1613685599666?sender=claireblaustein5539&key=9c64f6b7-7c3a-4512-84e2-75d19938bbc1
Discovery Ticket: Discovery: Page Options #32
Other sites using USWDS: https://designsystem.digital.gov/getting-started/showcase/all/
Healthcare.gov has email and print at the top on desktop but drop them on mobile: https://www.healthcare.gov/lower-costs/save-on-monthly-premiums/
medicare.gov has print on desktop, drops it on mobile.
HHS, NIH, DHS, medicaid.gov use addthis on all breakpoints (see HHS and NIH screenshots below).
EPA has facebook, twitter and email at the top on all breakpoints.
USCIS, CIA, USDA has no page options.
GSA has options at the bottom of the page on all breakpoints.
whitehouse.gov has sticky sidebar on right with facebook, twitter, and link copier on desktop, drop it on mobile. They have a contrast editor and font resizer as a sticky sidebar on the left on desktop which switches to the right on mobile.
Department of Commerce has a few options at the bottom of the page on all breakpoints:
NIH: https://www.nih.gov/news-events/news-releases/large-clinical-trial-study-repurposed-drugs-treat-covid-19-symptoms
HHS: https://www.hhs.gov/programs/hipaa/index.html
Design Research & Inspiration
Space to add inspiration, moodboards,etc
Outcomes
Design Functionality
Describe how the design should function, e.g. color changes on hover
Design specs / InVision
Design specs indicated in the InVision links below. Please view in the inspect mode along with the comments panel
Assets