Super nice and relevant article. I like the idea of an example image in content blocks. But how do you avoid cluttering the ux? I wonder, could you show an image of how you would render the backoffice with example images ? I guess for content blocks I would add a tab with IE "example" but this ofc also "hides" the example behind a click - albiet a less intrusive click

I see your point, images can most certainly clutter the UI. I considered adding some example images in the blog, but I decided against it because I only have Dutch examples at the moment. Here's what it would look like:

ah super cool ! yeah i think not using inline editing as in your example helps avoid the cluttering 🙂 You are using a package to render an image in the document right ? and if so, which do you use ?

I'm using uEditorNotes

awesome. I'll keep that in mind 😍

Great article, and from experience wording field names and descriptions from an end users point of view is something many developers don't pay close attention to. One thing I would suggest adding is something about image sizes so clients know what size to create before uploading. I know certain areas we can use crops to adapt a photo style image which in most cases is adequate, but for more abstract images where sometimes we may not use crops a client needs to be given that explicit info there & then. It's self documenting too so you don't have to add it to any training manuals before handover.

Thanks! Great suggestion as well. We do actually have a similar rule that an image should always have a size indication (aspect ratio / width / height / all of the above), but the rule that we use is still in dispute, so I figured I best leave it out for now. But yeah, definitely tell your users how large their images should be 💪