Fonts (.WOFF Files) for Digital Signage

Fonts (.WOFF Files) for Digital Signage

All Vibe templates use Open Sans by default. While you can't add fonts through the Admin Console or Portal, the Vibe.fyi support team can assist. Once added, all templates will use your custom fonts.

Design Requirements

  1. Provide three font files in the following categories, and ensure variations like light, regular, bold, and italic are included to match your brand:
    1. Heading/Subheading (e.g., Open Sans Bold)
    2. Body (e.g., Open Sans Regular)
    3. Accent (e.g., Open Sans Italic)

  2. Font Licensing

    Please ensure that you have the appropriate web and display licensing for the fonts you are providing, especially for digital signage applications. Vibe.fyi cannot be held responsible for font licensing issues. You should only provide fonts that are licensed for commercial use and suitable for display on digital signage.

  3. File Format

    • Required Format: .WOFF (Web Open Font Format)
    • Ensure that your font files include the Latin-Extended character set to ensure proper display of diacritics and macrons (important for languages such as Māori).

    • Font Files Organization

      When submitting the font files, please organize them as follows:

      1. Clear Naming: Name the font files clearly to distinguish different styles (e.g., OpenSans-Bold.woff, OpenSans-Regular.woff, OpenSans-Italic.woff).
      2. ZIP Folder: If you have multiple font files, bundle them into a ZIP file to keep everything organized.

Considerations for Digital Signage Display

When designing for digital signage screens, there are a few key things to keep in mind:
  1. Resolution and Legibility: Digital signage screens, especially large-format displays, can have various resolutions. Make sure the fonts you choose are legible at different sizes and distances. 
  2. Optimized for Display: The font files should be optimized for screen display, as certain fonts that work well for print or web may not render well on digital signage screens. 
  3. Fallback Font – Open Sans: In case your custom font does not load, Open Sans will be used as the fallback font across all templates. 
  4. File Size and Performance: Digital signage systems often have performance constraints, so it’s important to keep the font files as lightweight as possible.

3rd Party Resources for Font Conversion

  1. CONVERT: https://www.fontsquirrel.com/tools/webfont-generator
  2. TEST: https://fontsee.com/
    1. Use the following example text to check if macrons and special characters display correctly:
      1. "Quīck brown fōxes jump ōver the lāzy døg."
        "Æthelred, the ancient historian, discovered a mysterious text: 'Café, naïve, résumé, déjà vu.'"
        "Special chars: @ # $ % ^ & * ( ) _ + = { } | : ; < > ? ~` / \ !" ' , . ; : " ' "
        "Numbers: 1234567890"

    2. This includes:

      1. Diacritics and accents (like ī, ū, ā, ō)
      2. Special characters (like @, #, $, %, &, *, etc.)
      3. Punctuation (like " ' , . ; :)
      4. Uppercase and lowercase characters in different languages
      5. Numbers to test all font-related characters

      This example will help ensure that all characters in your font file are properly rendered across different platforms and languages.

Ensuring Full Language Support:

If you're working with a language that requires a broader set of characters (e.g., Cyrillic, Greek, Arabic, Hebrew, etc.), you should consider checking for the specific Unicode block that supports these characters.

For example:
  • Latin-Extended-A and Latin-Extended-B cover many European languages.
  • Greek and Coptic characters are in their own Unicode block.
  • Cyrillic characters have their own Unicode block as well.

If your custom fonts are meant to support a wide variety of languages, it might be important to check that they support the complete Unicode set (which includes characters from all scripts, not just Latin-based).

What to Do:

  • Verify that the font you're using supports the necessary characters for all the languages your signage might display.
  • Test using comprehensive sample text that includes characters from the specific languages your system needs to support (including accented letters, special symbols, and any non-Latin characters).

By doing this, you can ensure full language support and avoid any rendering issues on the signage.

Additional Notes for Designers

  1. Test Legibility on Different Screen Sizes:
    Ensure your fonts are legible across different screen sizes and viewing distances. Check font readability both up-close and from a distance on your specific signage hardware.
  2. Ensure Proper Spacing and Alignment:
    Fonts can appear differently on digital signage screens due to their resolution and pixel density. Test how your fonts appear at different sizes to ensure proper spacing, kerning, and alignment across various display setups.
  3. Fonts for High-Resolution Displays:
    If your signage uses high-resolution displays, ensure the fonts are compatible with these screens and retain their crispness when viewed at larger sizes.

How to Change the Theme Font for Digital Signage

To update the font used in your digital signage theme, send your font files in the correct .WOFF format (as outlined above) to the Vibe.fyi Support team. We will verify the font files for compatibility with your digital signage setup, ensuring they are optimized for display and update your theme accordingly.

    • Related Articles

    • Colours (Backgrounds & Fonts)

      Applying brand colours to your default Theme will ensure that your slides are on brand every time. Theme colours will be applied to all slides, when a slide is newly installed and also when 'Theme on' is selected within the attributes. But as all ...

    • Backgrounds

      Vibe Templates are linked to a pool of background images associated with your Theme, which are applied to all slides by default. However, since all slides are customizable, you can individually adjust the background by uploading a custom image for ...

    • Why Benchmarking Matters

      Success with Vibe starts with knowing where you’re at before you launch. Identify your top 3 objectives for your Vibe channel and measure how well you’re achieving them. Key Steps Survey Your Team: Before launching, survey employees on their current ...

    • Start using Vibe like a pro!

      We're super excited to get you started and using Vibe like a pro. Hint: It’s super simple! Produce visually stunning content with ease We've streamlined the process, making it easy to produce slides that are on-brand and captivate your audience ...

    • Information Bar

      Check out our pricing plan to see if you have access to make changes in Information Bar settings Use the admin console tools to tailor the default info bar theme design and tailored design by location. Information Bar Theme Edit Information bar Theme ...