Rich Archer's blog

Breaking down the process of developing a digital design

Creating a digital design can be simple, but it does require some thought and preparation. Research is a crucial part of ensuring what you create meets the needs of your audience. Design is an iterative process, so don't be afraid to sketch, get feedback, and test ideas. Lastly, don't forget the details, as they can make or break your design. Let's look at each of these areas in more detail. Research A big part of any design project is research. Try to answer the questions - who, what, where, when, and why. When considering "what," dig deeper and think about what to include in the design and what to avoid (i.e., fonts, colors, specific visuals). Often people have a clearer picture of what they don't want to see versus what they would like to see. Consider the overall look and feel of the digital signage and review what elements are typically included in similar designs. Determine if there are industry-specific requirements. Additionally, research the software you plan to use to drive your digital signage. Find out if there are any limitations, such as video and graphics capabilities, file sizes, and types. Also, consider the software's abilities, such as connecting to real-time data, playlists, and metadata. Sketch Don't be afraid to put ideas on paper. Grab a sketchbook or your computer and let your creativity flow. The ideas matter; don't get caught up in whether something is good or bad. Sketches are just a way of conveying your thoughts and flushing them out. Don't be afraid to share them and ask for feedback. There will be a lot of design between your initial sketch and the final visual. Here are a few technical things to consider as you are sketching: Use a one-to-one aspect ratio in your designs, so if you are designing for a standard HD screen, your composition should be 1920 by 1080, and your sketches should match that aspect ratio. Put a frame on your paper or screen to match the aspect ratio of your screen. Knowing the type of screen you are designing for, and any specific requirements are essential. Identify what to include - time, weather, date, logo, social or news feeds, KPIs, real-time data, design elements, etc. As you sketch, consider these design principles - Contrast, Balance, White Space, Scale, Hierarchy, Movement, Repetition, Variety, and Unity. Contrast - Contrast is more than just contrast in colors and tone. Apply contrast to every part of your design, including typography, element size, and size of areas/blocks in your composition. Applying variation in your design goes a long way to creating a more appealing and professional-looking design. In addition, contrast in colors is essential if your audience members are visually impaired. Balance - Balance is the distribution of elements across your design. It helps make your message clear and visually prioritizes information. A design that isn't properly balanced makes it difficult for the viewer to know where to look or what information is important. They will also likely miss key details you were trying to share. A balanced design is more visually appealing. White space - White space is often not thought of in digital signage, and it isn't necessarily white! It is the negative space that surrounds elements of your design. There is a tendency to want to fill every pixel with something. However, white space is positive in your designs – it lets things breathe and be their own. The use of white space can help lead the viewer's eyes to what you want them to see on the screen and emphasize design elements. Of course, there are always exceptions, such as FIDS screens in airports, where showing as much flight information as possible on the screen is essential. Scale - Where should people look? Applying variety in scale (or contrast in scale!) helps establish a visual hierarchy and can help lead the viewer's eye. Having all your type or brand elements look the same size can be appealing, but adding some variety in scale to your design is much more interesting. Hierarchy - Prioritize your design's most important information and elements and create a visual hierarchy for your audience to follow. Leverage font size, white space, and more to direct the order the viewer consumes information. Movement - Movement is a great way to grab attention, particularly compared to static images. Think about the elements of your design where you can incorporate movement. Perhaps it is an animated logo, video content, social media, stock and news feeds, or other graphical elements. Repetition - Repeat elements of your design in different ways to create continuity. For example, repeat a key color or shape in a variety of ways in your design and across various screen layouts. One way to accomplish this could be to pull out colors or shapes from your logo and use them in other design elements. Variety & Unity  - Variety adds visual interest to your digital signage design, especially regarding the content in a playlist. Unity refers to how well elements in your design work together and whether there is a clear relationship between them. Also, think of unity in digital signage in another way – the unity of your various digital signage layouts. Design is in the Details Details are everything – does your text line up? Is your line spacing consistent? Do elements in your design connect? Charles Eames, a famous architect & furniture designer, said, "The details are not the details. They make the design." Details like lining up elements in your design are essential. In this example, the top image's time, AM/PM, day, and date elements appear disjointed. The baselines do not match up, and there's no space between the elements. The bottom image quickly fixes the details and presents a more appealing and professional-looking design.  Now it is time for you to research and get started sketching your next digital screen design! Read our Designing for Accessibility for additional design information.

