01 A product launch
Bring it out of the sand
The bottle arrives, turns in the light and ends on the price. Launches, drops, anything people should want before they read a spec.
Skip to prices 
01 
02 
03 
04
Scroll story websites · Singapore
Commission a scroll story website people watch to the end
Your page plays like a short film as people scroll. Layered art, film and 3D move with their thumb, and your enquiry form waits where the film ends. Written, designed and built by one person in Singapore.
Scroll to walk through the doorScroll
What a scroll story is
A scroll story is a web page that plays like a film.
Your visitor's thumb is the play button. Each scroll moves the camera.
They keep going to see what happens next, and the last scene is where they ask you for a price.
The idea
A normal web page waits to be read. A scroll story moves when your visitor does. Every flick of the thumb brings the next scene, in the order you wrote it, so the page tells your story the way you would tell it across a table.
How the desert was made
Remember the desert?
- 01You walked through it a minute ago. Here is how it was put together.
- 02It was never one picture. It's four, stood one behind the other like scenery on a stage.
- 03Each one is made on its own, back to front: the sky, the dunes and the door, the traveller, the sand at your feet.
- 04When you scroll, the near ones move faster than the far ones. That difference is what your eye reads as depth.
- 05Put back together, they look like one photograph again. Then the traveller sets off for the door.
- 06Yours gets the same treatment. Your own photos, or art made for your page, cut into layers and set moving.
The toolkit
Everything you just scrolled through, and what it's called.
- 01
Layered parallax
Four pictures set at four depths, each moving at its own speed.
Seen here: The desert at the top
- 02
A film on the scroll
A short film cut into frames, so scrolling plays it forwards and back.
Seen here: The walk through the door
- 03
Real-time 3D
A scene drawn live in the browser with Three.js. It can turn, split open and follow the cursor.
Seen here: The layers, taken apart
- 04
Pinned scenes
The page holds still while a scene plays out, then lets go.
Seen here: Every section so far
- 05
Words that arrive
Lines that light up as they are read, in the order you wrote them.
Seen here: The paragraph after the door
- 06
Sideways chapters
A run of scenes that moves across the screen inside a page that moves down.
Seen here: Coming up next
For you
What could yours show?
Four examples, made for this page. No client work is shown.
01 02 A property
Walk round it before it exists
Dusk falls on the house, the lights come on, and the floor plan follows. For launches, showflats and architects.
03 A place to visit
The first visit happens on their phone
The table is set before anyone books it. Restaurants, hotels, venues and attractions.
04 A brand with a history
Every panel a chapter
Walk the years in order, one scroll at a time. Anniversaries, company stories, a process you explain on every call.
How it goes
Three weeks from one sentence to live.
01 Week 1
The story, in one sentence
We agree the one thing a visitor should understand by the end. I write the scroll script, scene by scene, and you scroll a rough version in your browser before anything is drawn.
02 Week 2
Art and film
I make the layers and the film for your brand, in your colours. The pictures are generated and art-directed, then swapped for your own photography or footage whenever you have it.
03 Week 2 to 3
Build and phone test
Every word is real text that Google can read. I tune the motion on real phones and make the page lighter where a phone needs it.
04 Launch
Live, and counted
You see how far people scroll, which scene they stop at and where the enquiries come from. The form sits where the film ends.
Prices, in SGD
Fixed prices, written down.
Half upfront, half when you sign off the finished page. The desert, the door and the film above are Scroll Story work; the 3D view of the layers is the kind of extra a 3D Story adds.
Story Proposal
$1,000
1 week
See your story working before you commit to a build.
- One story call
- The scroll script, scene by scene
- A rough version you can scroll in your browser
- Full fee credited if you go ahead
This page
Scroll Story
$2,800
2 to 3 weeks
Layered art and a scrubbed film, like the desert and the door at the top of this page.
- 4 to 6 scenes
- Layered parallax art, made for your brand
- One scroll-scrubbed film sequence
- Copy written for you
- Enquiry form and scene tracking
3D Story
$4,800
3 to 5 weeks
A real-time 3D scene built round your product, place or idea.
- 6 to 8 chapters
- One 3D scene, modelled for you
- Copy, form and chapter tracking
- 30 days of fixes after launch
3D World
from $8,500
5 to 8 weeks
Several scenes, or your own CAD and product files brought to life.
- Everything in 3D Story
- Several scenes or a walk-through
- Pieces people can turn and open
- Models built from your files
Questions
Before you ask.
What is a scroll story website?
A web page that plays like a short film as you scroll. Pictures slide at different depths, a video moves forward with your thumb, and the text arrives scene by scene. It is also called scrollytelling, a parallax website or a scroll-driven website. This page is one.
How much does a scroll story website cost?
A Scroll Story is $2,800 SGD for 4 to 6 scenes with layered art, one scrubbed film sequence, copy and an enquiry form. If you want to see the idea first, the Story Proposal is $1,000 and is credited in full if you go ahead. A page with a real-time 3D scene is $4,800.
What is the difference between a scroll story and a 3D website?
A scroll story is made of pictures and film: layers that move at different speeds and video that plays on the scroll. A 3D website draws a real 3D scene in the browser, so the camera can fly anywhere and the scene can react. Scroll stories are lighter and cheaper. The 3D website design page shows the other kind.
Will it be slow, or hurt my SEO?
Every heading and paragraph is ordinary HTML that loads first, so Google reads it like any other page. The pictures are compressed, and the film only starts downloading once you scroll or the page goes quiet. The whole walk through the door on this page is 1.3 MB on a computer and 0.6 MB on a phone.
Do I need photos or video?
No. The art is generated and art-directed to your brand, like everything on this page. If you have your own photography or footage, it can be used as it is or swapped in later.
Does it work on phones?
Yes. Phones get their own crop of the film and smaller pictures, and the motion is tuned on real devices before launch. Swiping moves the story the same way scrolling does.
How long does it take?
Two to three weeks for a Scroll Story, from the story call to launch. The Story Proposal takes one week.
Can it go on my existing website?
Yes. It can live as a landing page on your current domain, or as the homepage of a new site. It also works as a Google Ads landing page, because the text arrives first and the form works with or without the motion.
Who owns it?
You do, once it is paid for: the code, the copy and the art, hosted on your own account. Builds are half upfront and half on sign-off, in SGD.
Your story
Your story, next.
Tell me what you sell and who it's for. I'll reply within a working day with a first idea for the story and which option fits. That first idea is free.
Or email hello@terris.sg. Looking for a real-time 3D scene? See 3D website design.
