An empty screen is still part of the product. It might be the first thing a new account sees, or the result of a search that was too specific. The interface should explain which situation has occurred.
Distinguish empty, loading, and failed
These states need different messages:
- No content yet: the workspace has not received its first record.
- No matching results: content exists, but the current search or filter did not find it.
- Loading: the application is still waiting for a result.
- Unavailable: the request failed and may need another attempt.
Showing “No products” after a failed request gives the wrong explanation. Keep the state connected to what the application actually knows.
Offer a relevant next step
For a new project workspace, the next step might be “Create a project.” For a public product search, “Clear filters” may be more useful.
Make the action concrete. A generic “Continue” button asks the visitor to guess where it leads.
Preserve context
If someone searched for “scheduling” in a specific category, keep those selections visible. Explain that there were no matches for the current filters, rather than implying the entire catalog is empty.
If clearing a filter changes the results, make the new state visible. Do not silently replace the search term with a different query.
Keep the visual weight proportionate
An illustration can add warmth to an empty workspace, but a search page often needs only a heading, a sentence, and a useful action.
Choose a tone appropriate to the task. A playful message might suit a creative tool; it may feel out of place when someone is trying to recover an important record.
Review the edge cases
Try a search with no matches, a category with no published entries, and a page number that no longer has results. Confirm that the page still offers a path back to useful content.
An empty state works well when the person understands what happened and can take the next step without asking for an explanation.