Designing with Motion: Using Video & Motion Graphics in Digital Signage

Is your digital signage content primarily static images and text content? Consider integrating some motion graphics and video to grab attention and engage viewers. Over the last few decades, attention spans have dropped, and research estimates it to be about 8 seconds. They are many distractions, but social media has played a significant role. Motion graphics and video provide a way to grab more of a viewer's limited attention. This is evident when considering the popularity of TikTok Videos, Instagram Reels, and more. However, using motion graphics and videos on other mediums like digital signage can help garner more attention. Motion Graphics Research has found motion graphics increase conversion by an average of 80%. They drive engagement, traffic, and sales. A motion graphic is a design element that has been animated and is computer generated. Generally, they are significantly cheaper to produce than a live-action video which requires a crew. This makes motion graphics a cost-effective and visually appealing way to explain an idea while adding some movement and action to your screen designs. Popular examples include animated logos, graphical elements, infographics, and text. With motion graphics, it is easy to change the design without redoing an entire video. For example, on a digital donor wall, use motion graphics to highlight new donors or reaching a desired fundraising level. Alternatively, on an employee information screen, use motion graphics to draw attention to a new company policy or important news. Videos Statistics indicate that viewers retain 95% of a message when watching it in video versus 10% when reading it in text. While Forrester researcher Dr. James McQuivey estimates that one minute of video equals 1.8 million words. With those statistics, it is impossible to argue video isn't valuable! When integrating video into your digital signage, here are a few things to consider: Background Video Background video on your digital signage provides a way to grab attention, enhance the experience, and ensure your message is seen. The subtle movement will better catch your viewer's eyes than a static image. For example, in a hospital setting, it could be a calming and soothing motion incorporated into the background of the digital screen design to help patients and visitors de-stress. While in a stadium, some flashes or more dynamic movements may help build excitement. Use background video to explain a product and show it in use, while the main content highlights features and benefits. Ensure your video background reflects your corporate branding and doesn't overpower the rest of your screen design. They shouldn't distract and should always compliment the other information you share on-screen. On your digital signage, set video backgrounds to loop continuously or change as the screen's other content changes. Transparent Videos Making parts of your video transparent provides a way to overlay video onto your design and allow messaging and branding to shine through (literally!). For example, you can add a video to your donor wall and make it partially transparent to allow the background design and names to shine through. In other situations, by adding transparency, you can add an icon or graphic to part of the screen to highlight important information you want people to see. For example, an airport may wish to sell advertising space on their flight display screens with partial screen takeovers, making parts of the video announcement transparent. Using transparency in videos allows them to announce an upcoming event or holiday without impacting the travelers' ability to view flight information. Using video helps intrigue views and capture attention. It creates a visual impact and helps encourage audience engagement.

Design Practices For Digital Signage

