#37. Does "Above the fold" work in the age of infinite scroll? Part 2: The Sequence Strategy

 

In the first part of this series, I introduced the Teaser Strategy, which helps create landing pages with a clear purpose and resolution. In this issue, we are going to explore the Sequence Strategy. As you may have guessed, this strategy is particularly useful when designing multi-page websites.

Specifically, I refer to websites that address multiple purposes (though I recommend no more than three) with one clear resolution.

Note: however many purposes of a website, there should only ever be one resolution!

3 strategies to build lasting attention. They derive from my personal analysis of the cinematic world.

3 strategies to build lasting attention. They derive from my personal analysis of the cinematic world.

These websites are designed to be navigated. We actively want the user to visit more than just one page, so they can view the ‘big picture’ brand offering or learn important information. However, site navigation is not always linear, which can make the designer’s job complicated because individual user journeys are harder to predict.

What specific kind of website suits the Sequence Strategy? They can be e-commerce sites, but also portal websites or portfolios. As such, the Sequence Strategy works especially well for studios, consultancies, architecture firms, and brands for whom process and outcome matter equally.

The example I have chosen is a portfolio, taken from the architectural studio Yodezeen. Their website was designed by the US-based studio, The First The Last.

We are now going to analyse this website together, through the lens of the Japanese cult movie, Tampopo. (Warning: there are spoilers ahead for those who haven’t watched the movie yet!).

 

The Sequence Strategy

Screenshots from the website, Yodezeen.

Screenshots from the website, Yodezeen. Their website was designed by the US-based studio, The First The Last.

Example: Yodezeen

Yodezeen is an international architecture and interior design studio, with a diverse global portfolio that spans residences, hospitality, commercial and public spaces. The website’s detailed portfolio plays a central role in establishing the studio’s identity.

  • Purpose: In general, the portfolio justifies and showcases the studio’s expertise. Yet the website has two specific purposes, categorised as follows:

    To motivate (each project is supported both visually and contextually, with clearly-explained challenges and design responses to help users see what’s possible).

    To persuade (an elegant presentation and strong visual storytelling show the studio’s vast capability).

  • Resolution: Ensure completeness (services are presented as an integrated journey from concept to realisation, in a one-stop solution model.)

The Sequence Strategy employs scrolling and non-linear storytelling to guide users towards a deeper understanding of Yodezeen’s work. This understanding is designed to occur slowly and deliberately, rather than rushing users through key concepts.

As a rule of thumb, if a user doesn’t understand what you offer after having navigated a maximum of three web pages, the Sequence Strategy hasn’t been applied correctly.


The same approach applies to movie-making. If you can’t engage viewers during the first and second acts (between the inciting incident and the beginning of the midpoint), you will lose their interest. Some may even walk out of the cinema in disgust!


To clarify, let’s analyse how the Sequence Strategy works in the movie Tampopo, whose plot I have set out in the classic three-act story structure.

Tampopo by Juzo Itami. The Aristotle 3 -act structure shows how the “ramen western” movie evolves.

 

Tampopo is a “ramen western” directed by Jūzō Itami.

The film has a clear central storyline: Tampopo, the widowed owner of a struggling ramen shop, meets a pair of truck drivers, Gorō and his younger colleague Gun. They help transform her small restaurant into a place where ramen becomes an art form, culminating in the creation of the perfect bowl.

If you have ever eaten ramen, you know that the dish itself is deceptively simple. And yet, a great ramen is made of many complex layers of flavour, extreme attention to timing, and deep care towards the preparation of each ingredient.

In the same way, Itami takes an apparently simple plot and enriches it with a series of vignettes. At first, these vignettes seem unrelated to the main story, but they gradually reveal their purpose: they add flavour to the film. They deepen our understanding of food, pleasure, discipline and ritual, ultimately reminding us that a good story, like a good ramen, cannot rely on one ingredient alone.


As such, all of the story’s vignettes revolve around food. From oysters (kaki in Japanese) to noodles, from etiquette to obsession, they echo the components of ramen itself. Each one adds a new layer of meaning, inviting the viewer to see the film as a rich, multi-faceted experience.


Act 1: The Setup / The Bowl

In the Yodezeen website, infinite scroll is the technique relied upon to navigate the pages.

For example, if the home page is the beginning of the user journey, we can see that through scrolling, they are immediately invited to jump into other sections of the website, such as the featured projects or wider portfolio.

Users can enter the portfolio by featured project, area of expertise, or through the cities Yodezeen has worked in.


The only “vignette" that interrupts this navigation is the studio’s monograph book (although the ‘Coming Soon’ link unfortunately doesn't take us anywhere: a missed opportunity, as it could lead to a presale offer!).

