Design System Updates: Search/Filter Modal

[annaseulgi]

Dependency

• Pull data from previous years (e.g. 2023, 2022, etc) #1666
• UXD: Blank Map On Page Load #1848
• DEV - Remove Pins from React Redux State #1865

Un-Blocks

• Dev Ticket: DEV - Update Search/Filter Modal functionality and design #1868

Overview

The design team needs to update the calendar picker to address the following issues identified by the research and product teams:

• No confirmation after users select a date range
• Layout of the calendar is not intuitive
• Data is limited to the past 30 days (NEW issue as of 2/21/24)

Action Items

• brainstorm w/ design team to identify which features to improve on the calendar picker
• create wireframes and get feedback from design team
• revise wireframes based on feedback and create interactive prototype
• usability test interactive prototype with design team
• run through interactive prototype with developers to identify potential constraints
• add popover message to show users that data is limited to the past 30 days
• add double chevron to date picker/calendar to indicate earliest date of data collection
• Remove "Last 3 Months" from the date range dropdown and replace with "Custom Date Range"
• handoff to developers

Hand Off Materials

Figma Section Name: Search/Filter Modal #1600 - Final

Before Screenshot

After Screenshot (Finalized)

Resources/Instructions

• Interactive Prototype Figma file
  • please refer to the 'Allison J' page and the wireframes under 'INTERACTIVE PROTOTYPE - 2.27.24'
• Popover Message Figma file
  • refer to the 'Anna K' page and the 'Popover' section

[ryanfchase]

@allisonjeon @Joy-Truex does the design the updated date picker allow for users to type in the date? If so, this addresses one of the Action Steps outlined by our latest usability test data.

• UXR Action Steps '24 tx: Create August 2024 V1.2 Moderated Usability Test Action Steps Spreadsheet #1819
• Action Steps '24 spreadsheet
• Action Steps '24 slideshow, user requesting type-to-edit

[Joy-Truex]

• type to edit is a relatively light design lift
• dev solution will potentially allow for larger than 30 day range
• if that is the case then type to edit will be implemented

[traycn]

Iceboxed issue, dependant on #1865

Dependency is on knowing how much data we are able to request. If 1865 resolves the app crashing when making a request for more than 30 days worth of data, we will be able to use a larger date range for the chips (i.e.: 7 Days, 14 Days, 30 Days).

[ryanfchase]

Question for design lead:

• I understand that the Blank map discussion may consider removing the chips from our search and filters menu. If design team decides to move forward with removing chips, can we remove chips on this design as well? This ticket is blocked due to feasibility of chips -- removing the chips would greenlight this ticket to hand off to dev

[Joy-Truex]

Will be discussed in tonight's breakout room (2/12) after general meeting. ty!

[ryanfchase]

Question for design lead:

• I understand that the Blank map discussion may consider removing the chips from our search and filters menu. If design team decides to move forward with removing chips, can we remove chips on this design as well? This ticket is blocked due to feasibility of chips -- removing the chips would greenlight this ticket to hand off to dev

This ticket remains in the Questions column. I noticed not many designers were in attendance. If this needs to get kicked back to next general meeting, we can do that.

[Joy-Truex]

Thank you for your patience! After discussion with the design team at our breakout meeting tonight, it was determined that the user experience is improved more by a faster loading time (loading less info) than it would be by ease of selecting data (through chips, therefore adding a longer load time.)

Please let me know if any additional clarification is helpful. Ty!

[ryanfchase]

@Joy-Truex should we move this ticket back to design's New Issue Approval so that the mockup should be adjusted to remove the chips? Or should this be considered blocked until an upcoming design ticket removes the chips? I'm guessing chips will be removed on the blank map ticket, so we can mark this ticket blocked by the blank map ticket:

• UXD: Blank Map On Page Load #1848