Design Mock ups for my project page

[Biuwa]

Dependency

• Reordering the CSV File Download Columns #1591
• Design Mockup: Filter slide in placement #1579
• Design Mockup: Redesign the My Projects Filtering UI #1578
• Design Mockup: redesign the search bar  #1580
• Allow users to make/retract a link that shares a snapshot of their project #1369
• Design Mockup: Create share buttons on my project page #1371
• Design Mock-up: Allow users to delete/hide projects #1383
• Design mockup: Create a share modal on my project page #1384
• Design Mock up: Allow Users to filter projects on my project page by date #1385
• Create a more modal on my projects page #1388

Overview

This issue will track the mocks up and designs changes to my project page.

Resources/Instructions

• Options availability Chart
• Meeting notes and recommendations are detailed in Create Admin Accounts & Security roles for LADOT/LACP #1357
• Delete/Hide feature Video Guide
• Filter feature Guide
• Snapshot filter Guide
• DROs Map

[Biuwa]

Order of Priority:

1. Create Snapshot
2. Share Snapshot
3. Navigation to the snapshot page from my projects page
4. The appearance of the snapshot vs the project on my projects page
5. Filter
6. Delete/hide
7. Submit Badge

[Noushie]

Hi @Parisajf and @Biuwa

So the gridlines are not left by designers- that is a weird thing that Figma does out of our control (that has been an issue for awhile and none of us can figure why that happens since we almost never have our grids on).

Here's the shortcut to remove that: MacOS: Control G. Windows: Ctrl Shift 4.

Shortcut Icons:

To be sure, is this what was being proposed:

• All icons are now displayed at the top (if this is the case, then for best practice/consistency, all selection types should have all icons displayed like this)

• Users are only allowed to mass delete or hide (if applicable) - all other actions must be done individually?

Filter Adjustment:

The space is getting quite limited on the filter modal - so I'm suggesting we do the following formatting change:

• Have the top filters as dropdown selection (it will display the default option then provide the rest of the other options when clicked)

• DRO will be disabled until applicable- the default being assigned?

• Add submitted date, with the other date pickers

• Have a scroll bar in-order to allow users to view all options (to combat what feels to be relatively tight/cramped)

Please let me know asap if this works - I did not adjust ALL wireframes to reflect this as I am waiting for feedback.

[Biuwa]

@Anuosha, Thanks for the feedback, this seems to capture all of the changes and for the filter, I think it might be best to show stakeholders both options and then get back to your team with their selection.

Please change the print tooltip to the words Parisa provided above

[Parisajf]

@Noushie The tool tip for hidden and deleted options would be different:

For delete: "Your selection includes deleted items"

For hidden "Your selection includes hidden items"

instead of "Your selection includes deleted/hidden items"

[Biuwa]

Adding this here for reference:

#1440 (comment)

" 2023-10-04 STAKEHOLDERS MEETING FEEDBACK:

@Noushie

Projects should be filtered by Development Review Offices (DRO) instead of Regions
Yes, LADOT wants it visible to users(Submitted project only), so they can be able to see inquiries and statuses about their projects so it can be directed to the Development Review Offices.
The also provided us a link to the map of the DROs: https://lahub.maps.arcgis.com/apps/instant/nearby/index.html?appid=3f1ffa8b2949449e9038ee54aede3458 "

[Noushie]

@Biuwa @Parisajf

Questions of 11/2 Meeting:

1. What is the confirmed distinction between 'Print Summary' and 'Download PDF'

• Does 'Download PDF' need to become 'Download as .csv,' if there's no difference?

• Do we need to bring back the option to 'Export as .csv'?

2. Are these 'Active Project' tooltip selection variations correct?

Single Selection Active Projects:

• All options are only enabled here, correct?

Multiple Selection Active Projects:

• Same status + different visibility

• What about different statuses? What are the options for multi-selection/single selection?

• What about the sharing option?

3. Are these 'All Project' tooltip selections variations correct? Note: Possible word change in 'Your selection includes -- items" -> item(s)?

• Multi-selection:

• Single-selection (deleted):

• What about recovery option? Is that just not included in selection mode?

• Single-selection (visible + draft or snapshot):

• Single-selection (hidden + draft or snapshot)

[Parisajf]

@Noushie I created a chart for availability of options; it's actually 8 different scenarios. @bonniewolfe please check the chart and let me know if it needs any changes

[Biuwa]

2023 STAKEHOLDER MEETING FEEDBACK:

• During the meeting, we noticed that some of the mockups were missing addresses, please re-add the address column to the mockups' missing addresses
• All pages need to be consistent in Figma. But because of the ever-changing feature/requirements, one single page should be made that shows the finished my project page column, headers, and all possible values.
• If a user selects a project that is not applicable from the menu options, will those options be grayed out with a hover tooltip or be missing from the menu options? E.g If a user selects a project that does not meet the target points or a non-snapshot, should the submit to LADOT or share snapshot be grayed out with a hover tooltip or not available on the menu options?

[Biuwa]

2023-01-09 STAKEHOLDERS' MEETING NOTES:

For the dev Team:

• Users should be allowed to search by all text (from every column) and then allow the search to be narrowed down.
• Move the slide-in filter to the right so it's near the filter button,
• Current search by date format is in MM/DD/YYYY and needs to be changed to ISO YYYY-MM-DD and should be implemented to search as it is not currently functioning
• The N/A columns should be removed from the CSV

For the design team:

• Move the Project name, Address, and alternative no below the created on, modified on the filter slide-in in with the header search specific fields

[Biuwa]

Please provide an update:

1. Progress(What is the current status of your project? What have you completed, and what is left to do):
2. Blockers(Difficulties or errors encountered):
3. Availability(How much time will you have this week to work on this issue):
4. ETA(When do you expect this issue to be completed):
5. Pictures (if necessary)(Add any pictures that will help illustrate what you are working on):

[ExperimentsInHonesty]

2023-01-23 Stakeholder meeting feedback:

• Emily and Xander both agreed that filter choices should be saved for the session, but not beyond. A Session was then defined as until you log out or close the tab.

• See the screenshots on recreation.gov for how it shows the number of filters you are using:

[Biuwa]

@limjoyce

Please provide an update:

1. Progress(What is the current status of your project? What have you completed, and what is left to do):
2. Blockers(Difficulties or errors encountered):
3. Availability(How much time will you have this week to work on this issue):
4. ETA(When do you expect this issue to be completed):
5. Pictures (if necessary)(Add any pictures that will help illustrate what you are working on)

[Parisajf]

• Remaining item from this issue moved to Implement My Projects Page Filter Settings Retention #1683