Design System Updates: Request Type Icons

[annaseulgi]

Overview

We need to update 311 request types to be icons due to accessibility concerns with colors. As we transition the map to have a lighter gray monochromatic background, including icons for each request type could be worth exploring to also aid with improving accessibility.

Action Items

• [x] Discuss with design team what their thoughts are of this
• [x] Reference 311-SF website & Google for icon ideas
• [x] Assign designers to ticket
• [x] Designers can assign request types to icons (material design system will be a good resource)
• [x] Feedback/Iterations
• [x] Approval: Icon Set
• [x] Mockup a high fidelity screen including the search/filters + map to include the new icon set and to show populated data (as icons) on the map during user search
• [ ] Rounds of feedback
• [ ] Approval: Mockup

[annaseulgi]

Please reference MUI if you need additional resources for icons

[ryanfchase]

@pogwon @annaseulgi is this still being worked on? We will move this to In Progress if so

[pogwon]

@pogwon @annaseulgi is this still being worked on? We will move this to In Progress if so

Yes, I'm currently working on it.

[pogwon]

Revised and updated icons have been added to Updated Design System page.

[ryanfchase]

@pogwon if this is ready for review, please do the following:

• [ ] Move ticket status to In Review
• [ ] Add ready for design lead
• [ ] Unassign

Let's also check all the boxes in the original post so its easier to track progress, thanks!

[annaseulgi]

Reviewed and moving this to Done(Without Merge) since this is not a priority item at the moment (but should be reviewed in the future).

Future tasks for this: design mockup using icon set rather than colors to indicate request types

[annaseulgi]

moving this to Icebox for easier visibility

[annaseulgi]

@pogwon hey I know you just finished a pretty big ticket for the -/+ functionality. i also know you put together this icon set :). let me know if you want to take this ticket in August (or whenever we have capacity)

[pogwon]

I was unaware of the high-fidelity wireframe deliverables, so I re-assigned myself to this issue and will be working on it. Will focus on how they will look close-up as well as from a zoomed out perspective when there are several icons clustered together.

We also discussed potentially including icons in the service request modals so they match with the map, so I will be brainstorming potential solutions as well.