Redesign the Suggestions Administration board and modals

[gigicobos]

Overview

Currently, user corrections and new org submissions aren't being processed because they are not visible to admins or volunteers.

We need a way for admins and volunteers to review, triage, track, and view suggestions submitted by the public. This will allow volunteers to update organization details.

This is a first step towards supporting more crowdsourced organization submissions and updates.

Issue created as a continuation of issue #1069 to improve the layout of the Suggestions Administration board.

Current issues:

• The current "Suggestions" page does not show the source of the "suggestion". The "Suggestions" will come from three places: "Suggest New Listing", "Send Correction", "Organization Email Reminder".
• The admin volunteer does not know when the correction/listing/update was submitted.
• Admin volunteer does not get notified of new suggestions. (separate GitHub issue tbc Gigi C)
• Suggestions are not recorded in the Organizationedit form. (separate GitHub issue tbc Gigi C)

Proposed Changes:
Admin Board:

• Add columns Submission Date, Type, and Suggestion ID# on the Suggestions admin board.
• Add an option to filter by “Type” of suggestion.
• Change the status wording from “Closed” to “Accepted”
• Add a "Create New Listing" button so if a suggested new listing is accepted, the admin could create a new listing with the matching fields from the suggestion filled in. The admin could then finish the listing or assign it to a volunteer to verify.

Correction Modal:

• Change field order to show first information about the suggestion and then tipster details.
• Add fields: Suggestion ID#, Type, Submission Date.
• Add a new button “View Organization” that will open a new tab with the Organizationedit page related to that organization.
• Move buttons to the top right corner of the modal.

Create Listing Modal:
Change fields showing up on modal to match the fields of the “Suggest New Listing Form”.
Add fields: Suggestion ID#, Type, Submission Date.
Added a new button “Create New Listing” that will open a new tab with the Organizationedit page for a new organization with pre-filled data available from the “New Listing” form.

• Move buttons to the top right corner of the modal.

Action Items

• Create a prototype for the Suggestions Administration board to include the type of suggestion and date.
• Create prototype for Correction and New Listing modal.
• Create a notification email for new suggestions.

Resources/Instructions

Designs: https://www.figma.com/file/D3oq9QOXl0rFkwrEUJbABs/FOLA-Design-System?node-id=6426%3A11578

P1: Suggestions board - 12/02/21
P2: Suggestions Administration Board V2 - 01/15/22

Related Issues

#996 --> Logs from "Organization Email Reminder" will be visualized on the "Suggestions" page.
#1139 --> Logs from "Suggestions" accepted logs for each organization will be visualized on the "Status Change" page.

[gigicobos]

Hi @entrotech @Benbaillou @fancyham,

Here is the link to the changes for the Suggestions admin board:

P2: Suggestions Administration Board V2 - 01/15/22

Please let me know if there are any questions.

Thank you!

[fancyham]

Thanks — added two comments re: the titling of the Suggestion record details and placement of the organization name. Perhaps consider in the top right corner, rather than the org name, putting something about the suggestion record up there in addition to or as the primary identifier? “Suggested correction #102929” (org name would be further down page) “Suggestion #102929 - Correction (New)” “Suggested correction for MountainView ADHC” “MountainView ADHC : Suggested correction #102929” “Suggested new listing #191219” “Suggestion $102929 - Add listing (New)” “Suggested new listing for MountainView ADHC”

…

On Jan 20, 2022, at 4:15 PM, gigi ***@***.***> wrote:  Hi @entrotech @Benbaillou @fancyham, Here is the link to the changes for the Suggestions admin board: P2: Suggestions Administration Board V2 - 01/15/22 Please let me know if there are any questions. Thank you! — Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you were mentioned.

[sei1122]

Before designing this issue, I’d like to clarify things below.

Figma file:
https://www.figma.com/file/D3oq9QOXl0rFkwrEUJbABs/FOLA-Design-System?node-id=4982%3A9019

Source of the data

The "Suggestions" will come from three places:

1. Suggest New Listing ✅
2. Send Correction ✅
3. Organization Email Reminder -> where can we find it?

Suggestions Administration

What is each status meaning?

• New
• Pending
• Rejected
• Closed - > (This is suggested to change to Accepted)

Questions:

