YOW.tv Onboarding & Auth

Most of this flow is what goes wrong.

Company

YOW.tv

My Role

Product Design Intern

Tools

Figma

Timeline

May – Jun 2026

Description

YOW.tv is an indie-film streaming platform. I was sent its new splash screen, and found the account system standing behind it.

Context

I was sent a splash screen as a Photoshop file, with permission to blow it up if I hated it. It was not a splash screen but sign-up and sign-in for a product that already had users and a database, and most of the design in it was already settled: by Google, by Apple, by a compliance line nobody had flagged, and by the database. 10 of the 25 screens I specified are error states. It is live on the App Store. The build is the development team’s.

A student designs the ideal flow; a product designer designs the one that can exist

I was the only designer on this: the audit, the type and radius testing, the flow, every screen and every state, the copy, and the handoff. Greg, the branding director, owns the brand it is drawn from and made the final call on the typeface. Contus, the development team at the time, built it. Handoff and everything after it ran on Basecamp, shared with them and with our own team.

Two buttons on a splash screen are an account system


The second day I joined YOW, an email came from Joey, the founder and my boss. In it a PSD and “blow the whole thing up and start from scratch if you hate it.” Opening the file, I saw the poster collage, and two buttons reading CONTINUE AS GUEST and SIGN UP FREE/SIGN IN. Those together are an account system. There is an address to collect, a code to check, and a way to fail each of those. YOW.tv already had every one of those running, with people inside them.

One unretouched phone capture of the founders’ splash screen mounted on a flat slate ground: a film-poster collage behind the words Stream indie. Free., the YOW.tv wordmark with the line Experience the new Indie, and two buttons, an orange Continue as Guest above a yellow Sign Up Free / Sign In. Beneath it, set as a quotation, the line the file arrived with: blow the whole thing up and start from scratch if you hate it.

Nobody had decided what a corner should do


There was a brand book with a typeface defined in it. I opened the app and found the font was not loading anywhere, so I asked whether we should simply build to the brand book. Greg, YOW’s branding director, explained that the license was too expensive. We would use a default instead, with nothing said about which one or how. That left a brand book, no design system, and nothing visual defined for the product other than the primary accents and the dark tone.


My task asked for visual decisions and call-to-action buttons, so I built one grid: five typefaces across, four corner treatments down, the same call to action in every cell. Greg pushed for the small radius. Most of the time I would agree, but here I asked a different question: if everyone has a radius and our whole positioning is being the new one, what does none look like?

A grid of 20 yellow call-to-action buttons, five typefaces across and four corner treatments down. The columns are Encode Sans, Libre Franklin, Archivo, Barlow and Acumin Pro; the rows are regular, four-pixel radius, eight-pixel radius and rounded. Every cell holds the same button reading Log in / Sign up with Continue as Guest beneath it, so the only things that change across the grid are the typeface and the corner.

The corner was tested rather than argued, so the comparison was between pictures, not opinions. We agreed on none, and Greg made the final call on the typeface. The square corner YOW has carried since. It reads with attitude, film rather than software, but it came with a cost: with no radius nor shadow, how do we carry the nuance and refinement that is also film?



Out of the 26, the team picked the closest one


Permission to start from scratch reads like an invitation, so I took it as one. I drew 26 splash layouts by hand: wordmark above the line and below it, the tagline small and the tagline enormous, buttons stacked and buttons reduced to a row of three circular icons, versions that opened with a phone number, and more. Then I put the whole set in front of the team.


They chose the one closest to the design they had sent me. Not a compromise between the options, but the composition that was already theirs. The 25 they passed over are how I learned where this team’s taste sits, and that they decide faster in front of a spread than in front of a question.

Four of the 26 splash layouts side by side, the second outlined in yellow as the one the team chose. The first sets the wordmark mid-screen with a small tagline under it and a single Log in / Sign up button over Continue as Guest. The chosen one puts a small wordmark at the top left over an enormous three-line Stream indie. Free., with Log in / Sign up, Continue with Google and Continue as Guest stacked beneath. The third runs the same enormous tagline but drops the wordmark below it and reduces the buttons to a row of three circular icons over a terms line. The fourth opens on a phone-number field, an OR rule, then Continue with Google, Continue with Email and Continue as Guest. All four sit on the same poster-wall collage.

Every flow I had drawn before this one worked


School asks for the blue-sky version, the idea and the surfaces and the path where nothing goes wrong. This was the first time most of the work was the other thing. People mistype. A code expires. A name is already taken. Somebody who signed up in March comes back in July and must not be greeted as new.

