One Becomes Two: A Scroll-Driven

One Becomes Two: A Scroll-Driven Story of DNA Replication

DNA replication can be hard to explain without turning it into a page full of labels. I wanted to make the process feel simple, visual, and alive.

One Becomes Two follows a single DNA molecule as it opens, uses each old strand as a guide, builds two new strands, seals the remaining gaps, and becomes two complete copies. The viewer moves through the story by scrolling, controlling the pace of each step.

I wrote the eight-part narrative, developed the black-and-white illustration system, designed the editorial layout, and built the animation in HTML, CSS, JavaScript, and SVG. A slowly rotating DNA molecule with subtle projector flicker introduces the piece. Inside the story, solid and outlined lines distinguish original DNA from newly made DNA.

The result is a scientific explanation that feels more like a short illustrated film than a textbook diagram.