IntuiFace Composer: A Beginner’s Step-by-Step Guide

How to Build Touchscreen Kiosks Using IntuiFace Composer

Overview

Building a touchscreen kiosk with IntuiFace Composer lets you create interactive, polished experiences without coding. This guide walks through planning, designing, configuring interactivity, integrating hardware, testing, and deploying a kiosk-ready experience.

1. Plan your kiosk

• Goal: Define the kiosk’s primary purpose (information, wayfinding, product showcase, check-in).
• Audience: Choose touch patterns and accessibility features for your users (age, tech comfort, height).
• Environment: Note lighting, noise, network availability, and kiosk orientation (portrait/landscape).
• Hardware: Pick a touchscreen display, PC/Player (Windows, i3+ recommended), optional peripherals (printer, barcode/RFID scanner, camera, speakers).
• Content inventory: List screens, assets (images, videos, PDFs), and data sources (local files, web APIs).

2. Set up IntuiFace Composer and project

• Install the latest IntuiFace Composer and the IntuiFace Player on your kiosk PC.
• Create a new Composer project and set the canvas orientation to match your display.
• Import assets into the Resources pane (images, video, fonts, audio). Use optimized formats: JPEG/PNG for images, H.264 MP4 for video, MP3 for audio.

3. Design your layout and navigation

• Use a simple, touch-friendly grid layout: large buttons (minimum 44–60 px tappable area), clear labels, and generous spacing.
• Create scenes for major states (Home, Menu, Details, Help). Use a consistent header/footer with branding and a Home button.
• Apply layering: Background image/video, interactive controls, overlays for dialogs. Lock background layers to avoid accidental edits.

4. Build interactivity with Triggers and Actions

• Use Triggers to start Actions when users interact (Tap, Double Tap, Drag, InRange for proximity).
• Common actions: Navigate to Scene, Play Media, Show/Hide, Run a Web Browser, Execute JavaScript (for embedded web content), Send HTTP Request (for APIs).
• Example: Home button Trigger — On Tap → Action: Go to Scene “Menu”.
• Use Variables to store session data (selected product ID, user-entered text) and reference them across scenes.

5. Integrate external devices and data

• Configure Device Services: IntuiFace supports many peripherals via built-in connectors (barcode scanners, printers, cameras) and SDK-based integrations.
• For web APIs, use the REST (HTTP) Action to fetch/update data. Map JSON responses to Variables or bind them to UI elements via Collections.
• For payment or secure data, use approved external services; avoid collecting sensitive info directly unless secured per regulations.

6. Optimize media and performance

• Reduce image resolution to match display pixel dimensions; use progressive loading for galleries.
• Keep videos short and pre-encode in H.264 with reasonable bitrate.
• Use Asset Streaming: host large assets on a web server and stream to the Player to reduce package size.
• Test on the actual Player hardware early to identify performance bottlenecks.

7. Accessibility and usability

• Provide high-contrast text and large fonts; test for readability at typical viewing distance.
• Include clear navigation cues, a persistent Home and Back, and timeout behavior returning to attract/idle screen.
• Add optional audio guidance and captions for media where appropriate.

8. Testing and QA

• Test touch targets, navigation flow, peripheral integrations, and network failure handling.
• Use Composer’s Preview, then deploy to a Player for full-device testing. Simulate edge cases: lost network, peripheral unplugged, and power cycles.
• Collect analytics (IntuiFace Analytics or external) to measure engagement and identify friction points.

9. Packaging and deployment

• Publish the experience to the IntuiFace Cloud or export and install on the kiosk Player.
• Configure Player startup: set the experience to auto-start, disable sleep/screensaver, and enable remote management for updates.
• Secure the kiosk OS: auto-login to a kiosk account, lock down OS UI (kiosk mode), and restrict access to system settings.

10. Maintenance and updates

• Use remote management to push content and experience updates. Schedule off-hours updates to avoid disrupting users.
• Monitor logs, analytics, and hardware status; plan regular hardware/software maintenance windows.
• Keep backups of your Composer project and version assets for rollback.

Quick checklist

• Define purpose, audience, environment
• Choose hardware and peripherals
• Create scenes and large touch targets
• Implement Triggers, Actions, and Variables
• Integrate APIs and devices securely
• Optimize media and enable streaming
• Test on real hardware and handle failures
• Deploy with auto-start and OS lockdown
• Monitor and update remotely

By following these steps you can create robust, user-friendly touchscreen kiosks with IntuiFace Composer that perform reliably in public environments.