UI Component Documentation
I was the lead content designer responsible for creating the documentation for multiple UI components. My work included researching best practices for the components, creating components and their properties in Figma, and writing documentation. The documentation was used by UX designers, content designers, and engineers.
Examples of Documentation
Anatomy
Rating
Average rating
Total ratings
Usage
For individual reviews in the reviews section of the PDP, only display the rating element. Don’t include the average rating or total ratings.
Content guidelines
Even if the value is zero, the rating component should always include the total ratings property. The only exception is when the component is shown in individual reviews.
If an item hasn’t yet been rated by customers, don’t include the average rating property.
In the number of ratings an item has received exceeds 999, the following format is used for the total rating: #.#K. In this use case, the K will automatically appear.
Dos and Don’ts
Do always display 5 stars with each rating.
Don’t change the number of stars displayed.