Web to App

OOOH.TV

social media and creator platform

When someone tapped a shared Oooh link without the app installed, they needed an immediate preview on the mobile web before deciding to download. I designed the web profile handoff, dismissible app prompts, and the Android SMS waitlist.

入口

リンクを開いたらまず少し遊んでみたいから、ダウンロードの話はそれからでいい。

Taking creator profiles onto the web

When fans tapped a creator’s bio link, they landed on this mobile web profile. I designed the deep-link handoff into the native app alongside partial-failure states: if a creator’s video feed failed to load, their header and bio stayed visible above an inline retry button instead of blanking the whole page.

Open in the app

A creator’s profile stays behind an app handoff prompt.

Refresh the page

A page error offered a direct way to refresh.

Try the posts again

A post error kept the profile visible and offered a retry.

Profile sharing, app handoff, and recovery states from my Profile Share Web design file. Names and figures are design samples.

Conversion prompts

Rather than blocking shared links behind a hard app-store wall, I designed dismissible conversion prompts that let mobile web visitors preview the Oooh first or tap “not now” to keep browsing.

  • A pink Get the App card on black: the Oooh logo, a close button, “GET THE APP”, a line inviting people to interact with this Oooh in the app, and a yellow Get App button.

    Get the App card

    An inline card with a clear close button and a single Get App action.

  • A pink sheet on black with the Oooh logo, “Oooh is better in the app.”, a yellow Open in App button and “not now” beneath it.

    Open in App sheet

    A bottom sheet pairing Open in App with an explicit “not now” dismissal.

Two prompts from the booklet’s component page.

Android waitlist

Because our Android build was still in development while iOS was live, Android visitors tapping a shared link needed a graceful landing spot. I designed modal, sheet, and full-screen SMS waitlist flows in pink and yellow, complete with inline phone-number validation and read-back confirmation.

  • Android waitlist in pink, full screen: “JOIN WAITLIST”, “Get notified when Oooh is available for Android!”, a phone number field, a yellow Submit button and a close button, above the Oooh footer bar.

    Full screen, pink

  • Android waitlist in yellow, full screen: “JOIN WAITLIST”, “Get notified when Oooh is available for Android!”, a phone number field, a pink Submit button and a close button, above the Oooh footer bar.

    Full screen, yellow

  • Opened: “JOIN WAITLIST” and “Get notified when Oooh is available for Android!”, above a phone number field and Submit.
  • Invalid number: “Phone Number is not valid” appears under the field, and Submit is dimmed.
  • Added: “ADDED TO THE LIST” and “We will text you when Oooh is on Android!”, with the number read back and Close Window.

Two of the six waitlist designs, the full-screen pair. The rules come from the popup’s states.

Web profile states

If a creator changed their handle or a shared link broke, the web view shouldn’t dead-end on a raw browser error. I designed pink and dark not-found states that routed visitors straight into Explore Creators or the native app.

  • Mobile web profile in Safari, not found, on pink: two big eyes, a line saying the page couldn’t find what you were looking for, and an Explore Creators button, with the Oooh footer and Open in App below.

    Pink

  • The same not-found state on a dark background, under the pink header bar: two big eyes, the same line, Explore Creators, and the Oooh footer with Open in App.

    Dark

The web profile’s not-found state, from the mobile web profile board.

ABOUT

Matt wearing snow goggles in the mountains
この映像の大半を撮影してくれたのは、JULIAN MARSHALL。1か月もの間、僕の馬鹿な振る舞いに付き合ってくれた。20年以上の付き合いになる彼を友人と呼べることに、ずっと感謝している。

I’m Matt Stenquist, a Product Design Engineer and former professional snowboarder. I started coding at nine, shipped modded hardware and games by 16, and turned pro by 22. A few broken bones and a gold tooth later, I design and code consumer apps, Figma component systems, and AI developer tools from scratch.

LEARN MORE