Skip to main content

The Clearer Design Language

The Constitution defines why Clearer exists.

The Product Principles define how Clearer behaves.

The Design Language defines how Clearer should feel.

Good design is not decoration.

It is the quiet removal of unnecessary friction.

Every screen, interaction and animation should leave people feeling calmer, more confident and more in control than they did before.

If a design choice makes the product feel more complicated, it isn't finished.

1. The Feeling​

Every interaction with Clearer should leave people feeling:

  • Calm.
  • Confident.
  • In control.
  • Unhurried.
  • Lighter than before.

We are not designing an application.

We are designing a feeling.

That feeling should remain consistent across every screen and every feature.

People may forget individual interactions but they will remember how the product made them feel.

2. Visual Principles​

Our visual design should communicate clarity before personality.

We achieve this by following a small number of principles.

Simplicity creates confidence.​

Remove unnecessary elements before adding new ones.

Whitespace is a feature.​

Space gives content room to breathe.

Crowded interfaces create cognitive load.

One primary action.​

Every screen should make the next step obvious.

Quiet interfaces.​

The interface should support the task, not compete for attention.

Gentle hierarchy.​

Visual emphasis should guide people naturally without demanding attention.

3. Colour​

Colour should communicate.

Not decorate.

Every colour should have a purpose.

We use colour sparingly so that it retains meaning.

Colour should help people:

  • Understand.
  • Navigate.
  • Feel reassured.
  • Recognise progress.

Colour should never create unnecessary urgency or distraction.

When in doubt, use less colour.

Colour should support clarity - not compete with it.

4. Typography​

Typography is our primary interface.

It should feel calm, approachable and effortless to read.

Readable always beats beautiful.

Hierarchy should be obvious without becoming loud.

We favour:

  • Clear structure.
  • Comfortable reading.
  • Short paragraphs.
  • Meaningful emphasis.

Typography should never make people work harder to understand information.

5. Whitespace​

Whitespace is not empty space.

It is breathing space.

It gives content room to exist without competing for attention.

Every element on the screen should earn its place.

If a screen feels crowded, remove something before reducing the spacing.

Whitespace is one of the simplest ways to reduce cognitive load.

People should never feel overwhelmed by what they see.

6. Motion​

Motion should reassure.

Not entertain.

Animation exists to help people understand what is happening.

Good motion:

  • Acknowledges an action.
  • Explains a transition.
  • Reinforces hierarchy.
  • Creates continuity.

Motion should never:

  • Distract.
  • Delay.
  • Show off.

If removing an animation improves the experience, remove it.

7. Components​

Every component should behave consistently.

People should never have to relearn how to use Clearer.

Buttons should behave like buttons.

Cards should behave like cards.

Interactions should feel familiar regardless of what someone is organising.

Consistency reduces thinking.

Predictability builds confidence.

Every component should contribute to clarity.

Never complexity.

8. Feedback & Progress​

People should always know what just happened.

Good feedback creates confidence.

Whether someone archives an email, reviews a photo or completes a session, the product should acknowledge progress clearly and calmly.

Celebrate meaningful progress.

Never overwhelm people with unnecessary celebration.

Feedback should reassure.

Not distract.

Progress should feel encouraging rather than competitive.

9. Empty States​

An empty state is never an absence of content.

It is an opportunity to create reassurance.

When someone reaches an empty inbox, finishes reviewing their photos or completes a task, the interface should acknowledge the moment quietly.

Empty states should feel rewarding without being celebratory.

They should reinforce progress rather than encourage further activity.

Good empty states create a sense of completion.

Not another task to begin.

Examples​

Instead of:

"No emails."

We might say:

"Your inbox is clear."

"Enjoy the quiet."

10. Accessibility​

Clear design is accessible design.

Accessibility is not a feature.

It is a responsibility.

Every interaction should be usable by as many people as possible, regardless of ability or circumstance.

We design for:

  • Readability.
  • Keyboard navigation.
  • Screen readers.
  • Sufficient colour contrast.
  • Reduced motion preferences.
  • Clear language.

Accessibility should be considered from the beginning.

Never added at the end.

11. Consistency​

Consistency builds confidence.

People should not have to think about how Clearer works.

Interactions should feel familiar wherever they appear.

The same action should behave the same way.

The same language should describe the same concepts.

The same visual patterns should appear throughout the product.

Consistency reduces uncertainty.

And reducing uncertainty is one of the ways we reduce cognitive load.

12. Closing Thoughts​

Great design is often invisible.

It quietly removes friction.

It reduces hesitation.

It helps people make confident decisions without demanding attention.

That is the standard we hold ourselves to.

Every screen. Every interaction. Every detail.

When faced with a difficult design decision, we return to one question:

Does this make life feel clearer?

If the answer is no, we continue refining.

Design is never about adding more.

It is about revealing what matters.

Calm by design.

Clear by intention.