Makers of visitor registration system Envoy harness the power of CSS to visualise how people can experience the product in action.
Envoy, a product that focuses on visitor registration at your office, offers an elegant iPad-based interface for collecting names, capturing signatures and printing visitor badges on the spot. For the website that promotes the app, the "primary goal was to allow our customers to visualise how their own visitors can experience Envoy at their offices," explains co-founder and designer Vítor Lourenço. "We decided an interactive demo would be the most visually engaging way to demonstrate this."
To achieve that, the site displays the app’s functionality and screen states atop an iPad mockup. As you scroll through the one-page site, the states update in the demo. CSS transitions are used to help aid in the demonstration, enhancing the experience without ever getting in the way of the content.
"We spent many hours working on tiny details," co-founder and engineer Larry Gadea adds. "We love the way the visitor’s signature draws itself when you scroll past the NDA screen, or how the visitor badge gets printed at the end of the flow."
This article originally appeared in net magazine issue 246.
