Loading...
Home / Projects / Muthlath
UI Design

Muthlath

Muthlath sells wall art, and the biggest risk to a store like that is trying too hard. Every screen was built around one rule: nothing on the page should compete with the piece the shopper came to look at — a restrained palette, a grid with real breathing room, and interface chrome that recedes instead of announcing itself.

The product page carries the weight most wall-art stores skip: room size, frame options and material sit next to the image instead of buried in a tab, because a shopper picturing a piece on their own wall needs that information without leaving the image behind. The rest of the store — grid, filters, cart — was drawn to the same quiet standard, so the art stays the reason to keep scrolling.

View on Behance
Muthlath wall art, canvas print and framing store interface designed by Aya Elfeky
Muthlath — the product page keeps room size and framing right beside the art itself.
Outcome

What the design delivers

The decisions that carry this project.

The art leads

The interface stays quiet so the work is the hero.

Frame, don’t compete

Neutral chrome lets colour and composition carry the page.

Browse like a gallery

Shopping feels closer to viewing than to a checkout funnel.

What you get

A store the art doesn't fight

Three pieces that keep the art as the reason to look, and the interface as the thing you don't notice.

A grid built for looking

Large canvas thumbnails, generous white space and a muted palette, so the browsing screen reads like a gallery wall rather than a catalogue page.

A product page that answers “would it fit”

Size, frame option and material sit next to the image itself, not behind a tab, because that's the question a shopper is actually asking.

A component library that stays quiet

Buttons, filters and labels were drawn to recede — consistent across every screen, so nothing ever competes with the piece on screen.

How it runs

Four stages built around restraint

Every decision was tested against one question: does this help the art, or compete with it.

Discovery

I look at the catalogue itself — sizes, materials, frame options — and at where a quiet interface can go wrong: too little contrast to browse by, too much and the art disappears.

Wireframing

Layout comes before colour. The grid, the product page and the cart are structured empty, so the hierarchy holds before a single piece of art is dropped in.

Visual Design

The palette and chrome are drawn last and judged with real art on screen — anything that pulls the eye away from the piece gets pulled back.

Handover

Screens, states and the component library are delivered together, so whoever builds the storefront can keep it as quiet as it was designed.

At a glance

Project details

Discipline
UI Design
Scope
Screen design across desktop and mobile, with real content
Deliverables
Full screen set, every interactive state drawn, component library
Tools used
Figma · Adobe XD

Selling something that has to be looked at closely? See the UI/UX Design service.

Questions

Before you scope a store like this

Why put room size and framing next to the image instead of behind a tab?
Because a shopper picturing a piece on their own wall needs that information without losing sight of the piece. Burying it in a tab breaks the moment they're actually deciding in.
What do I actually receive from a UI design project like this?
The full screen set for desktop and mobile with real content, every interactive state drawn rather than assumed, and a component library so the interface stays consistent as the store grows.
Would this quiet-interface approach work for a store that isn't selling art?
Yes, wherever the product itself is the draw — furniture, jewellery, anything a shopper wants to look at closely. The rule stays the same: the interface recedes so the product doesn't have to compete with it.

Like what you see?

Tell me about your store and I’ll show you what it could look like.

HAVE A STORE IN MIND?
Let's talk on WhatsApp!