Figma Success Icon Update

[mark-tate]

Update all components that use status to use the updated Success icon.

[origami-z]

What's migration path for this? What's the scope?

• Replace icon & status indicator component?
• Add a new icon with a new name? point status indicator to them?

[mark-tate]

Frappe Goal: plan for migration by EOS, will be implemented in Galao

[mark-tate]

Meeting on Tue

[origami-z]

Meeting summary

1. Create 4 new icons, (SuccessCircleIcon,SuccessCircleSolidIcon,CheckmarkIcon, CheckmarkSolidIcon)
2. Deprecate 6 icons, (Success, SuccessSolid, SuccessTick, StepSuccessSolid, SuccessSmall, SuccessSmallSolid)
3. Add to library and publish (Figma only)
4. (Figma) manually update (10) components referencing status indicator
5. update patterns in Figma
6. update error, error-solid, warning warning-solid, info, info-solid
7. add/update help circle icon

In code

• Add new icons
• Deprecate icons
• Replace / repoint Success icon in StatusIndicator, all components using them will get it. (not breaking change similar to Support status color for FormFieldHelperText #3540)
• Replace icons in Checkbox / Switch (no longer need to switch between HD and rest)

anything missing?

[dplsek]

@bhoppers2008 @pseys @origami-z

just to confirm, #7 above was just a 'while we're at it thought' because it will also be updated with a circle, but success icon update has no dependency on it. we just thought we could do it together and write a single blog explaining the rationale for all of this.

Steps 1-3 are what we're aiming for at the end of this sprint and would complete this ticket... we can create new tickets for the rest

Working file from meeting here

[origami-z]

Frappe Goal: plan for migration by EOS, will be implemented in Galao

Unless we have extra capacity, the work is scheduled in next sprint.

add/update help circle icon

I don't know what it is. If this is a small change we can tackle together, let's create an issue scheduled together?

[joshwooding]

add/update help circle icon

@dplsek This was originally in #3646

[dplsek]

Yeah, it looks like both the success icon update (this ticket) and the help icon update are included in that master icon list of improvements in ticket #3646. but i think we keep this ticket for the success icon update and we can address the help icon as part of the other ticket. @pseys will have to weigh in on when to make those other changes.

[pseys]

I'm happy to keep 'Help' in the other ticket and address that as part of a wider set of changes. My suggestion to do it now was that it's a relative of status and if we're creating a 'circle' icon for Success we could add a circular icon for Help too. It means we're not dramatically changing the existing icon but can provide a better alternative.

If we've earmarked the development work for these icon updates for next sprint I'll have to make the status icon changes by EOW.

[origami-z]

Dev effort for this is probably Small, so you may have additional week next sprint

[pseys]

The following tasks have been completed within a branch of the icon library.

• Create 4 new icons, (SuccessCircleIcon,SuccessCircleSolidIcon,CheckmarkIcon, CheckmarkSolidIcon)
• update error, error-solid, warning warning-solid, info, info-solid
• Deprecate 6 icons, (Success, SuccessSolid, SuccessTick, StepSuccessSolid, SuccessSmall, SuccessSmallSolid)

SuccessTickIcon has not been marked as deprecated in Figma as it's only available in code due to it being a duplicate icon.

Need to review the changes with @dplsek before merging

[mark-tate]

Galao Goal: add deprecation labels in Figma and publish for Galao Figma release
New Icons added by EOS

[mark-tate]

@pseys Galao question... deprecation labels are they done ?

[pseys]

@pseys Galao question... deprecation labels are they done ?

No, I'm still chasing Ben for confirmation of deprecation labels. He's OOO now so it'll have to wait until Monday. It shouldn't hold up development though as we can export the updated icons from the branch.

[mark-tate]

@bhoppers2008 ping

[pseys]

I've agreed an approach with @bhoppers2008 and have updated the Figma icon library accordingly. The following has been changed:

• The name of icons to be deprecated have a deprecation notice added
• The description of a deprecated icon is updated to provide more details
• Instances of an icon have been changed to include the deprecation notice
• An 'Updates' page has been added to Figma to highlight the icons that have changed as part of the release

I'm merging and publishing the library now.

[pseys]

• success-circle and checkmark icons have been added.
• error, warning, and info have been updated
• success and step-success have been marked for deprecation

Outline and solid variants of the following will need to be added/updated to code

• success-circle
• checkmark
• error
• warning
• info

The Figma icon library has been merged and published.

[origami-z]

Dev effort for this is probably Small, so you may have additional week next sprint

Adjusted end sprint to Latte for dev effort

[mark-tate]

Latte Goal: review during sprint, whether we have dev capacity, may bump to Lungo

[dplsek]

@pseys has been released in the Figma icon set.

@origami-z will need to add icon in code.

Needs to be updated in the affected components in both Figma and code as part of a new ticket which @pseys @origami-z can drive