UI Accessibility Plugin  Version 1.0.0
Make your UI accessible for visually impaired users
How To Guides

How-To Guides for all Occasions

This page provides How-To guides and solution for common problems and questions.

Table of Contents

NGUI Support
Select Focus Item
Using Swipes in Gameplay
Grid based Puzzle Games
Icons instead of Text
Custom UI Element Order
Using Text-To-Speech
Localization
Using a different TTS engine
Callbacks
3D UI Elements

Enable NGUI Support

The plugin supports NGUI, but support must be manually enabled.
Please read this page to learn how to set up UAP to work correctly with NGUI.

Select Focus Item

When opening any kind of menus, the plugin will automatically select the first element in the UI Group with the highest priority (if there is more than one UI group). From there the user changes the focus by swiping.
But you can manually set which item should be focused and provide a much smoother experience for the user by sensibly setting the focus point to a UI element.

You have two options to do this:

  1. All accessible UI elements (Label, Button, etc..) derive from the same base class (UAP_BaseElement) and all of them have a function called UAP_BaseElement::SelectItem(). If you already have a pointer to your accessible element (AccessibleLabel or similar), or want to get it, then the code would look like this:
    YourGameObject.GetComponent<UAP_BaseElement>().SelectItem();
  2. Alternatively, you can just pass a GameObject to the plugin and ask it to select it. It will find the accessible component on it automatically.
    In that case, the code would look like this:
    UAP_AccessibilityManager.SelectElement(YourGameObject);

Using Swipes in Gameplay

With the accessibility enabled, swipes are used to navigate the UI. But what if your gameplay needs to use swipes as well?
Instead of disabling accessibility completely, you can opt to just pause it instead. This will allow touch input directly through to your app instead - but it will still keep the TTS and the Magic Gestures intact.
Please see the documentation for UAP_AccessibilityManager::PauseAccessibility() for more information.

Grid based Puzzle Games

If your gameplay is based on a 2-dimensional grid, you might want to offer your players an alternative way of navigating the playing field.
Please take a look at the Match 3 Example and the documentation on how to set up 2D Navigation for your UI.

Icons instead of Text

Especially in mobile applications the amount of actual text is usually kept to a minimum. Instead, apps rely heavily on the use of icons.
This reduces the amount of localization that needs to be done. It also uses less screen space and it makes the app usable by younger children who can't read yet.

Here are some examples:

To make images like these accessible, you can use the Accessible Label component. But since these images have no text labels for the Accessibility Plugin to read, you need to provide a name for them manually.
Please see here on how to do this: UI Element Names

Custom UI Element Order

Sometimes the automatic traversal order is not what feels natural, or provides the best usability. Sometimes the dimensions of a UI element cause the wrong order. In any of these scenarios you can provide a manual traversal order instead.
Read here on how to set that up: Manual Traversal Order

Using Text-To-Speech

Sometimes you want to offer blind users additional information, since they can't grasp the entire view of the screen like a sighted user. You might want to announce the new total score after the player earned some points, or read out the remaining moves, or announce how many other cards of the same color are in the players hand.
Little efforts like these will make your game stand out in terms of accessibility!

You can use the Accessibility Plugin's Text-To-Speech system to read out this extra information for you. This will also make sure that the audio won't clash with any UI elements that are being read at the same time. Use UAP_AccessibilityManager::Say() to speak your additional feedback. Depending on the setting, you can have your output interrupt the current speech (if any), or wait and be queued. You can also determine whether you allow your text to be interrupted by the user (if he wants to skip it, for example).

Localization

All Accessible UI components offer the option to treat manually entered text as localization lookup keys.
This means the text will not be spoken directly as entered, but used as a lookup key to get a localized string back, which will then be read aloud.

When this option is checked, the plugin will call its internal function UAP_AccessibilityManager::Localize() before reading out the text.
NGUI: If you are using NGUI, the plugin will automatically use NGUI's internal localization system.
Unity UI: Unity doesn't have its own localization system, but you can hook the appropriate call to whatever plugin or system you are using on the function directly and return the localized result. This function is used for all localization calls, so you won't have to change any other code.

If everything is set up correctly, a preview of the translated text is displayed below the checkbox.
Note that this option is not available if the name text is read from a different label, as any such text would obviously already be localized.

Alternative Solution

You can always choose to fill in text into the name field of an accessibility component directly from the code.
That allows you to construct the content at runtime, and also to run it through your own localization system.
To do that, you can use the base class for all Accessible UI components: UAP_BaseElement.
Each class deriving from this has a "text" member which you can use to fill in the name text: UAP_BaseElement::m_Text

Using a different TTS engine

The UAP plugin ships with native TTS for Android and iOS, and supports SAPI and NVDA on Windows computers. On iOS the plugin can also use VoiceOver for speech output if it is running.
If you prefer to use a different TTS system, or use a different plugin for TTS, you can easily exchange the included TTS for your own. You can even exchange the TTS for just one platform, if you wish.
Each platform has their own TTS wrapper class. All calls from the plugin are routed through these classes to the respective TTS engines. To make the plugin use your own TTS, you just need to modify the functions inside this class to make the entire plugin work with the new system.
These are the files:

  • Windows: WindowsTTS.cs
  • Android: AndroidTTS.cs
  • iOS: iOSTTS.cs

Callbacks

Apps can register for various callbacks with UAP, to be notified of important events.
These events include the starting and stopping of the plugin, or special multi-finger gestures.
Please see the page on Magic Gestures for a complete list of events and how to register for them.

3D UI Elements

World Space UI elements in 3D space are not currently supported.
Support for this is on the roadmap, which can be found here: Support and Roadmap