Flow media experience on a television in a dark interior
Flow / Product & interface design

A familiar feeling.
On every screen.

A personal media app for bringing your own sources together on iPhone and TV.

ProjectFlow
FocusProduct & interface design
PlatformsTV · iPhone · Car concept
DesignerSalah Aljabarti
YOUR WORLD, IN FLOW

Find something to watch.
Make it your own.

Discover on TV. Build your collection on iPhone. A shared visual language makes each screen feel like Flow.

01 / TELEVISION

Start with something
worth watching.

Featured content creates a starting point. The rail stays in place while shelves make room to explore.

01 / HOME

A featured title offers a starting point; the navigation rail and shelves keep exploration within reach.

01

Know where you are.

The rail makes the current section visible.

02

See what comes next.

A prominent action sits beside the title context.

03

Keep browsing simple.

Collections create a readable rhythm across the screen.

02 / IPHONE

Your world.
Within reach.

A personal place for the content you bring. Start on Home, add a source, and keep your collection within reach.

Your collection
Your starting point
Your sources

Home, Library and Add a Source · Current iPhone build

MOBILE / IN MOTION

A closer look.
One step at a time.

Explore Home, add a source, and move through your personal library.

Recorded in the Flow mobile simulator.
Flow CarPlay concept mockup showing a phone and an in-car display
CarPlay exploration · Concept mockup · Not yet tested
03 / CARPLAY EXPLORATION

Make the
destination explicit.

An output choice is a commitment. The interface should make it clear where content is going—and whether that connection is ready.

Choose the displayConfirm connectionUnderstand the status
Planned experience. CarPlay testing has not started.
Actual app capture / output selection
THE VISUAL LANGUAGE

Quiet by design.
Recognizable in motion.

A flowing mirror-chrome sculpture with silver and cool blue reflections
THE SHARED LANGUAGE

A shared language,
down to the controls.

SYSTEM SANS SERIF
Aa

Content gets the spotlight.

Large titles establish hierarchy. Restrained supporting copy and familiar native type styles keep the interface calm.

RegularMediumSemibold
A RESTRAINED PALETTE
Slate#536B7A

Ambient depth

Ink#0B0C0E

Content canvas

Light#EFEFEF

Focus & action

Signal#FF453A

Live status

Home
Library
Search
Profile
Live TV
Car
Cast
Add source
Play
Pause
Favorite
Expand
BROWSE & CHOOSE

Content and its next action, together.

01 / TITLE & ACTION

The title leads.
The action follows.

ON DEMAND · TEARS OF STEELTears of Steel
▶ Watch now

The TV hero brings the content title and the Watch now action into one readable group.

02 / LIVE COLLECTION

A channel, with context.

24 LIVEAROUND THE CLOCK
24 HorasNews · Madrid
abcNEWS LIVESTAY INFORMED
ABC News LiveNews · New York

Live status, channel name and location stay together as the collection grows.

03 / PLAYBACK

Find your place.

Play, pause and move through the timeline.

0:00Preview
BUILD YOUR LIBRARY

A clear beginning. A familiar way back.

04 / EMPTY LIBRARY

A first step worth taking.

Flow empty library component with Add a Source action

A dedicated empty state explains the personal-source model and provides a clear way to begin.

05 / SOURCE SETUP

Make it yours.

Add a Source

Bring your own content to FLOW.

M3U playlistMedia link
Name
Add Source
↳   Import M3U or media from Files

A playlist, a media link or a local file—the setup keeps each entry point clear.

Recreated interface components alongside the captured iPhone empty-library state.

Flow TV home screenFlow TV movies screenFlow TV live screenFlow TV detail screenFlow TV saved screenFlow TV settings screenFlow TV live screenFlow TV home screenFlow TV movies screen
IN DEVELOPMENT

Still in flow.

Flow is being tested on iPhone and TV. The next chapter is refining those experiences and exploring CarPlay.

01 / IPHONE

Refine the everyday.

Source setup, personal collections and playback.

02 / TV

Keep it effortless.

Remote navigation, browsing and focus.

03 / CARPLAY

Explore the next screen.

Concept stage. CarPlay testing has not started.