Client · Case study

Indus AI Week

A national AI week, built as one scroll.

CLIENT

Undisclosed, subcontracted

YEAR

2026

DISCIPLINES

Web

ROLE

web design, motion design, Webflow build

01 / The challenge

Three events, one week.Most people only belong to one.

Indus AI Week is three different events sharing a name: a one-day summit for policy and international delegates, a two-day expo arena for startups and students, and a week of partner events hosted in other cities. A visitor arrives belonging to exactly one of them. The category's usual answer is a mega-menu and a downloadable programme, which works only for someone who already knows which of the three is theirs. The problem was never how to list seven days of programming. It was how to sort a visitor before they have read any of it.

02 / What we did

01Web

Three doors before any detail.

The page opens on the three tiers as three cards, each carrying its own date, its own venue and its own action: the Summit at Jinnah Convention Center, the Arena at Islamabad Sports Complex, partner events across all major cities. No programme detail appears above them. Underneath, one timeline resolves the three overlapping ranges, 09, 09 to 10, and 09 to 15 February, into a single column, so a reader can see that the week nests rather than runs in sequence.

Three cards reading Indus AI Summit, Innovation Learning And Engagement Expo, and Nationwide Ecosystem Participation, each with a venue and an arrow — Three cards, three dates, three venues. The programme sits below this on purpose: nobody should have to read it to find out which tier is theirs.

03 / Visuals

The homepage on a laptop open on a dark counter inside an exhibition hall, a coiled lanyard beside it

The section below the hero arriving: the headline splitting into place, the three programme cards revealing, then each card in turn opening on hover to show its description — The section below the hero, arriving and then answering. The headline splits into place, the three cards land, and each one opens under the cursor to give up its own description: the choice is made before any of the detail is on screen.

The event timeline: three rows reading 09 Feb, 09 to 10 Feb and 09 to 15 Feb, each naming its event and venue — Three overlapping ranges in one column. A visitor needs to see that the week nests, not that it runs in sequence.

The timeline arriving on scroll, the three date rows settling, then the second row lighting to an orange gradient under the cursor — The same rows, live. The heading holds, the dates arrive one at a time, and a row answers the cursor with the programme's own gradient.

The pavilion rail travelling sideways as the page scrolls down, from Shark Tank through Trainings, AI For Her, Jobs Fair, Man vs Machine, Govt Tech Showcase, Sectoral AI and Hackathons — Scrolling down moves the pavilions sideways. Eight parallel programmes given a parallel motion instead of a numbered list.

A hand holding a phone showing the mobile homepage, the dark exhibition hall out of focus behind it — Mobile hero, in the hand it was built for. The dolphin drops behind the type rather than beside it, and the date and location take a full line each.

A phone lying on dark brushed metal under one hard light, showing the Arena section and the first pavilion card — Mobile Arena. The rail becomes a swipe and the heading takes four lines, which is the whole screen before a card appears.

The Nationwide Activities section arriving on scroll: the heading, the dark call to action card, and two rows of partner and activity labels settling into place — Partner types and activity types as plain labels, arriving in rows. No icons and no cards, because a partner is choosing a category here, not reading a feature.

The Why It Matters section: four cards reading Unified Platform, National Action, Scale Impact and Global Position over a robotic hand — Four claims, four cards, no numbers. The programme had none to publish at the time, so nothing is counted.

The closing section: Get Involved and Join Pakistan's National AI Initiative over a full width video band whose light sweeps across it — The closing ask, as it actually behaves. A portrait video runs the full width of the band, which is why it reads as a light sweep rather than a scene.

Nine states of the page in scroll order, arranged three by three — Nine states in scroll order. Read across, it is the argument: choose a tier, place it in the week, then look at what is in it. It also shows the weakest thing here: the pavilion cards run on stock robots and circuit boards, where the hero holds a real idea.

04 / Outcome

Seven days, three tiers,one page that sorts you.

Seven sections on one scroll, built in Webflow with GSAP driving the pinning and the reveals. The pavilion rail is the part worth keeping: the section heading pins and the eight pavilions travel sideways as you scroll down, so a marketplace of parallel things reads as parallel rather than as a list. It never launched. The programme ran in February 2026 and a different site carried it, so this is the build as it stood in July 2026, not a live product.

Next project 12

All projects

Triune Cloud Systems

Start a project

Let’s buildsomething thatstacks up.

Start a project hello@stacworks.co