Pattern 24 · Complete

Product
States

Composes consistent empty, loading, error, and success experiences around clear context and useful next actions.

First-use empty

Explain the starting point

Name the missing object and offer the action that creates the first useful result.

No projects yet

Create your first project to organize files, invite collaborators, and publish work.

Learn about projects

Empty results

Preserve the active search context

Repeat the query or filter that produced no results and make resetting it immediate.

No results for “navigation”

Try another term or clear the active status filters.

Loading

Match feedback to what is known

Skeleton preserves predictable layout. Spinner communicates an operation when the final structure is unknown.

Publishing project

This usually takes a few seconds.

Error

Preserve context and offer recovery

The region names what failed and gives one direct retry without exposing internal implementation details.

Projects could not load

Check your connection and try again. Your current filters have been preserved.

Reference NDS-1042

Success

Confirm completion when it is unclear

An inline Success State works inside the region that initiated a multi-step or asynchronous result.

Project published

The latest version is now visible to everyone with access.

Usage guidance

Name the object, state, and next action.

State patterns should reduce uncertainty and keep the current task recoverable. Avoid decorative illustrations that delay the useful message.

Next pattern: Search and Filter