Skip to content

Mobile UI

AI mobile wireframe from a prompt

A Sketvio Mobile UI is two phones on the board, each 390×844. A form screen — login or signup — has fields and a home indicator, no tab bar. A list or stats screen has composed tab icons and captions. The model writes the words. The phones are compiled.

Written from the Sketvio compilers at Rajosa Tech. Reviewed 20 September 2026.

When to use Mobile UI

Use Mobile UI when the idea is an app someone holds. Auth plus home. Home plus stats. You want the chrome of a phone, not a desktop table and not a flowchart of the same flow.

Skip Mobile UI if the meeting is about desktop density (Web UI) or about steps without screens (Flowchart). A phone will not become a diamond.

How generate actually works

Name two screens and their kinds. The model fills greetings, fields, rows, and tab captions. The compiler draws two 390×844 phones and decides whether a tab bar exists from the kind, not from the prompt’s wish list.

Form screens drop a Name field on login and never get tabs. List screens get a FAB on the first phone. Stats screens get seven bars. Those defaults came from reviews where login looked like a signed-in shell.

Tab icons are composed shapes so they stay readable at wireframe size. They are not a shipped icon font. You can delete one and draw your own after generate.

What lands on the board

Two screens, one product

The spec is exactly two frames. kind is list, form, or stats. List gets a greeting, a date, a hero streak, four rows with progress, tabs, and a FAB on the first phone. Stats gets seven bars, two metrics, and three insight cards.

Login has no tabs

A form screen is Email and Password only. Name was stripped because a sign-in is not a profile. Tabs sit on home and stats. Putting a tab bar on login made every first-visit look already signed in.

Icons that are shapes, not mystery glyphs

Home is a diamond plus a base. Stats is three bars. Profile is a head and shoulders. Each tab has a caption. We stopped using a single unreadable mark after reviews kept asking “what is the middle icon?”

HabitFlow login and home

Paste this on a board after you pick Mobile UI.

Mobile UI for HabitFlow. Screen 1: login with email and password. Screen 2: home for Maya with today’s habits, a 12-day streak, and tabs Home, Stats, Profile.
  • Left phone: form, Email + Password, Sign in, no tab bar
  • Right phone: list, greeting, streak hero, four habit rows
  • Bottom tabs with Home / Stats / Profile captions
  • FAB on home only

After the draft

  • Swap the greeting if the member is not Maya.
  • Do not add a third phone in the same generate — draw it or prompt again.
  • A form never inherits the tab bar. If you see tabs on login, regenerate.
  • These are wireframes on a canvas, not an .apk.

Mistakes that waste a generate

  • Do not ask for a tab bar on login. The compiler will strip it.
  • Do not name five screens. You get two phones. Generate again for stats.
  • Do not expect production React Native. You are agreeing the chrome, then you build elsewhere.

Related tools

Questions about Mobile UI

Why two phones, not five?

Five frames arrived sparse. Two complete screens teach the product. Add a stats phone with a second generate if you need the week view.

Can login include a Name field?

The compiler drops Name on sign-in. Signup can be a form, but the default login is Email and Password. Draw Name if your real app asks for it.

Will this become production React Native?

No. You get Excalidraw elements on an infinite canvas. Use them to agree the screens, then build the app in your stack.

Open a board and try Mobile UI.

Three starter boards. No card. The draft is editable the moment it lands.

Start free