Designing for digital signage is similar to designing for other mediums in many ways. For example, audience, content, and layout are all important considerations, along with digital signage-specific requirements such as data feeds, location, accessibility, and more.   Let's take a closer look at how to approach designing for digital signage: First Step - Key questions To get started, you need to consider a few questions: Who will be looking at my screens, where will they be looking at them, and what will they be doing when looking at the screens? Who - Identify your audience or audiences and essential considerations such as language and accessibility that relate to them. Consider all your possible audiences - customers, visitors, employees, and more. For example, it is common to share information with multiple audiences. What - Consider what types of information your audience needs. What information will improve their experience, reduce stress, or enhance decision-making? Ensure you incorporate as much real-time information as possible into your digital signage. Where - Think about where your audience will be when they need information. Are they at their desk, on the move, or perhaps in a public setting? You can easily share information on digital signs, mobile phones, tablets, desktops, and more. Choose a mixture of screens that reflect the needs of your audience. When - Are you sharing critical real-time information, or are you sharing branding and advertising information? The type of information you share on your digital screens will impact the frequency and how it is shared. Critical real-time information must be communicated immediately; such as changes to flight information in an airport or emergency notifications. Then, create a scheduled rotation for other information like news, corporate branding, advertisements, social feeds, and more. Why - Consider why you want to share a particular piece of content or information. Make sure the content you share improves the experience, reduces stress, or enhances the knowledge of your audience. The answers to Who, What, Where, When, and Why will drive your digital signage and content strategy. Second Step - Content Now it is time to think about the content you want to have on your screens. What types of content are you currently sharing with your audiences? Common types of content include news, weather, policies, schedules, social media, corporate branding, advertisements, KPIs, and emergency notifications. Currently, you may be sharing this information via emails, newsletters, intranet sites, or even printed documents. Create a list of topics you want to share and which screens you want to share the information on to get started. For example, you might like to share company policies, HR announcements, welcome new employees, or recognize outstanding work in an office environment. While in an airport, you might want to share information like scheduling, gate location, wayfinding/directional information, or advertising. As you consider the information, think about the order in which it should appear. Create a final content list that includes the content source and file type. Third Step - Visual appearance Now that you know the content you want to feature, it is time to think about how the screens will look. It is essential to consider what additional elements to include on the screens. For example, branding and logos, corporate colors, date and time, news and weather, social media feeds, traffic reports are all commonly incorporated. These elements will form the static part of your template. Fourth Step - Visual elements Start gathering all of the necessary visual elements and media assets you will need for your digital signage. For photos, make sure the image quality is high, and the resolution is large enough to match the screen resolution at least or exceed. For video, consider how long your audience will be viewing your screens; generally, shorter is better. Also, consider resolution - are your screens all standard HD, or are they 4k? If possible, compile a list of the visual elements and the file types. Then, make sure your content management system can handle the files. Fifth Step - Data Consider your existing data sources and how to integrate them with your digital signage. Data may come from internal software systems, external feeds, IoT devices, etc. How easily can data be updated, and how is it best represented on screen? For example, can you convert a rainy forecast into an icon for rain on your screen, or can you highlight a low KPI measurement in red? It is essential to think about how the social feeds will be filtered when integrating social media. Corporate content is relatively safe, but followers and hashtags need to be screened for language and messaging. Sixth Step - Personalization Examine your desired content in the context of your audiences and form a matrix plan for your digital screens. For example, do all of your screens need to see the same information, or should you tailor certain information to specific screens based on criteria like the location? Consider changing up designs by section and use visual cues, such as color, title, layout change, to enable people to locate the content they need quickly. Additionally, consider whether you need full-screen takeovers to highlight critical information in your organization. Learn more about design practices for digital signage in our blog.

Digital Design Trends 2022

