Claudio Guglieri
Jan 28, 2015 · 7 min read

Lessons from the Movie Theatre — Part 1.

Cinematic Continuity in User Interface Design

Example of “cutting for continuity” on The Matrix, 1999. Neo grabs the weapon as he goes through the hallway.
Another Example of “cutting for continuity” on The Interview, 2014. Content, Movement and Time are used here to create continuity.

If we wish to retain the attention of the public we have to maintain
unbroken connection with each preceding shot

Alfred Capus, 1908


Continuity and UI Design

I. “Cutting to continuity” Experiences

II. ”Single take” Experiences

Samsung Center Stage by Barbarian Group is a great example of “Single take” websites. See their full case study here: http://vimeo.com/99379887
ingworld.ing.com is a great example of a good attempt to create a single take experience. When clicking on an article the transition connects both Homescreen and Article page in a continues transition

Know the rules well, so you can break them effectively.


Can you mention an example of continuity besides Apple and Google’s models?



Design Words

UI Design related articles, thoughts and experiences

    Claudio Guglieri

    Written by

    Creative Director - Designer. Formerly Creative Director at Microsoft, Elephant, Fi.

    Design Words

    UI Design related articles, thoughts and experiences