Eight YOW.tv onboarding screens in one row, in two labeled groups. Under Happy path: the splash, carrying a yellow Log In / Sign Up button over Continue with Google and a Continue as Guest link, with no Apple row; the email step with an address typed and a bright yellow Continue; the code step with all six digits filled; and the birthday picker set to Jan 01 2008 under the line You must be 18 or older to use YOW.tv. Under Messy reality: the email step, the code step and a name step, each with its error message set inside the field it belongs to over a red underline — Please enter a valid email address, Incorrect code. Please try again., and That name is already taken. Try another. — and a Leave setup? sheet warning that the account won’t be saved, offering a yellow Stay above a gray Leave. On the email and code error screens the Continue button is dimmed to dark gold; on the name error screen it is still full bright yellow.

The Outcome: 10 of 25 Frames for Going Wrong


What I handed over is 25 frames of a sign-up flow, 10 of them error states, and a document telling a developer when each one appears and when it goes away again.

Four YOW.tv onboarding screens in sequence, each labeled above. The splash: Log in / Sign up over Continue with Google, Continue with Apple and a Continue as Guest link, on a poster collage reading Stream indie. Free. The email field: What’s your email, an address typed, a helper line reading We’ll send you a one-time code, and a yellow Continue button. The six code boxes: Enter your code with all six filled, the line We sent a 6-digit code, and Didn’t get it? Resend code in 60s. The birthday picker: What’s your birthday over the line You must be 18 or older to use YOW.tv, a three-column scroll picker set to Jan 01 2008, and a Get Started button.

Error States: Failing Without Moving the Screen


An address that is not an address, an OTP that is wrong, a name already taken, so many things can go wrong. The decision underneath all is that the message occupies the field it belongs to rather than appearing beneath it. The primary button dims rather than disappearing, and only while the fault is the user’s and nothing has been retyped. When the failure is on our side, a code that could not be sent, it stays live. The shape of the screen is the same whether you are succeeding or not.

The same block of the YOW.tv code screen in six states, cut at one identical window and labeled above each: Empty, Returning, Filled, Verifying, Accepted, Wrong code. Empty shows six blank boxes under Enter your code. Returning replaces the heading with Welcome back. Filled shows the digits one to six. Verifying replaces the boxes with a single field reading verifying. Accepted replaces them with a check mark. Wrong code replaces them with Incorrect code. Please try again. The heading, the sent-to line and the resend line hold the same position in all six.

Date of Birth: A Legal Floor Under a Zero-Friction Flow


Nothing in the brief mentioned age. I found it auditing YOW’s own web sign-up: a small note, shown only when you try it with an email, saying you must be over 18. I asked whether it was real. It was. So age verification needed to be added to the flow, and the design left was making the third step cost what the first two did. It is a scroll picker rather than a calendar: a date of birth is a defined value, so the control is bounded too.

Two rejected options on the left as gray outline wireframes, each with a short reason beside it, and the shipped screen on the right in full color. The upper wireframe, labeled A typed date can be anything: a phone outline holding three input boxes marked MM, DD and YYYY over a numeric keypad. The lower, labeled A calendar is decades of paging: the same outline holding a month calendar card, chevrons either side of the month name, weekday initials, and a grid of days 1 to 31 with the twelfth ringed. On the right, the shipped birthday screen: What’s your birthday over the line You must be 18 or older to use YOW.tv, a three-column scroll picker set to Jan 01 2008 with the selected row underlined in yellow, the terms line, and a yellow Get Started button.

The Handoff: Specifying When a Thing Appears and When It Goes


It was the first handoff I had written. It specifies six components carrying 17 states, and the part I would not have thought of without the failure frames: when each state arrives and goes. A screen file says what a thing looks like, not that resend is dead for 60 seconds. Google and Apple supply their own artwork, so the two platforms are specified separately. I walked the team through it, and the page is marked frozen.

Four panels labeled above: iOS, Android, Safe area and margin, Components. The iOS splash carries a yellow Log in / Sign up button over Continue with Google and Continue with Apple, then a Continue as Guest link. The Android splash is the same screen with the Apple row absent and the stack still anchored to the foot. The third overlays that splash with bands reading Safe Area 60pt at the top, Safe Area 48pt at the bottom and Margin 37pt down both sides. The fourth stacks six component sets, each inside its own dashed boundary: an input field in six states, the primary button in three, Continue with Apple in two, Continue as Guest in two, the resend line in two, and the close control in two.

Impact


The flow is live on the App Store, built from the handoff by Contus. The one thing I can say about that specification with any confidence is that it was complete enough to be built from, which is a low bar and the only one a first handoff should be judged against.

I argued the name field away, and drew it anyway


I proposed the flow without a name field, since every field is a place to lose somebody and a name authenticates nobody. The development team came back: the existing database required it. My reasoning was about a flow. The answer came from a table. So I asked Jack what name meant here. Username? Display name? Profile name? Nobody knew, and that question opened an account and identity architecture that is still being worked on today.

Credit


Founder and my boss — Joey and Brian, who sent the brief, and the permission to start over

Branding — Greg, the brand the flow is drawn from, and the final call on the typeface

Manager — Jack, the name conversation

Development — Contus, who built the flow from the handoff