Why Trends Are Important Trends are something that reflects the world currently. You can look back at each decade – the 70s, 80s, 90s, and spot the trends in everything – music, design, visuals, colours, fonts. Design touches every aspect of our lives, whether it's product design, interior design, graphic design – everything we interact with is first an idea. Looking at design trends helps us understand what is going on in the time we're living in and what has come before, and they can also help us predict what is to come. Usually, at the end of a year, there are a lot of lists published around the latest design trends for the upcoming new year. Color Trends A few sites have picked calm, cool colors as the hot color choices of 2022. Pantone – Color of the Year You can't discuss color trends without talking about Pantone. They are the leading authority on all things color, and they started issuing a color of the year in 2000. This year's color is Very Peri, a type of periwinkle blue. Pantone provides an excellent overview of the selected color and other interesting information. The great thing about Pantone is they also show what colors you can mix it with and provide pallets. Download the pallets from Pantone Connect. If you use Adobe design programs, you will find the Pantone color library built-in. Shutterstock Shutterstock is a stock site used by designers around the world. They publish a list of color trends based on designer purchases every year. It's pretty cool, as they use an AI and go through "billions of bits of data" to show what colors the design world is using. In addition, their methodology makes it unbiased, as it's just collecting information from images purchased on their site. For 2022, they are predicting some calmer, soothing colors will take center stage – calming coral, velvet violet, pacific pink, and green, to name a few. In 2021 Shutterstock's AI system found green dominated click-through rates and conversions. It's insights like these that make Shutterstock's trend lists more substantial and relevant. Also worth noting, Shutterstock highlights the top color in countries worldwide as a part of this list, so check and see what is trending in other regions. Font Trends This year, I see several font trends, including Serif fonts, large typography, flexible typography, text with gradients, transparent text, outline text, and mixed-width. Great sites to check out for fonts - MyFonts, Design Shack, and Shutterstock. Shutterstock provides a Font Trends list. Although not generated by their AI but rather by a team of designers, it's still a great list to compare with other font trend lists around. Serif Fonts - Many trend lists are predicting serif fonts are making a comeback. But, of course, sans-Serif fonts have been the norm for a while now, prevalent in mobile apps and websites. So seeing some simpler, less ornate, serif fonts is no real surprise. Large Typography - In this situation, bigger is better! Extremely large typefaces are grabbing attention and creating a wow factor. But, of course, how big it is will depend on where you are using it. Flexible Typography - Using flexible typography allows designers to play with individual letter height and width. Late 19th century's gothic typefaces inspire it. Text with Gradients - A gradient is a progression of colors. It allows designers to create a unique look and feel. Combine your fonts with a gradient to grab attention. Transparent Text - Allow your background images to show through by using transparent text. With this style, you should surround the text with a block of solid color to show the letters. Outline Text - This is typically used with Sans Serif fonts and paired with all caps. Draw attention to specific words by pairing outline text with solid lettering. Mixed-width - One new typography trend many people highlight this year is mixed-width type. Mixed width type is just what it sounds – typography where the width and even height of the letters are mixed. Mixed width fonts allow designers to set the height and width of each letter. By some examples, you can see that it's a very distinctive look that stands out. Design trends Now let's look at overall design trends. What kinds of things are people predicting will be in demand in 2022? We've looked through the lists and pulled what we thought would be most applicable to digital signs. Motion Motion seems to be the most significant trend, and rightfully so. More and more, content is being viewed on a digital platform, whether it's a phone, tablet, or digital sign. Additionally, online platforms are making it easier for people to create videos. In this day and age, where practically everyone can view a video at any time, static images can't compete. Motion draws people's eyes to your screen and content. On digital signage, subtle movement can have a huge impact. Consider incorporating semi-transparent text or a logo over the top of your video to grab attention subtly. Also, play around with zoom effects. The 90s Yes, the 90s appear to be back, from symbols and icons to colors. Minimalist design was popular when mobile apps first came out in the early 2000s, but now color and complex imagery are being used. With so much design focused on mobile apps in the last decade – which also brought some rather strict conventions around usability – it's refreshing to see the 90s design ethos becoming popular again. Organic shapes Go back to the basics and nature with organic shapes and neutral colors. Instead of precise lines and geometric shapes, consider using curvy lines to give your visuals a more natural and organic feel. Geometric shapes have a very rigid look and feel, impacting how your audience perceives your business. In comparison, organic shapes in the visuals on your digital screen could allow you to create a more open and inviting environment.

The Omnivex Digital Signage Holiday Wishlist

