Creating an Immersive Web Experience with Digital Signage

September 11, 2014

Intro

You probably spent a lot of time, money, and energy in creating your website and the content within it. I’m sure you want to have a enjoyable and immersive user experience no matter where or on what the user is accessing your content. The need to have a positive user experience across all devices birthed responsive web design. Responsive design is when you design you web site to work on any size device and maintain the same great user experience. However, you can extend that experience even farther. By taking it into your brick and mortar location. Entire websites are not practical content for digital signage, but there are two ways you can use your website as your digital signage content. You can build it to be responsive up to large format displays, which would require a fair amount of formatting and trimming of content but could make for a very cool website. Secondly, you can create individual HTML pages that are part of your overall site but have been tailored for large format displays.

“Digital signage can help tie together the financial institutions online and offline presence” -Robert Moctezuma, Vice President, Desktop Solutions

This allows for the same great content experience from the time the customer looks you up at home on their desktop, checks out your website on their phone. And continues once they are inside your store, club, church, etc... If you have a beautiful website why should the digital signage in your brick and mortar location be any different.

Now I am definitely not a designer or web developer but below is an example I built to highlight how your layout can transition from mobile to display. You can find a live example here

 

Why spend all this time and effort on digital signage?

When your content can cross all mediums in a consistent way it increases brand recognition. And it helps to tell your brand or organizations story and control the way that story is consumed. Digital signage allows you to engage your customer in interesting ways, especially when the content is beautifully built HTML5. Building beautiful content has become less difficult, and expensive. There are also tons of resources online for learning how to do it yourself. If you don’t have the time to learn HTML the same web developer or designer that built your website can help you bring the content to large format displays.

HTML5, CSS3 and Javascript have removed virtually all limitations in the content that can be created for digital signage. Below are just a few fantastic HTML5 templates that we’re built by web developers at Rise Vision. They are not responsive, however they are good examples of the content you can create using HTML5. They are all open source so if you’d like to use one or adjust it you can get the files from their respective Github repos.

Digital signage can enhance the effect of current marketing campaigns and merchandising strategies by bringing them into the retail location in dynamic ways. Digital signage also lowers overhead costs. The upfront costs of developing the content and purchasing the hardware can be daunting. However, in the long run, the time, and money saved by not constantly printing and setting up new print ads makes digital signage a worthy investment. On top of that digital signage has proven ROI across a number of different industries.

“While every situation is different, industry research indicates that even a simple digital menu board with well-thought-out content can result in a sales uplift of as much as 5 percent” -Digital Signage Today

Creating content for digital signage

Get started with Rise Vision

The most effective digital signage content follows standard design principles and focuses on one message, or call to action. This does not mean that you should only have one giant word on the screen. It is beneficial to have a number of elements, but each element should have a purpose in supporting the main message. Otherwise they are just unnecessary content, that detracts from the message.

 

There are a few different elements to this presentation. It’s split into two “slides” the first an introduction that outlines some services the mechanic shop can provide you with and the second a series of tweets to increase engagement. All of the different elements are used well together to support the main message - this is a mechanic shop, that has everything you need to prepare for winter. There is a consistent color theme of red, white, and black. The animated transition between the slides and the accelerometer help get the attention of viewers. And lastly there is an appropriate amount of text, that a reader can quickly understand.

Animation is a very effective way to grab the attention of a passerby. And subtle background animations can help bring attention to the main message. Another design aspect of digital signage is that the fonts should be large enough so that if you are standing multiple feet away they are legible. Using large fonts increases readability and limits text which is a benefit. Too much text can be detrimental to sharing your message. If you have a large paragraph in 12pt font it will not get read. Break up long messages into smaller bits on separate slides. The above example does a good job of this. Rather than have the message and twitter feed on the same slide it is broken up so the audience focuses on one message at a time.

One difference that should be kept in mind between a typical website and digital signage is that web content will be the same all over the world. Digital signage content is typically programmed and tailored depending on date, time, location and a number of other possible factors. When creating HTML content for your digital signage create content that you can rotate through depending on the variable relevant to you. For example a restaurant would show a breakfast special or menu in the morning and dinners in the evening. A retail chain would show different content in their San Francisco store vs. their Toronto store.

Building base templates for your digital signage is an efficient way to create your content. It allows you to quickly change key elements such as images, copy, and colors. But the main structure of the presentation can stay the same. It is also easy to to learn how to edit portions of an HTML page so that you, or your team can make necessary changes quickly and easily.

Conclusion

By using digital signage platforms like Rise Vision, you can use your website to power your digital signage content at next to no cost. And you can engage the customer from the time they look up your store on Google till they finish checking out. By having a consistent brand image, and message you can improve brand awareness.