Draw the journey
before you draw a page.

They answer three different questions and a project usually wants all three. A sitemap answers what pages exist and how they nest, which is a hierarchy and says nothing about movement. A wireframe answers how one screen is laid out, which is a composition and says nothing about what came before it. A storyboard answers what happens in what order, which is the connective layer between the two. In practice the storyboard should come first, because both of the others are cheaper to make once you know the sequence, and because the questions the storyboard surfaces, chiefly the page nobody scoped and the path that dead-ends, are structural questions that are painful to answer once designs exist.

Start with arrivals rather than with the homepage. List the ways people actually reach you, which is usually an advertisement, a search result on a deep page, a referral link, and a direct visit from someone returning, and make a frame for each landing point. On each frame write what that visitor knows at that moment, what they need next, and the one action the screen is asking for. Then draw the route forward from each arrival to the thing you want them to do, adding a frame wherever the path needs a screen. When a route runs out, you have found a missing page, and it is almost always a proof point, a comparison, or an answer to the objection that stops the decision. Only once every path completes should you go back and check the navigation supports the journeys you drew.

Enough that the sequence is checkable and no more. That means the actual headline and the actual call to action on each frame, because real words expose problems placeholder text hides, chiefly two screens making the same promise or a page whose purpose nobody can state. It also means listing what content the frame depends on, such as a case study, photography, or pricing detail, and who owns it. What it should not have is layout: the moment you start positioning elements you have started wireframing, and the frames stop being cheap to move, which was the entire advantage. If someone asks where the image sits on the page, that is a good sign the storyboard is finished and the next document should start.

Not during early access. Storyflow is paid-only right now, with plans from $7.99 a month billed annually, and a Free plan launches before the end of 2026. Anyone a paid member invites to a board joins free today, so a client or a developer can view and contribute without paying. If you need something free this minute, Figma's free tier handles frames and connectors perfectly well, and index cards on a table remain a completely serious way to storyboard a small site, with the advantage that rearranging them is faster than any software. What you give up in both cases is the AI first draft and having the reference, the copy, and the content inventory on the same surface as the structure.

It can produce a solid first structure and it cannot make the judgment calls. Describe the business, the audience, and what you want visitors to do, and Storyflow's AI lays out the screens as frames with the conventional routes drawn between them. That is genuinely valuable because the conventional structure is right about seventy percent of the time and correcting a drawn version is far quicker than starting from nothing. What it does not know is which objection actually stops your customers, which proof they need and when, or what your business is unusual about, and those are precisely the things that determine whether the journey works. The division Storyflow is built on is that the AI proposes and arranges, and the decisions stay with the person who knows the business.

Yes, and for a landing page the storyboard covers the sections rather than the pages. A landing page is a sequence: the visitor arrives with a promise in their head from wherever they clicked, and each section either advances the argument or wastes their attention. Make a frame per section, write the actual heading of each, and read them top to bottom as if you were the visitor. Two failures show up almost immediately. The first is a section that repeats an earlier claim in different words, which reads as padding. The second is an objection that arrives in the reader's mind at section three and is not answered until section seven, by which point they have gone. Both are obvious in frames and nearly invisible in a design file.

Whoever knows why people buy, whoever will write the words, and whoever will build it. That is often three people and occasionally one. The reason to include the writer early is that real copy on frames is what makes the storyboard useful, and a writer brought in after the structure is fixed inherits problems they could have prevented. The reason to include the builder is that a structural choice with a large technical cost is much better known now than after client approval. The client or the business owner should see the result but does not need to be present for the drafting; approving a walked journey is a good conversation, and watching one be assembled is usually a long one.

Yes. Send a view-only link and anyone opens the full board in a browser with no account and no download, which is what makes storyboard approval practical: a client can walk the journey themselves rather than have it described. Comments attach to the frame they concern, so a note about the enquiry step stays on the enquiry step rather than becoming line four of an email about six different things. If you want people contributing, invite them onto the canvas so a copywriter can fill in headlines and a developer can flag the frames with technical implications. For a formal handover or a document that has to be filed, export the board as a high-quality image or PDF.

Wireframes for the screens that need them, then design, then build, and the storyboard should stay open through all three. Its ongoing job is to be the thing you check against when a change is proposed, because the question that gets lost during design is what a change does to the journey rather than to the page. In Storyflow the storyboard can also become the project board: the frames carry the content each screen needs and its owner, so the same canvas that proved the sequence tracks the work, and the reasoning behind a structural decision is one scroll away when somebody asks in week six why the comparison page exists.