TIN/DOT User Feedback Config and Presets

TIN/DOT User Feedback Config and Presets

We’ve updated our preconfigured UI Feedback for TIN to improve the Tire Identification Number (DOT) scanning experience. It includes:

  • A TIN/DOT cutout overlay guide that adapts to orientation (normal / upside-down).

  • A customizable instruction label above the cutout.

  • Configurable images, text, and sounds for conditions such as alignment, brightness, distance, and format/content.

The TIN/DOT UI Feedback is available in the Mobile SDK (Android, iOS) and our cross-platform plugins (.NET (MAUI), Cordova, React Native, Flutter).


TIN/DOT User Feedback Preset, Plugin Parameters, and Attributes

What’s new (SDK 55.7.0)

  • New TIN/DOT plugin parameters:

    • horizontalAlignmentRatio – Enforces left/right alignment of the detected text inside the cutout.

    • detectionMinHeightRatio – Enforces a minimum text height (i.e., distance) before scanning proceeds.

Please see “Alignment & Distance Checks” in the Technical Documentation for further details and recommended values.

  • New TIN/DOT Preset:

    • tin_with_instruction_oriented_overlay_image_text_sound_feedback - Orientation-aware overlay + improved guidance assets.

  • New TIN/DOT attributes:

    • cutout_overlay_upsidedown_image - Switches the TIN/DOT Overlay upside-down for scanning.

    • alignment_alignleft_image / alignment_alignright_image - Visual prompts to align the TIN/DOT within the DOT cutout overlay (right-side up / upside-down).

    • alignment_alignleft_sound / alignment_alignright_sound- Optional sonic prompts for the same alignment guidance.

  • Deprecated:

    • tin_with_instruction_overlay_image_text_sound_feedback is deprecated. Please migrate to tin_with_instruction_oriented_overlay_image_text_sound_feedback to continue using UI Feedback for TIN/DOT.

IMPORTANT LIMITATIONS (READ FIRST):

  • Internal presets: UI Feedback Config is available for use with internal presets only.

Additional Guidance

Like the previous preset, the new preset includes a set of ready-made feedback images (lighting, distance, format/date, etc.) that appear below the cutout. You can optionally add text and sounds per condition.

uifeedback_default_moveback-20251029-105332.png
uifeedback_default_movecloser-20251029-105411.png
uifeedback_default_toobright-20251029-105425.png
uifeedback_default_toodark-20251029-105440.png
uifeedback_tin_dot_alignleft-20251029-105452.png
uifeedback_tin_dot_alignright-20251029-105511.png
uifeedback_tin_wrongformat-20251029-105736.png
uifeedback_tin_dot_cutout_normal-20251029-105527.png
uifeedback_tin_dot_cutout_upsidedown-20251029-105615.png

 


TIN/DOT User Feedback Config Explained

Depending on your use-case, you may need to adjust both your Plugin Config and UI Feedback Config:

Plugin Config

The pluginConfig parameter determines the module behavior and lives under the viewPluginConfig.
Add the new parameters here to enable alignment/distance gating:

{ "viewPluginConfig": { "pluginConfig": { "id": "Tire|TIN DOT Numbers", "tinConfig": { "scanMode": "DOT", "upsideDownMode": "AUTO", "horizontalAlignmentRatio": 0.11, "detectionMinHeightRatio": 0.36 } }, ..., ..., ... } }

UI Feedback Config

The uiFeedbackConfig defines which preset and attributes to show (instruction text, images, sounds) for the User Guidance Feature. It is nested inside the TIN/DOT viewPluginConfig. Use the tin_with_instruction_oriented_overlay_image_text_sound_feedback preset inside the uiFeedbackConfig for TIN/DOT scanning.

{ "viewPluginConfig": { ..., ..., ..., "uiFeedbackConfig": { "presets": [ { "presetName": "tin_with_instruction_oriented_overlay_image_text_sound_feedback", "presetAttributes": [ { "attributeName": "instruction_text", "attributeValue": "Align the DOT number with the cutout." } // add/override alignment, lighting, distance, and format/date feedback as needed ] } ] } } }

To have a full look at the new preset, plugin parameters, and attributes, you can check out the from our Examples Apps.

 

The uiFeedbackConfig is then divided into separate attributes:

Instruction Text is displayed above the cutout and gives the user a simple, actionable prompt (attribute: instruction_text). Change its value in uiFeedbackConfig to customize the default guidance.

instruction_text-20251030-084720.png
Instruction Text Attribute

DOT Overlays are shown inside the cutout to guide placement. Align the DOT number with the overlay and keep all characters inside the frame. Use both cutout_overlay_normal_image and cutout_overlay_upsidedown_image so users get correct guidance regardless of orientation.

overlays-20251030-085025.png
DOT Overlay Attributes

PLEASE NOTE:

DOT overlays are available only in the scanMode: "DOT" UI Feedback config. In UNIVERSAL, the overlay attributes are not used—leave them empty or omit them. Visual guidance in UNIVERSAL comes from the images/text below the cutout.

UI Feedback Images appear automatically based on current scan conditions—such as alignment, distance, lighting, or format/content checks—to guide users toward an optimal capture. These images are shown below the cutout.

ui_feedback_images-20251030-091023.png
UI Feedback Image Attributes

 

Additional Guidance Text (optional) appears below each UI Feedback image to clarify what the user should do (e.g., “Move closer”). These attributes are empty by default; set them in the preset only where extra clarity is helpful.

additional_guidance_text-20251030-091434.png
Additional Guidance Text Attributes

 

Sonic Guidance Prompts are optional audio cues that trigger alongside the matching UI Feedback image (e.g., alignment or distance hints). Provide a .wav file per condition by setting the corresponding *_sound attribute. Sounds help users who aren’t looking at the screen, but keep usage deliberate—reserve audio for the most important corrections and test with real devices/environments.

sonic_guidance_prompts-20251030-091804.png
Sonic Guidance Prompt Attributes

PLEASE NOTE:

You can replace the used for any prompt by setting the corresponding *_sound attribute to your file name. We’ll add a walkthrough video here when it’s ready.

 


User Feedback Layout

Horizontal UI Feedback Example Android Cropped-20251030-130401.png
  1. Instruction Text (for more information, please see above)

  2. DOT Overlay (for more information, please see above)

  3. UI Feedback Preset Image (for more information, please see above)

  4. Additional Guidance Text (for more information, please see above)

TIN/DOT User Feedback Example

Please see an example below of how our TIN/DOT User Feedback is used with a live example.

HorizontalUIFeedbackExampleAndroid-ezgif.com-optimize-20251030-134904.gif
TIN/DOT UI Feedback Example

 


Further information