The other web pages are more linear in their navigation, presenting easy entry points to Yodezeen’s portfolio.

The About page is interesting in its structure, although I feel that introducing each team member personally would reinforce the site’s purpose of persuasion. Yet just like Tampopo, here are vignettes that introduce characters and situations, without going too deeply into their stories and motivations. They exist to reinforce the content, not justify the main storyline which is rock-solid.

The setup. During the long scrolling experience, narrative breaks and vignettes are introduced to add depth to the page.

 

Act 2: The Confrontation / The Ingredients

The main story thread in Tampopo is the research undertaken to create the best bowl of ramen. This research sends all the protagonists on a quest, interrupted by more vignettes.

Similarly, the main theme of Yodezeen’s website is the studio and their projects. If we treat each project as a ramen ingredient, we see it is fully presented within a specific storyline that leaves the user little room to move elsewhere, unless they want to explore the next project.


The site doesn't delve into the complications of numbers or technical specifications, perhaps because the target audience may not understand these details. However, the storytelling is supported by large typography that frames specific challenges, and beautiful photography that showcases the final result.


This shows that balancing what users see and the journey taken to get there is an essential component of the Sequence Strategy.

For example, in the movie we see the protagonist Tampopo struggling to make a deliciously balanced ramen bowl. The execution is meticulously composed of different layers of ingredients, which is difficult to achieve well.

But when you enjoy a ramen bowl, are you really interested in learning these details? Or do you just want to devour a delicious bowl of excellent soup? The audience wants to see the result.


Each Yodezeen project page is a component: sending users to the next project in the same category. The only interruption (or vignette, staying true to Tampopo's world!), is that a ‘Send Request’ button opens a form to contact the company. This is a vignette, because once closed, the user is returned to the main ‘plot’ of the page.

The confrontation. Very few narrative breaks appear on pages that are crucial to the resolution, such as the Services page and the project pages.

 

Act 3: The Resolution / The Overall Experience

When using the Sequence Strategy, we understand that a website’s overall structure is what brings the user to the final resolution: not one page or section alone. This means the user must be able to make clear and immediate sense of the information being presented.

Think of that bowl of ramen: the collection of finely-balanced ingredients are what make the whole dish so enjoyably exquisite.

So, what does ths mean in web-design practice? First, that the website needs to maintain the same level of quality, from page to page. The Sequence Strategy treats web pages as components of a wider, coherent plot. Every page offers a different entry point, and a new way for the user to "taste" the quality of the plot, or ramen bowl.

(In fact, just as with the ramen, everyone has their own favourite way to dive in, whether it’s the noodles, the broth, the pork, or the vegetables!).

The Resolution. The website uses original design solutions to express core concepts. Like “internationality” is a recurring and well-articulated theme.

The Resolution. The website uses original design solutions to express core concepts. Like “internationality” is a recurring and well-articulated theme.


As a quick reminder, when using the Sequence Strategy:

Don’t do this:

  • Treat the home page as exclusively important

  • Design sections with uneven quality or attention

  • Frequently interrupt the journey with hard calls to action

  • Overload pages with technical data your audience doesn’t need

  • Create pages that feel disconnected from the rest of the site

Do this instead:

  • Design the website as a continuous narrative

  • Use scrolling to invite deeper exploration, rather than rush decisions

  • Let each page reinforce the same level of care and craft

  • Allow projects or content to lead seamlessly into each-other

  • Introduce calls to action as story-enhancing vignettes, not harsh interruptions

  • Trust the intelligence and curiosity of your audience: the goal is not to explain excessively, but to create confidence through consistency.

  • Remember: just like a badly-balanced dish, one weak ingredient can ruin the whole experience.

The Sequence Strategy works best for:

  • You have complex offerings that need time to be understood

  • Your portfolio or work is your strongest argument

  • Trust is built through accumulation, not persuasion

  • Users are likely to enter the website from multiple entry points

  • The experience needs to feel cohesive from start to finish


 

In part three of this series, we will analyse the Agatha Christie Strategy, or: how has our scrolling habit changed the build-up of suspense and expectation? Here, we will use the movie The Prestige (directed by Christopher Nolan) as our lens.

The Prestige is not a typical “action” movie; in fact I feel it has an introspective side that’s closer to Oppenheimer, Nolan’s most recent work.

Until then, I hope you can find the time and place to enjoy a good bowl of ramen with the movie Tampopo (or even Prestige), if you haven't already!

 
Previous
Previous

#38. Does "Above the fold" work in the age of infinite scroll? Part 3: The Agatha Christie Strategy

Next
Next

#36. Does "Above the fold" work in the age of infinite scroll? Part 1: The Teaser Strategy