Yōtei

Insights

How to make your app look good on screen

Crops, punch-ins, cut rhythm, type size, platform safe zones, hands, the first two seconds, what to ask for, and what is still unproven. The production grammar for app demos, not tool-vendor folklore.

Open on the app already moving, never on a logo card. Punch into the single active element so type stays above 36px on a 1080×1920 frame. Cut or scale-change every 3–4 seconds. Hands that point help; hands that only hold a phone do not. Keep text out of platform chrome (roughly top 15% and bottom 20%). Ask for sends or saves, never likes. And ignore a pile of viral numbers that have no primary source.

What should be on screen in the first two seconds?

The app UI already moving, plus your name in the text, your colour on the card, and ideally the name spoken or a short sonic sting. Never a logo card alone. System1 × TikTok × WPP (84,788 users, 887 ads, 8 markets) measured brand recognition at the two-second mark.

Logo in context+191%. Integrated into the scene, not stamped on top. Moving app UI is this form.
Sonic asset+182%. A recurring sound people learn to associate with you.
Fluent character+57%. A recurring persona, if you have one.
Spoken brand name+40%.
Logo alone (card)−33%. Corroborated by VidMob’s 1,678-ad TikTok hook analysis: a visible logo cost −14% on 6-second view-through.

Stack up to four distinctive assets in those two seconds for about 2× brand recognition versus one asset. Past four, attention declines. Google’s app creative guidance says the same thing in plainer language: brand inside the product, not as a watermark.

How tight should the crop be?

Full-frame vertical capture, then punch into the single control the viewer must see. Your app’s native type is below the legibility floor once it is scaled into 9:16. Zoom or overlay the label. Never rely on the whole phone screen being readable.

  1. Type floor

    36px absolute minimum on a 1080×1920 canvas. 60–72px bold for the hook line. White text, 2–4px dark stroke, contrast ≥4.5:1.

  2. Words per card

    5–8 words, never more than two lines. Hold each line ≥1.5 seconds. Reading caps around 15–17 characters per second.

  3. What to delete

    Every loading state, navigation gap and second of typing. If it is not the action, it is not in the cut.

How often should I cut?

Every 3–4 seconds. A punch-in counts as a cut. A new text card counts as a pattern interrupt. Sub-second cutting has no supporting data; ignore that advice.

TikTok for Business creative guidance associates 5+ distinct scenes in a 21–34s video with large conversion lifts versus fewer scenes, and multiple scenes versus one continuous shot with a smaller but real lift. Hold each shot long enough to read. Pattern interrupts keep attention; seizure-pace cutting does not.

Do hands help?

Yes, when they point or tap. No, when they only hold a static phone. A meta-analysis of 662 effect sizes across 83 studies found gesturing lifts retention and transfer, with the attention benefit appearing only for deictic (pointing) gestures. Instructor-presence work prefers hand-only over full body on screen.

Eye-tracking of a picture-in-picture face found about 41% of gaze on the face with no gain in comprehension. If the screen is the message, keep a face off it. Hands earn their place by driving the UI.

Where is the safe area on each platform?

Universal rule of thumb on 1080×1920: clear top 15%, bottom 20%, sides 6%. Platform chrome differs, so the pixel numbers below are the practical targets.

Instagram ReelsTop ~108px, bottom ~320px. Biggest bottom margin: caption, audio line and action rail stack there.
TikTokTop ~130px, bottom ~250px.
YouTube ShortsKeep the hook inside the central 4:5 box.
UniversalTop 15%, bottom 20%, sides 6% clear if you ship one file everywhere.

There is no algorithmic penalty for text under the UI. There is a skip-rate penalty, because the viewer cannot read the hook. Watermarks are a separate, real problem; stated Reels guidance includes not using watermarks or logos as overlays.

Do I need sound and captions?

Burned-in captions always. Sound depends on the platform. Defensible caption lift on retention is about +12% to +25%. Assume sound-off on Meta; TikTok skews sound-on.

The old "85% / 92% watch without sound" figures are mid-2010s Facebook numbers still in circulation; a better recent estimate is around 74%. TikTok reads on-screen text to classify topic, so captions feed distribution as well as comprehension. Audio is a ranking input on both platforms. Trending audio as a reliable reach multiplier has no large-N support in major 2025–26 creative studies. Platform sound libraries are enough.