That's right; it's that time of year again - the most wonderful time of the year - the holidays! And since it's the holidays, we thought it would be a perfect time to go over our Digital Signage Holiday Wish List. It's a list of must-have features to make managing digital signage and communications easier every day (we like gifts that keep on giving). So, what would make managing a digital signage system easier? Grab a cup of eggnog, and read on!   10 - User Management - Digital signage usually involves a lot of people; writers, designers, motion graphic artists, network administrators, programmers, to name a few. The ability to control what a user can do in the system is essential.   9 -  Content Scheduling - Successful digital signage solutions involve getting the right content in front of the right people at the right time.  You need a system that allows you to schedule content by date, time, and location.   8 - Remote Player Management - Your digital signage network likely spans many locations and has multiple players. Managing players remotely is a critical component of a solid digital signage solution.   7 - System on Chip Screens - SoC Screens are becoming increasingly popular. So having a software platform that allows you to manage SoC screens makes sense.   6 - Intelligent Playlists - Optimize your digital signage delivery with data. Use intelligent playlists with conditions and rules to make managing your network easy.  5 - Real-time information - The benefits of a system that allows you to use real-time data are immeasurable. Nothing helps you get the right content where it needs to be - in front of your audience - than real-time data. 4 - Data Integration - We have multiple tools and information sources in our day-to-day work. A digital signage system that integrates data from multiple sources into one easily accessible platform is essential. 3 - Connect to IoT Devices - The Internet of Things has definitely made its way into our lives (Smart Refrigerators!). When you connect the Internet of Things (IoT) with digital signage, the possibilities are endless. Integrate room sensors, smartphones - the list goes on - into your digital signage for a better experience.   2 - Push Information to any Screen - What is a digital sign? Or better yet, what can be a digital sign? We all have smartphones and tablets. Incorporating these devices into your digital signage network broadens your reach. 1 - Quickly and Easily Share Content - A digital signage network that includes digital signs, kiosks, smartphones, real-time data, and is IoT enabled allows you to quickly and easily share the latest content with your audience.   

Accessibility & Digital Signs - Part 4 Accessible Design

Accessibility & Digital Signs - Designing Digital Signage for Everyone PART 4: Accessible Design When thinking about accessible design interactive kiosks often come to mind. Interactive kiosks offer designers a lot of options when it comes to accessibility. In the last infographic, we talked about what you should know and consider before setting out to design an accessible solution. In this part, we’ll look at how design can help make your kiosk accessible. MAKE YOUR KIOSK EASY TO USE - ICONS, CONTRAST & FOCUS If you’ve ever used an interactive kiosk and been a little unsure what to tap next, then you’ve experienced a bad interface design. Good UI design is vital to a positive user experience, no matter who the user is. You can make the user experience better for those with disabilities by adding a few features. AN ACCESSIBLE OPTION Omnivex Moxie software enables you to easily create a solution that allows the user to customize how the screen looks. Let’s start with making an accessibility option. This is as simple as adding a button that says ““Accessibility””, or even better, using an icon. Icons are a universal visual language (more on that later) and, from a design standpoint, much more visual and can save space. A symbol or icon or the word ““Accessibility”” - both are good ways to identify there’s something here to make this experience better. HIGH CONTRAST OPTION So what are some options and controls you can add to your Accessibility menu? Features that help with the most common visual impairments are a good place to start. Again, use an icon, letters, or both. Providing people the option to adjust the contract so they can more easily read, adds a lot to their user experience. It’s easy to build layouts in Moxie and data-bind properties, such as background, fill color, text color, and be able to switch modes around at the press of a button. ADJUSTABLE FONT SIZE Add some options to adjust the font size. Predefined sizes, such as Regular, Medium, Large give you more control. But you can also add buttons that increase or decrease the font size with each tap, and set a limit on the largest font size possible, just so your overall design is still usable and cohesive. Ideally, your design will already . COLOR SCHEMES Color to a computer is just a hex code, and with Omnivex Moxie software, it’s very easy to data-bind the color of elements in your design and have those values change with the tap of a button. So why not have some more color schemes for those who see color differently? Whether it’s a black and white mode or a color-safe mode. Blue and orange is a good color combination for people with color blindness. Blue is a great color to use, as it usually looks like blue to most people dealing with color blindness - so blue and orange, blue and brown are good choices. Avoid red and green, green and brown, green and blue. USING ICONS - ICONS ARE A UNIVERSAL VISUAL LANGUAGE A famous American graphic designer, Paul Rand, created a version of the IBM logo with icons, visually lining up an image of an eye and a bee before the letter M, in the same characteristic style as their iconic logo. It’s a famous example of how we can use icons to communicate. Icons are great to use in kiosks, and they can help with accessibility. Just remember to use icons that are universal - don’t make people guess what they mean. And remember - all the rules of color and contrast apply to your icons as well! Don’t use an icon that will be difficult for people to understand. When using icons that are universal, such as an accessibility icon or an emergency exit icon, try to keep the colors consistent, so they are instantly recognizable. Don’t change something that’s not broken. DESIGNING WAYFINDING APPLICATIONS FOR KIOSKS - MAKE SURE THE DIRECTIONS ARE ACCESSIBLE Wayfinding kiosks are a very common digital signage solution that is widely used in shopping malls, campuses, and large facilities. Wayfinding kiosks guide people to where they need to go, so make sure the directions you provide are accessible. If people have to use stairs to reach certain destinations, point out in the directions the route is not accessible. Or think about labeling the buttons for accessible destinations - this will clearly tell the user which routes are accessible and which routes are not. View PDF of interactive design infographic!

