So I think with screenshots we want consistency in treatment.
The size of the screenshots should be limited with: width: 100%/960px always + height: 480px or less
.
I think the browser wrap is a visual distraction(?) for the purpose of the user documentation but the screenshots do need separated from the background. Edit each screenshot via Screely with: window: no window + background: #DADADA + padding: 10px 10px
.
Quality of the screenshots are also important. For areas where it is cropped in try zooming in via your browser so the screenshot has a larger size and therefore quality.
With the above size limits, annotating screenshots could be very valuable. I would use preview: markup
via Mac with: shape: rounded square + fill: none + outline: #02FFAD + outline width: 2nd largest
.
Happy to alter anything above if in practice it isn’t working! Possibly worth trialing with one and then grab another review before committing to changing all screenshots.
I've also just become aware of Scribe which may be a useful to to help build the documentation content?
Examples:
![Screenshot 2022-05-03 at 16 25 07](https://user-images.githubusercontent.com/83074763/166484154-8ef10ae6-9a88-45c5-aa82-ba21ac9d0b42.png)
![Screenshot 2022-05-03 at 16 26 24](https://user-images.githubusercontent.com/83074763/166484373-a459e59f-4554-4670-9906-caceb58b64ee.png)
Originally posted by @joshuajames-smith in #38 (review)