Content guidance - discovery for the best solution

[RobTobias123]

Outcome

To understand the best approach to creating an interactive Content Guidance section for the docs components pages. This should include a solution that can be included in time for the initial launch.

Scope

• [x] Take a look at the concepts shaped so far in Figma exploratory work
• [x] Further refine the design for an MVP for the initial launch end of Feb. This is likely to be the simplest, quickest way to achieve a more helpful interaction than currently available.
• [ ] Consider how other options could work
• [ ] Assess the pros and cons of each and decide on a direction as a team.
• [ ] Apply once all content is populated.

[RobTobias123]

Idea for the initial launch version is...

• Use existing content guidance 'pink labelled' images. (Only updating where this is necessary due to component updates)
• Find out the deepest letter used across all.
• Create a set of SVGs that reflect the pink label style and upload assets to a suitable location.
• Replace the Key letter in 1st column of the explanatory table with the appropriate SVG asset and wrap the Section anchor link around it so that when clicked it will navigate on the page to the labelled image for reference.

[RobTobias123]

The basic version using style coordinated key letters implemented for initial release. The more interactive versions discovered will be refined and applied in subsequent iterations of docs.