{"id":14037,"date":"2013-03-05T09:00:17","date_gmt":"2013-03-05T14:00:17","guid":{"rendered":"https:\/\/www.delvinia.com\/?p=14037"},"modified":"2020-04-05T08:29:10","modified_gmt":"2020-04-05T12:29:10","slug":"engaging-consumers-through-storytelling-and-single-page-websites","status":"publish","type":"post","link":"https:\/\/www.delvinia.com\/engaging-consumers-through-storytelling-and-single-page-websites\/","title":{"rendered":"Design: Engaging consumers through storytelling and single page websites"},"content":{"rendered":"<p>Single page websites are not a new idea, but with the evolution of web technologies they have become a powerful way to tell stories and to improve engagement and content assimilation.<\/p>\n<p><img fetchpriority=\"high\" decoding=\"async\" class=\"alignright size-medium wp-image-14047\" src=\"https:\/\/www.delvinia.com\/wp-content\/uploads\/2013\/03\/CadillacMorocco02-450x235.jpg\" alt=\"CadillacMorocco02\" width=\"450\" height=\"235\" \/>Instead of a set of pages linked with hyperlinks, which makes for a rather static and traditional navigation, single page websites have a fluid and engaging experience. The design uses scrolling as a main navigation, triggering animations, interactions and content population. \u00a0The design, combined with storytelling techniques, puts the user in a mindset of wanting to learn what the story has to offer.<\/p>\n<p>The technique can be used in combination with traditional hierarchy and that is what the makers of Tinke, a fitness and wellness monitoring device, have done on their site. Users can opt to take a tour of the site and they\u2019re presented with other more traditional pages such as tech specs and an FAQ. You can see the site here.<\/p>\n<p>Single page design is also the format Cadillac has used to present their new ATS model as part of the company\u2019s \u201cCadillac ATS vs. The World\u201d campaign. The site contains traditional navigation to different pages such as specifications and dealers, but when on a destination, the background features beautiful and impactful images and the navigation is mainly vertical, divided by sections. Scrolling activates animations and parallax transitions, and within each section, content is revealed and interactions presented for more.<\/p>\n<p><img decoding=\"async\" class=\"alignright size-medium wp-image-14042\" src=\"https:\/\/www.delvinia.com\/wp-content\/uploads\/2013\/03\/Peugeot-450x227.jpg\" alt=\"Peugeot\" width=\"450\" height=\"227\" \/>There are other single page sites where the intent is to simply educate users about a subject, which is the case for Dangers of Hydraulic Fracturing. This site illustrates the whole path to get gas by pressure, educating the user along the way.<\/p>\n<p>Some brands have embraced the single page technique and used it to literally tell a story in the shape of a graphic novel, cleverly incorporating the product within it. That\u2019s the case with the Peugeot Hybrid 4. You can see the site here.<\/p>\n<p>In all of these examples, the interface used is a perfect medium for the narrative; starting from top to bottom and using impactful graphic elements and illustrations combined with interactions and animations to tell the story. Containing the content within one page also helps to keep the fluidity of the message.<\/p>\n<p>But there are some considerations when creating this type of experience, such as:<\/p>\n<ul>\n<li>Know your audience. Is this the best technique for your website? Or, is your audience on mobile?<\/li>\n<li>Create a well defined message. It\u2019s through the narrative that people are engaged.<\/li>\n<li>Consider your total website size. You may have the best message, but if your site is heavy and slow, that will play against you.<\/li>\n<\/ul>\n<p>Single page design is a powerful technique which is becoming the standard for certain types of websites. There\u2019s no doubt it can be an effective tool to engage your users and tell your brand story.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Single page websites are not a new idea, but with the evolution of web technologies they have become a powerful way to tell stories and to improve engagement and content assimilation. Instead of a set of pages linked with hyperlinks, which makes for a rather static and traditional navigation, single page websites have a fluid [&hellip;]<\/p>\n","protected":false},"author":20,"featured_media":18865,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[947],"tags":[460,416,948,643,38],"_links":{"self":[{"href":"https:\/\/www.delvinia.com\/wp-json\/wp\/v2\/posts\/14037"}],"collection":[{"href":"https:\/\/www.delvinia.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.delvinia.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.delvinia.com\/wp-json\/wp\/v2\/users\/20"}],"replies":[{"embeddable":true,"href":"https:\/\/www.delvinia.com\/wp-json\/wp\/v2\/comments?post=14037"}],"version-history":[{"count":6,"href":"https:\/\/www.delvinia.com\/wp-json\/wp\/v2\/posts\/14037\/revisions"}],"predecessor-version":[{"id":27014,"href":"https:\/\/www.delvinia.com\/wp-json\/wp\/v2\/posts\/14037\/revisions\/27014"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.delvinia.com\/wp-json\/wp\/v2\/media\/18865"}],"wp:attachment":[{"href":"https:\/\/www.delvinia.com\/wp-json\/wp\/v2\/media?parent=14037"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.delvinia.com\/wp-json\/wp\/v2\/categories?post=14037"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.delvinia.com\/wp-json\/wp\/v2\/tags?post=14037"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}