What should I ask the viewer to do?

Ask for a send or a save. Never ask for likes. Metricool’s Instagram Study 2026 measured asks across 24.4 million posts.

Ask for comments+202.78% comments
Ask for saves+92% saves
Ask a question+36.70% comments
Ask for likes−4.9% likes. The "like and follow" outro costs you likes.
≥1 hashtag (IG)−31.70% views, −33.89% interactions. Hashtags now hurt on Instagram.

Put install CTAs around 70% of the way through, not only on the last frame. In large creative data, top-quartile completion has been associated with worse conversion lift: people who convert often leave early. Reach them before they go. Save-content and share-content want different pacing; do not chase both in one clip.

What is still unproven?

A lot of what circulates as fact. The items below have no solid public A/B or no primary document. Do not let a thread or a tool blog tell you otherwise.

  1. Hands-holding-phone vs flat screen capture

    No public A/B for software. Supporting evidence is indirect (gesture meta-analysis, POV creative data). Cheap to test yourself.

  2. Device mockup frames vs raw full-frame

    Zero performance data either way. The search results are tool-vendor marketing. Apple forbids device frames and hands-on-device footage in App Store previews, so never reuse one asset for ads and store.

  3. Optimal face-bubble size or position

    No study optimises this. Any specific percentage quoted is invented.

  4. "280% conversion lift" for 21–34s TikTok videos

    The length recommendation is official. That lift number traces to no primary document.

  5. Any 2026-dated Mosseri quote

    The verifiable ranking statement is July 2024 on sends per reach. Treat newer attributed quotes as unverified unless you can open the source.

  6. Loops as a distribution hack

    Replays inflate view counts. YouTube has stated view-counting changes do not change how content is promoted. Loop for retention, not as a reach trick.

  7. Per-second drop-off curves

    No platform exposes second-1 / second-2 / second-3 leave rates publicly. A clean "X% leave at second 1" chart is fabricated.

Where do these numbers come from?

Named datasets and papers, not anonymous "industry benchmarks". Re-check platform guidance quarterly; it moves.

  1. Motion, Creative Benchmarks 2026

    550,000+ ads, 6,000+ advertisers, ~$1.3B Meta spend, Sept 2025–Jan 2026. Hit rates by visual style and hook type.

  2. AppsFlyer, State of Creative Optimization

    1.1M creatives, 1,300 apps, $2.4B spend. Tutorials vs testimonials on IPM and day-7 retention.

  3. Metricool, Instagram Study 2026

    24.4M posts. Asks, hashtags, view timing.

  4. System1 × TikTok × WPP

    The Long and the Short (form) of It: 84,788 users, 887 ads, 8 markets. Brand assets in the first two seconds.

  5. VidMob, TikTok Hook Analysis

    1,678 ads, 7.3B impressions. Logo and early branding effects on view-through.

  6. Berger & Milkman; gesture and instructor-presence meta-analyses

    Sharing drivers; pointing vs presence; face on screen and cognitive load.

  7. Platform docs

    Instagram ranking (sends per reach), TikTok for Business creative best practices, Google app campaign creative guidance, Apple App Store preview rules.

Good to know

How do I make my app look good on screen?

Full-frame vertical capture, punch into the active control, type above 36px, cut every 3–4 seconds, app already moving at frame zero, text clear of platform chrome. Hands only when they point or tap.

Should I put my face over the app demo?

No. Greenscreen face-over-UI ranked near the bottom in Motion 2026, and eye-tracking shows gaze stuck on the face without better comprehension. Face before or after the demo if you want it at all.

Do device mockup frames help?

Unknown. No public performance data either way. Do not use them in App Store previews; Apple forbids that framing.

Where are the four video templates?

On the 20-minute build page, as fill-in-the-blank time tables. Real ads that already worked are on the app ad formats page.

This expands the First stretch camp on the climb, which lays out the stages either side of it. Tools by job are on the route index, the free ones are here, and the other answers are in insights. Updated 2 August 2026.