ELI5: empty states and hero images
// explanation
What is an empty state?
An empty state is what you see on a screen when there's nothing to show yet, like when you open a new app and haven't added anything to it [1][3]. It's like opening an empty notebook before you start writing.
Why do designers use hero images?
Designers put big, pretty pictures (called hero images) in empty states to make them look interesting and explain what the app does [1][3]. Instead of just showing a blank screen, they show you an illustration that helps you understand how to use it.
What should an empty state show?
A good empty state should have a nice image, helpful text explaining what the screen is for, and a button telling you what to do next [1][3]. It's like a welcome sign that shows you around.
Why does it matter?
Empty states help new users understand what to do and make apps feel friendly instead of broken [1][3]. A boring blank screen makes people think something is wrong, but a well-designed empty state makes them excited to start using the app.
// sources
Jan 28, 2025 ... Step 3: Creating the UI Design. As per my findings and using the consistent UI patterns. I structured the whole empty state with: A Hero imageย ...
Designed for Notion users and UI designers. Available in Illustrator, SVG, and PNG formats. Sharpie Empty State Icons pack hero image. Sharpie Empty State Iconsย ...
Jun 29, 2022 ... Hero; Image gallery. Empty states are designed to convey the purpose, structure, and layout options of web parts before the web part isย ...
Explore thousands of high-quality empty state cta images on Dribbble. Your ... Binauro Hero CTA Section brand branding call to action crisp cta dark ui flat glowย ...
Mar 7, 2023 ... We have an open issue in Storyline 360 where the state change keeps the Normal state's text or image in Preview and Publish.
Video by Bella's Comic Chronicles

Video by IdkSterling

Video by OP Origins
