Skip to content
Guide6 min read

Bubble Portfolio Demo Video

Show the Bubble app running instead of asking a reviewer to imagine it.

Turn a live Bubble build into a portfolio entry that shows the app running, not a screenshot, for a client or hiring reviewer.

See how it worksYour first 60 seconds of video are free, with a watermark. Verify your email to download it.

A Bubble portfolio entry has one job: convince someone who did not build the app that the person who did knows what they are doing. A static image of the editor's Design tab cannot do that. It shows layout, not behavior, and Bubble work is mostly behavior. The workflow that fires when a button is pressed, the privacy rule that decides which rows of data a logged in user can see, the responsive engine that reorders elements when the browser narrows: none of that survives a screenshot. A short video of the app actually running closes that gap for a reviewer who has thirty seconds and no intention of clicking through a preview link themselves.

GogoScreen takes a web app URL and one line describing what to show, then returns a narrated, edited MP4 roughly two minutes later. For an app gated behind a login it can use a supplied demo account. The editing is mechanical rather than creative: zooms on clicks, cursor smoothing, dead air removed, captions burned in. That is enough to turn one working flow into something a reviewer watches instead of something they are asked to trust.

What should a Bubble portfolio demo actually show?

Pick the one flow in the app that a hiring client or an agency lead would ask about first. For a marketplace build that is usually a listing being created and then appearing in a search result. For an internal tool it is usually a record being entered and a downstream view updating because a workflow ran. Resist the urge to walk every page the app has. A reviewer deciding whether to hire someone does not need a full tour, they need proof that one real piece of logic works end to end.

Most Bubble apps built for a portfolio sit on the default bubbleapps.io subdomain rather than a purchased domain, and that is fine to show as is. What matters is whether the URL points at the live version or a version-test build still being reviewed internally. Say which one it is in the surrounding page copy so nobody assumes a work in progress is the finished product.

Portfolio decisionWhat it signals to the reviewerWhat to avoid
Live version shownThe build is finished and stands behind itPresenting version-test as if it shipped
One flow, start to resultA specific skill was proven, not just a layoutA tour of every page with no completed action
Demo data prepared in advanceThe reviewer sees a believable app, not an empty tableReal client data or a blank data type

How do you handle a login screen in the flow?

A meaningful number of Bubble builds worth showing in a portfolio are gated by the app's built in User data type, because the interesting behavior, the personalized view or the record tied to an account, only appears once someone is signed in. Supply a demo account rather than skipping the flow or narrating around it. A supplied credential is encrypted, used for a single render, then deleted. When a storyboard is planned first, the credentials are kept encrypted for that session and deleted at most two hours after their last use. That is the actual handling, described plainly rather than understated.

If a real screen sits behind onboarding steps that are irrelevant to the skill being proven, seed the demo account past them ahead of time so the recorded flow starts at the moment that matters. A viewer who watches someone click through five setup screens before reaching the actual feature will stop watching before the feature appears.

  1. Pick one Bubble build in the portfolio that proves a real skill, not just a template.
  2. Open the live version of the app and prepare demo data that is safe to show.
  3. Write the one line hint, request the video, and review the result before adding it to the portfolio.

What data should be sitting in the app when it records?

An empty Bubble data type makes even correct logic look broken, because the viewer cannot tell whether a list is empty by design or because nothing has been entered. Populate two or three rows of believable placeholder content before requesting the render. Use invented names and invented organizations rather than a real client's information, even if the build was made for a real client, unless that client has explicitly approved being shown.

Prepared data also protects the recording from an accidental empty state. If a search result, a dashboard count, or a filtered list has nothing to display, the render will show exactly that and there is no way to edit around it after the fact. Checking the app by hand before submitting a render, the same way any staging build gets checked before it is recorded, catches this before time is held for a render that has to be redone.

Where does this fit next to a static screenshot or GIF?

A screenshot answers "what does it look like." A video answers "does it work." Most portfolios benefit from having both, with the video doing the heavier lifting. Anyone who has tried to compress a multi step flow into a looping GIF knows the tradeoffs, and the product demo GIF alternative guide covers why a short narrated video usually communicates more in less space than an animated image can.

Write the one line hint the same way you would brief a colleague standing over your shoulder: name the starting screen, the action, and the result you expect to see. The AI agent demo video prompt guide has more detail on phrasing a hint precisely enough that the render matches what you intended, rather than something adjacent to it.

Keep the sound in mind even for a portfolio entry that will likely be watched with audio off first. A viewer scrolling a portfolio page on a laptop in an office is not going to unmute anything, so the visual sequence needs to make sense without narration, a point covered directly in the demo video with sound off guide. Captions burned into the render carry the point when audio is not an option.

How does this compare to a Firebase Studio portfolio entry?

The underlying discipline is the same across builder platforms even though the platform specifics differ. A Firebase Studio demo video faces a different question, since Firebase Studio apps typically deploy to Firebase Hosting and the preview inside the workspace itself is not something a client can open without project access. The Firebase Studio landing page video guide and the Firebase Studio Product Hunt launch video guide both deal with getting an app in front of a stranger who has never seen it, which is close to the portfolio problem but not identical, since a portfolio viewer already knows who built the thing and is judging the builder rather than deciding whether to sign up. The Firebase Studio share with a client guide is closer still, because handing work to someone who will not click a preview link is the same problem a portfolio page solves for a hiring reviewer.

For a build made with an AI coding agent rather than by hand in the Bubble editor, the review question changes again, and the AI agent PR demo video guide covers what a reviewer needs to see when the change under review came from a generated pull request rather than a person dragging elements onto a canvas.

Before adding a finished render to a portfolio, watch it once the way a stranger would: no context, sound off, on a phone if the portfolio will be viewed on one. If the flow still makes sense cold, it is ready. If it needs an explanation typed underneath it to make sense, the flow was too broad and should be narrowed before the next attempt. For everything else on the workflow, from the reviewer handoff for a Bubble build to Bubble alternatives to a guided screen recording tool, the pricing page for plans and top ups, the full guide library, the comparison pages, and the GogoScreen homepage for the URL and hint workflow itself, treat this the same as any other build under review: check it by hand before anyone else does.

Clarifications

Before you start

Why does a screenshot fail as a Bubble portfolio entry?

A screenshot shows one frame of a design tab. It cannot show a workflow firing, a privacy rule releasing the right data, or the responsive engine reflowing a page across widths, and those are exactly what a reviewer of a Bubble build wants to check.

Should a Bubble portfolio video use the live version or the test version?

Use whichever version the reviewer is meant to trust. A live version on the app's own domain reads as finished work. A version-test build is fine for a build still under review, but say which one it is so nobody mistakes a draft for the shipped app.

What if the Bubble app requires a login to reach the interesting screen?

Supply a disposable demo account through the approved process. The credential is encrypted, used for a single render, then deleted. When a storyboard is planned first, the credentials are kept encrypted for that session and deleted at most two hours after their last use. Never hand over a real client login for this purpose.

Paste a URL, describe one flow, and get a demo video of your web app.

Your first 60 seconds of video are free, with a watermark. Verify your email to download the video.