Accessibility & Digital Signs - Part 3 Interactive Design

Accessibility & Digital Signs - Designing Digital Signage for Everyone PART 3: Interactive Design When designing solutions for interactive kiosks, you have a bit more flexibility to customize and personalize the user experience, making the solution more accessible for everyone. With kiosk solutions built using Omnivex software, you can easily add options to move menu buttons to more accessible areas, integrate a high-contrast color option, or allow users to increase font size. MAKE YOUR KIOSK ACCESSIBLE - PLACEMENT MATTERS! Before you start designing your interactive digital signage solution, it’s a good idea to find out how it will be used. What kind of display? Will it have a portrait or landscape orientation? What kind of enclosure will it be encased in? For wheelchair accessibility, kiosks that are sloped, usually between 15 degrees and 20 degrees, are generally recommended. Sloped kiosks at this angle are generally easier to use. When a person is seated in a wheelchair, the maximum height for a safe forward reach is 48 inches. If using a standing vertical kiosk without any slope, ensure your design doesn’t require the user to reach higher than 48 inches, or lower than 15 inches. Know where it’s going to be, what the kiosk is going to be standing on, and determine where on your touch-screen your accessible area is. If mounting a touch-screen on a wall, make sure it does not protrude more than four inches from the wall. The minimum height should be 27 inches and the maximum height should be 80 inches. ALSO NOTE that these guides change slightly depending on whether there is an obstruction in front of a kiosk so, like any design project, get as much information up front as you can! MAKE YOUR SCREEN OPTIONS ACCESSIBLE This is where finding out all the information on placement, kiosk model, the environment it will be placed in - can be put to use to designing an interface that everyone can use. Let’s start with the accessible part of the screen. We know the maximum safe forward reach of someone sitting in a wheelchair is 48””, so it’s important that any options on the screen a user will need to tap are within the accessible 48”” area.   View PDF of interactive design infographic!

Accessibility & Digital Signs - Part 2 Typography