• Does the admin volunteer change the status when validating the info?
• ID (Ticket #) is assigned when the suggestion is created?

Note: Change the Suggestion Administration title to be more descriptive?

New listing model

Is this brand new feature?

Other questions

• Is each data source validated in a different way?
  • Suggest New Listing
  • Send Correction
  • Organization Email Reminder
• Is this feature currently used by admin volunteers? If it is not used, would they use the feature if it was redesigned? -> because the goal is for this data to be reflected on the website.
• What are good metrics to measure this redesign?

[fancyham]

Good questions! I’ll do my best to answer based on my understanding:

For item 3 above, we haven’t built the Organization Email Reminder, but the Milestone for that project is https://github.com/hackforla/food-oasis/milestone/15 and #996 which has a design-in-progress mockup in the Figma file: https://www.figma.com/file/Xkrt1u1TdxHG2H1ppxpAtt/Issue%23-996?node-id=0%3A1

I believe @entrotech has more detail on “Status” but my understanding is that these are way of tracking suggestions:
New = a suggestion that hasn’t been acted on yet
Pending = Something that is in progress (perhaps being researched) but is not approved yet?
Rejected = Rejected (I think this can be hidden by default)
Closed = Probably should be “Accepted” — the idea is that the suggestion was accepted and the listing updated.

I’d add that another flag for the future might be “Submitted by organization” — for when we send out emails to orgs asking them to verify or update their listing. If we want to review those updates, this flag would be helpful to know which suggestions are high-quality and need less verification work.

“New listing model”
I think this would be a brand-new feature? I like how the fields show the suggestions on each line though I wonder if hours can be entered this way?

This begs the question: how will someone review and update the organizations from the suggestions list? Would it be two windows side-by-side? Or would the suggestions be shown on the existing editor screens? Or some other option?

Is each data source validated in a different way?

• Suggest New Listing
• Send Correction
• Organization Email Reminder

Sorry, I don’t know this but I imagine it’s different, with the second two being similar to each other.

Suggesting a New Listing : would be nice to copy the fields over to a new draft listing, and perhaps to expose the correct fields on the suggestion form to make that easier — less copy and pasting and retyping.

BUT how often do new listings get created? Probably not that often! So maybe lower priority than making corrections easy?

Is this feature currently used by admin volunteers? If it is not used, would they use the feature if it was redesigned? -> because the goal is for this data to be reflected on the website.

I think submitted suggestions are currently ignored! @entrotech ?

What are good metrics to measure this redesign?

I’d say ease of use and how quickly someone can review and update listings

[sei1122]

@fancyham, @entrotech

I created a user flow to see the overall steps.
Currently, we don’t have a way to check whether the info comes from a trusted source or not.
All the information must be verified before the information goes on the website.

Figma file
https://www.figma.com/file/D3oq9QOXl0rFkwrEUJbABs/FOLA-Design-System?node-id=5414%3A9263

[sei1122]

@entrotech, @fancyham
The current design, both Correction info and Suggests a New listing data go to the Suggestions Admin Board.
At the last meeting, we found out the admin user needs to back and forth between pages.

To improve this, we pivoted direction.

1. Correction info ----> Verification dashboard column
2. Suggest a New Listing ----> Suggestions Admin Board

Here is the new user flow for the 1 and 2

Figma files
https://www.figma.com/file/D3oq9QOXl0rFkwrEUJbABs/FOLA-Design-System?node-id=5524%3A9295
https://www.figma.com/file/D3oq9QOXl0rFkwrEUJbABs/FOLA-Design-System?node-id=5529%3A9662

[fancyham]

Looks really good!

On the “Suggest a new listing”

• You might already be on the same page but we might be able to save some copying and pasting if we:
  • Have a button for each new org suggestion (column 2) that creates a draft org record and copies over the simple fields like “organization name” and similar matching text fields automatically.
  • More complex fields like “hours” could be displayed at the top of that draft org similar to a suggestion.

Also, I wonder how the admin currently reviews for duplicates before creating a new entry? Is that something we can help with here, like a ‘search for similar’ button/feature perhaps?

We don’t have many suggestions in the LA area but I can imagine that there’ll be lots more in the future as we start supporting other regions.

[sei1122]

I updated the user flow and designed key pages.
Hope we can find a simple design solution and test user flow.

Figma file link
https://www.figma.com/file/D3oq9QOXl0rFkwrEUJbABs/FOLA-Design-System?node-id=5680%3A9463

user flow
https://www.figma.com/file/D3oq9QOXl0rFkwrEUJbABs/FOLA-Design-System?node-id=5524%3A9295

design
https://www.figma.com/file/D3oq9QOXl0rFkwrEUJbABs/FOLA-Design-System?node-id=5680%3A9463

[sei1122]

Update design based on last week's feedback.

Figma files
https://www.figma.com/file/D3oq9QOXl0rFkwrEUJbABs/FOLA-Design-System?node-id=5751%3A9457
https://www.figma.com/file/D3oq9QOXl0rFkwrEUJbABs/FOLA-Design-System?node-id=5754%3A10039

[sei1122]

@entrotech, @fancyham
Here is the final of the Suggested Correction's Flow and Design. I wrote comments on the Figma file.
Let me know if you need anything.

Figma file
https://www.figma.com/file/D3oq9QOXl0rFkwrEUJbABs/FOLA-Design-System?node-id=5876%3A9657

[sei1122]

Now we moved to Suggestion's new listing design.
This is a note from last week.
@fancyham and I reviewed the current design that Gigi created earlier.

Here is Ideation
https://www.figma.com/file/D3oq9QOXl0rFkwrEUJbABs/FOLA-Design-System?node-id=5781%3A9513

1. Update the tile to "Suggestion a New Listing - Admin"
2. Remove type since this is only for the New Listing
3. ID still needed? -> this is Optional. Talk to John about the use case.
4. Delete the suggestion section on dashboard because this is for the correction items
5. Current status is New, Pending, Rejected, and Accepted. Do we need all status?
   -> New, Created, Rejected status is maybe enough
6. How to handle the Status. Change the status on org view?
   -> Research more
7. After the org info is created, does all the info stays in this table, or remove once verified? -> Keep for now.

[sei1122]

Based on last week's meeting, I created 2 design ideas.

1. Use the current dashboard and detail view modal and redesign them.
2. One-page style - this design doesn't use a dashboard.

https://www.figma.com/file/D3oq9QOXl0rFkwrEUJbABs/FOLA-Design-System?node-id=5936%3A9568

Things to consider
1 How the admin checks the duplication before creating the new org data?
Idea: “Search for similar” button feature. Check by org name?

2 Click Create button and auto fill the data from tipster. How to handle the business hours?
Idea: Have notification on business hours page.

3 Check Status Handling
-> We need New, Reject, Created, Accepted
Create State diagram

4 When the verification is completed, is it possible auto change the status on Suggestion dashboard so that admin doesn’t
need to come back. Also, this prevents from multiple checking the org status that have already verified.
-> how to match up the data? use ID?

[sei1122]

Last week, we talked about using these 3 states: New, Created, and Rejected. However, when I made a state diagram, I found out we need to have one more status that handles the completion of the states.

Here is the state diagram

https://www.figma.com/file/D3oq9QOXl0rFkwrEUJbABs/FOLA-Design-System?node-id=5965%3A10892

[staceyrebekahscott]

@sei1122 @fancyham Have you followed up with the Dev team on part 1- correction section, as noted in the comment above? What is the status on their work?

[sei1122]

I will follow up

[sei1122]

Here is from @entrotech
"Development hasn't started on this issue. The devs are trying to button up a significant internal project in the next week or so, then we will start on new feature issues like this one."

[fancyham]

FYI, Issue #996 has a proposed, non-MVP corrections form (see below).

It's a big lift to do that but if it's built, that would probably have some impact on this suggestions admin flow:

• Would probably make some things easier for validation volunteers
• How to track and represent those suggestions? (perhaps a suggestion is automatically created that summarizes the proposed changes, along with draft database changes… that can be easily approved by the validator?)

It's also possible (perhaps likely) that we'll start out by using a free-form corrections form, and build this dream corrections interface later, once we've proven and streamlined #996's flows.

More of an FYI to keep an eye on #996 and also to plan for the future.

Sketch of the #996's proposed corrections form:
https://www.figma.com/file/D3oq9QOXl0rFkwrEUJbABs/FOLA-Design-%231?node-id=8272%3A14553&t=VyVJUDNq4jslGEKW-4

[fancyham]

Quick update:

prioritization

These two related issues were evaluated together along with current priorities and knowledge

• Design a self-service system for pantries to verify/update their own info #996
• Redesign the Suggestions Administration board and modals #1131

Now that Erin (Product Manager) has brought managing volunteer updates in-house with UCLA student volunteers (which has been working amazing. Previously it was managed and run by LA Works), we now have the benefit of direct experience with updates and suggestions.

• Suggestions seem to be a doable manually without building much, so is lower priority
• What’s most useful right now is to prioritize the self-service corrections feature from Design a self-service system for pantries to verify/update their own info #996, so putting this issue on the back burner for now and focusing efforts there.

[qiqicodes]

@JohnHaoHuang Here is the ongoing conversation regarding the redesign of the Suggestion Dashboard.

We, the developers, are addressing an ongoing issue with the Suggestion Dashboard as outlined in issue #2121. We've noticed that the dashboard currently does not display correction data, and it's not possible to differentiate whether the data originates from the correction form or the suggestion form.

To effectively bridge these gaps until the full redesign is implemented, we propose adding additional columns temporarily. This modification will help ensure that all necessary data is captured during this interim period.

Please keep us informed about the progress of the new design and let us know when it is ready for implementation.

[fancyham]

Hi, I think that adding additional columns temporarily will work in the interim. The goal is to capture and expose all that info so updates can be made more easily, so the proposed steps in #2121 sound great.

[farahrobleh]

@gigicobos @fancyham As we're looking organize our milestones, we're seeking clarification on this particular issue: what is the current state of the Suggestions page/Suggestions Administration board and modals, and would this be considered expanding on an existing feature, or creating a new one?

[ExperimentsInHonesty]

Review this issue, ask Bryan Wu for any clarifications,

• and possibly integrate a new issue being opened on the repo when there is a new listing to review. See example from the website team, where when people put in a new win, in the form on this page https://www.hackforla.org/wins/ it opens a new GitHub issue saying that there is a new win form submission has been created, and needs to be reviewed. see Review Needed - New Wins Form Submission website#5975