Guide6 min read

Firebase Studio Portfolio Demo Video

Show the Firebase Studio build running, not a screenshot of the editor.

Turn a Firebase Studio build into a portfolio entry that shows the app running on its public URL, not a screenshot of the workspace.

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

gogoscreen.com

Choose a build with a real working flow

Choose a Firebase Studio build in the portfolio with a real working flow, not just a styled layout.

Deploy it and prepare believable data

Deploy it to a reachable URL and prepare believable data that is safe to show.

Record the flow and check it plays cold

Record the flow and check that it makes sense to someone seeing the app for the first time.

A Firebase Studio portfolio entry needs to prove one thing a screenshot cannot: that something specific was actually built, not just assembled from a default scaffold with different colors. Firebase Studio makes it fast to get a working looking app on screen quickly, especially with its AI assisted scaffolding, and that speed is exactly why a screenshot alone does not distinguish a build that has real logic behind it from one that is still mostly the starting template. A short video of one flow actually completing is the difference a reviewer can see.

GogoScreen builds that from a public app URL and a one line hint describing the flow, returning a narrated MP4 in roughly two minutes with zooms on clicks, cursor smoothing, dead air removed, and captions burned in. If the flow sits behind Firebase Authentication, a demo account can be supplied, 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. None of this promises every render will work cleanly. Roughly one render in five needs a retry, which is worth knowing before submitting the night before a portfolio needs to go live.

Why does the workspace preview not work for this?

The live preview inside the Firebase Studio workspace is tied to the Google account with access to that project, so it is not something a stranger reviewing a portfolio can open on their own even if they had the link. A portfolio entry needs a URL that works for someone with zero relationship to the project, which means the app has to be deployed to its public Firebase Hosting address before it can be recorded for this purpose.

Deploying also forces a useful discipline: a build that only works inside the development workspace, relying on settings or data that exist only there, will reveal that gap the moment it is opened on the public URL cold. Catching that before recording is better than catching it after a reviewer has already tried and failed to see what was promised.

Portfolio requirement	Why the deployed URL satisfies it	Why the workspace preview does not
Reachable by a stranger	Public Firebase Hosting URL needs no project access	Workspace preview needs Google account access to the project
Shows real, finished behavior	Forces the build to work outside the dev environment	Can hide gaps that only exist once deployed
Safe to link publicly	A hosting URL is meant to be shared	The workspace is a development tool, not a shareable asset

What flow should the video actually show?

Pick a flow that reflects custom work, not the scaffold's default behavior. If the app was built starting from a generated template, the video should focus on whatever was added or changed on top of it, a specific data model, a workflow that responds to input in a particular way, a piece of logic that solves an actual problem rather than displaying a generic layout. A reviewer evaluating a builder's skill for a hiring decision or a freelance engagement wants evidence of that skill specifically, not evidence that a scaffold exists. The agent built app demo video guide covers the closely related case of proving custom work when an AI coding agent generated much of the scaffold directly, which is worth checking when it is unclear how much of the finished app to credit to the template versus the build. If the custom flow being proven is a CRM style pipeline, the CRM demo video guide covers picking the one deal or contact that moves through a real action, since a tour of every tab proves custom work no better here than it does anywhere else. If the custom flow is a metrics view instead, the internal dashboard demo video guide covers picking the one view that answers the question the build was meant to answer, the dashboard equivalent of the same test.

Identify the piece of the build that reflects actual custom work.
Confirm that flow still works on the deployed URL, not just in the workspace.
Prepare data that makes the flow's purpose clear to a first time viewer.

Choose a Firebase Studio build in the portfolio with a real working flow, not just a styled layout.
Deploy it to a reachable URL and prepare believable data that is safe to show.
Record the flow and check that it makes sense to someone seeing the app for the first time.

What data should be visible when it records?

An empty or obviously fake looking dataset undercuts an otherwise solid flow, because the viewer cannot tell whether the logic is genuinely working or simply displaying nothing. Populate a few rows of invented but believable content before recording, using names and details that read as plausible without using anything from a real client's project unless that client has approved it being shown publicly.

How should you review the finished video before publishing it?

Watch it as a stranger would, with no prior context and the sound off first. If the flow still makes sense without narration, the captions are doing enough of the work on their own. If it only makes sense with the full explanation playing, the flow was likely too complex for a portfolio entry and would benefit from being narrowed to a smaller, cleaner action.

Check the render against what was actually built rather than what was hoped for. If the render captured an edge case or an error that the app does not usually show, do not present it as representative. Fix the underlying issue and record again rather than editing around a flaw the render happened to catch.

Also check the video still holds up months later, since a portfolio is rarely updated the same week the underlying app changes. A dependency upgrade, a deprecated API, or a data model change can quietly break the exact flow a portfolio video is built around, and nobody notices until a reviewer clicks through and finds the live app now behaves differently than the video shows. Set a reminder to reopen the deployed URL every so often and confirm the flow still matches what the video claims, rather than assuming a portfolio piece is finished once it is published.

This matters more for a Firebase Studio build than for a hand maintained app, because a build assembled quickly with AI assisted scaffolding can carry dependencies that were pinned at generation time and never revisited. A portfolio entry that was accurate at launch can drift out of sync with the live app without anyone deciding that on purpose, and the fix is simply to check periodically rather than to assume permanence, especially before sending the link to a reviewer who will judge the whole portfolio on this one entry.

How does this compare to the same job on other platforms?

The underlying approach transfers to other builders even though the platform details differ. The Firebase Studio app review walkthrough guide covers the internal review version of this same build, aimed at someone checking the work against a brief rather than judging the builder generally. For the same portfolio job on a different platform, see the Softr demo video guide, the Softr landing page video guide, the Softr Product Hunt launch video guide, and the Softr share with a client guide.

For a build that has no screen recording available and needs a different approach entirely, the recording a demo without screen recording guide and the automated screen recording for a web app guide cover alternate paths. The two person SaaS demo video guide and the non technical founder demo video guide cover adjacent situations where the person recording the portfolio piece is not the one who did the technical build. If the portfolio entry is meant to support raising money rather than landing freelance work, the investor update demo video guide covers that separate framing. Compare GogoScreen against a dedicated recording tool at GogoScreen versus guidde, check pricing for plans and top ups, browse the full guide library and the comparison pages, or start from the GogoScreen homepage for the URL and hint workflow itself.

Clarifications

Before you start

Should a Firebase Studio portfolio video be recorded from the workspace or the deployed app?

Record from the deployed public URL. The workspace preview inside Firebase Studio usually needs project level Google account access, which a hiring reviewer or prospective client will not have.

What should the video prove for a portfolio entry?

That a specific piece of working logic exists and runs, not that the interface looks polished. A reviewer evaluating a builder's skill wants to see one real flow complete successfully.

Is it fine to use a template based Firebase Studio app in a portfolio?

Only if the video shows something specific that was built on top of the template, a custom flow or logic, rather than the template's default behavior with different placeholder text.

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.

View pricing Read the guides