Accessibility & Digital Signs - Designing Digital Signage for Everyone PART 2: Typography As designers, it’s important to know who we are designing for. Who is our audience? Most importantly, who is our client’s audience? When thinking about typography and accessibility, think about how it may look to someone with a disability, whether they are visually impaired or dyslexic or any other disability, and how you can use your design skills to make your design more accessible. WHAT FONT SHOULD YOU USE? KNOWING YOUR AUDIENCE IS KEY There’s really only one rule when selecting a typeface to use - know your audience. If you have a brand guide, then someone has determined the font you should use, and they’ve done that by doing the research into your brand’s audience and messaging and determining the font that best aligns with your audience. So stick with your style guide’s font. If you are able to select a font, or trying to determine what font to use, then where do you start? The ADA does not offer a list of compliant fonts, but rather offers guidelines. Fonts used in signs should be sans-serif, with limited styles - no italics or obliques. Script and decorative typefaces are also not recommended. Decorative fonts can be fun, and they can be great to use in ads for events or products - again, know your audience. If you are creating a sign that communicates information to the public, such as directions, wayfinding, regulations, etc., then it’s best to choose a font that meets accessibility requirements. WHAT MAKES A FONT ACCESSIBLE? IT”S MORE THAN JUST A TYPE You’ve probably heard this piece of advice before (we’ve already said it above, in fact) - when designing for accessibility, it’s best to use a sans-serif font. And it’s sound advice. ADA standards state that public-facing signs should use a sans-serif font. But what makes sans-serif fonts more accessible? And are all serif fonts equal when it comes to accessibility? INDIVIDUAL CHARACTER RECOGNITION It’s not as simple as just choosing a sans-serif typeface over a serif typeface. That’s important, but choosing the right sans-serif typeface helps. The design of characters in a typeface go a long way in determining a font’s accessibility. Avoid typefaces that use mirror opposites for some characters as well - lowercase letters d and b tend to mirror, as do lowercase p and q letters. Typefaces that have distinguishing characteristics in these letters are more accessible. ASCENDERS & DESCENDERS AND WHY THEY”RE IMPORTANT If you’re a typography geek, you know what ascenders and descenders are. But if you’re not, ascenders are the parts of lowercase letters that extend beyond the x-height of a font. Descenders are parts of characters that descend below the baseline. For people with disabilities, some letters can be confusing. Properly designed characters with prominent ascenders and descenders aid in legibility, as they help make their characters easily identifiable. Selecting a font family with distinct ascenders and descenders is a great place to start. KERNING FOR ACCESSIBILITY - ADJUSTING THE SPACE BETWEEN We can’t talk about the importance of unique character design without also talking about the space between letters in a font. Kerning is the space between your letters and, just like uniquely designed characters, can help a great deal with your design’s legibility. Tight kerning typically results in a lower legibility. Letters lose their uniqueness and the separate letter shapes become harder to visualize and distinguish. In extreme examples, such as the one above, people without disabilities would experience reduced readability. Font designers spend a lot of time designing their characters, but when deciding on a font, check the natural spacing between the letters, and look at how some letters naturally line up with each other. LINE HEIGHT AND LINE WIDTH In addition to the space between letters being important, the space between line in a paragraph is also important. Try to use line spacing of at least 1.5 times the font size. While paragraphs of text are not common in most digital signage applications, they do exist, especially in news story feeds and some types of announcements. Also, try to keep the width of your lines between 40 and 55 characters when laying out. View PDF of typography infographic!  

Accessibility & Digital Signs - Part 1 Color in Design

Accessibility & Digital Signs - Designing Digital Signage for Everyone PART 1: Color in Design There’s a lot to think about when it comes to creating accessible digital designs. If part of our design isn’t clear or visible to part of our audience, then why is it there? Part of designing with color is using color correctly so that the key message is clearly legible to everyone. Setting proper contrast between elements in your design helps, so let’s take a look at a few tips on how you can use color to improve the accessibility of your designs. CONTRAST RATIO - CONSIDER CONTRAST WHEN USING COLOR Contrast is the difference in perceived brightness (or ““luminance””) between two colors. When dealing with multiple objects, such as letters on a background, it is expressed as a ratio, and ranges from 1:1 to 21:1. The ratio helps you determine how legible your text is. This is a standard used extensively in website design, and can easily be applied to digital signs. Check out the infographic below for more information and examples on contrast. HOW DOES COLOR BLINDNESS AFFECT YOUR DESIGN? AND HOW CAN CONTRAST HELP? There are three main types of color blindness - red-green, blue-yellow, and monochromacy. Red-green color blindness is the most common, and falls into different categories: Protanopia (people can see no shades of red), Protanomaly (people can see some shades of red), Deuteranopia (people can see no shades of green), and Deuteranomaly (people can see some shades of green). Check out the infographic below for more information and examples on color blindness and digital signage. SELECTING COLOR - SOME TIPS FOR SELECTING COLORS IN YOUR DESIGN  Focus on your contrast ratio - make sure your design meets the 4.5:1 ratio. Think of everyone when creating your design - avoid color combinations such as green and red, green and brown - think of the different types of color blindness and how your color combinations may be seen by someone with color blindness. Check your design against a color blindness simulator to see if parts are murky or hard to distinguish between one another. View PDF of infographic!

Typography Matters - Tips for Type in Digital SIgnage

Digital signage is a key to unlocking many doors. Better engagement, quick and simple information sharing, powerful wayfinding, and more are all at your fingertips - but only if you make the most of your innovative digital signage solutions with fonts that make best use of them. WHAT’S YOUR TYPE? SERIF & SANS-SERIF FONTS - it’s all in the name. Serif fonts have small projections (called ““serifs””) that finish a stroke of a letter. Popular in print, and generally considered easy to read, as the serifs guide your eye to the next letter. Sans-serif fonts do not have serifs at the end of a stroke. Popular in digital, as the clean lines of the letters are clear on a screen. Sans-serif fonts have become the go-to for digital communications, as it’s thought sans-serif fonts display better in pixels with their cleaner edges, making them easier to read on screen. Serifs typically didn’t render well in the early days of computing, but new technologies have changed that, and serif fonts are starting to be utilized more on screen. Still, sans-serif seems to be the more preferred font type for digital communications, and ADA guidelines do require all important text on signage to be in a sans-serif font, and readability most likely is the reason. FONT SIZE MATTERS - SCREENS & RESOLUTION & AUDIENCE - oh my! There’s a few things to think about when trying to determine a good font size to use for your digital signage. Unfortunately, there’s no magic font size that works best for every layout, as digital screens vary in size and resolution. So how do you decide what font size to set? Generally, it’s a safe bet that small text will most likely not be readable, as the audience for digital signs is usually a good distance away from the screen. Larger text is usually better and ensures your message gets out there. Most applications use points as the unit of measure for text. When designing for print, designers know that 72 points is equal to one inch on paper - which means a font set to 72 points will be one inch in height when printed. But digital layouts don’t use inches as a unit of measure, they use pixels. So how do you determine the size of the text in pixels? POINTS TO PIXELS - a simple calculation. If you want to figure out how high your text will be in pixels, there’s a simple formula you can use - multiply your font size by 0.722. This formula gives you the height of your chosen font size in pixels in a standard one-to-one pixel ratio. If you’re designing for a final resolution of 1920 by 1080, a one-to-one ratio means your layout is also 1920 by 1080. But knowing how many pixels high your font will be can help you with your layout. RESOLUTION - how many pixels are you dealing with? Resolution is the number of pixels in an image. Standard HD screens have a resolution of 1920 by 1080 pixels, and this is a common layout size for digital signs. Set your font size relative to your overall layout size, and remember -- larger text is more readable. KNOW YOUR AUDIENCE - make sure your message is seen. Knowing your audience is important to ensuring your sign is readable and your message is heard. How far away are they? How big is the screen they are looking at? All are important factors to consider when trying to determine an appropriate font size. TO CAPITALIZE OR NOT TO CAPITALIZE - USING CASING EFFECTIVELY - does it make a difference? Studies have shown that all uppercase lettering reduced reading times by as much as 20%. Other studies have shown all uppercase lettering is easier to read. So what do you do? If you want to use all uppercase text, go for it! Just be conservative, and use it for text shorter than one line, such as headlines or labels and dates. It will stand out and provide the impact you’re looking for. FONTS, FONTS EVERYWHERE - BUT NOT IN YOUR LAYOUTS - keep the number of fonts to 2, 3 max. Try to limit the number of fonts you use to two, three max. Using more will result in unnecessary visual clutter and a less readable sign. Try using a sans-serif for headings and a serif for body, or use different weights of the same typeface. LESS IS MORE - KEEP IT SIMPLE - reduce clutter in your copy. It doesn’t take a paragraph to say what you could communicate in one sentence.   View infographic as PDF.


Subscribe to RSS - Rich Archer's blog