Unreal Engine Integration

Visualize live Thingsee IoT data in Unreal Engine 4 for gamification and demos

Connect live IoT data to Epic’s Unreal Engine for next-level visualizations, gamification experiences, and impressive demos.

Overview

Connecting Thingsee IoT data to Unreal Engine enables:

  • AR/VR visualizations of sensor data
  • Digital twins with live data feeds
  • Gamified dashboards for engaging presentations
  • Interactive demos for marketing events

Architecture

%%{init: {'theme':'base','themeVariables':{'primaryColor':'#73F9C1','primaryTextColor':'#143633','primaryBorderColor':'#143633','lineColor':'#143633','secondaryColor':'#C7FDE6','tertiaryColor':'#F6FAFA','clusterBkg':'#F6FAFA','clusterBorder':'#143633'}}}%%
flowchart TB
    subgraph Visualization["Visualization"]
        ACTOR[Your Actor]
        UE[Unreal Engine]
    end
    
    WS[WebSocket Server]
    T[Thingsee Cloud]
    
    T -->|HTTP POST| WS
    WS -->|WebSocket| UE
    UE --> ACTOR

Requirements

Software

ComponentVersionNotes
Unreal Engine4.25+Download from Epic Games
EasyWebsocket PluginLatestPaid plugin from Marketplace
VARest PluginLatestFree plugin for JSON handling

Data Pipeline

  1. WebSocket server (e.g., Node.js) to receive Thingsee data
  2. Thingsee Cloud integration configured to forward data to your WebSocket server

Installation

1. Install Plugins

In Unreal Engine:

  1. Open Edit → Plugins
  2. Search and enable VARest
  3. Search and enable EasyWebsocket
  4. Restart the editor

2. Import Thingsee Blueprints

Download and import these blueprints to your project:

  • ThingseeMessageDispatcher
  • ThingseeMessageInterface
  • ExampleActor

Copy files to your project’s Content folder and import as assets.

3. Create Your Actor

Create a new Actor that implements ThingseeMessageInterface:

  1. Create new Blueprint Class → Actor
  2. Open Class Settings
  3. Add Interface: ThingseeMessageInterface
  4. Implement the interface functions

Or use ExampleActor as a starting point.

4. Set Up Your Level

  1. Add ThingseeMessageDispatcher to your level
  2. Add your actor (or ExampleActor) to the level
  3. In Level Blueprint, initialize on Event BeginPlay:
    • Register actors with the dispatcher
    • Connect dispatcher to WebSocket server

Blueprint Setup

Level Blueprint

Event BeginPlay
    |
    ├─→ Get ThingseeMessageDispatcher Reference
    |
    ├─→ Register Actor
    |      - Actor: Your Actor Reference
    |      - TsmTuid: "TSPR04E2O90201558"
    |      - TsmId: 12100
    |      - PropertyName: "temp"
    |
    └─→ Connect to WebSocket
           - URL: "ws://your-server:8080"

Actor Registration

When registering an actor, specify:

ParameterDescriptionExample
TsmTuidDevice identifier"TSPR04E2O90201558"
TsmIdMessage type12100
PropertyNameProperty to watch"temp"

Handling Data

Implement DidUpdateFloat() in your actor:

Function: DidUpdateFloat
Parameters:
    - TsmTuid (String): Device identifier
    - TsmGw (String): Gateway identifier
    - TsmId (Integer): Message ID
    - TsmTs (Integer): Timestamp
    - PropertyName (String): Property that changed
    - PropertyValue (Float): New value
    
Body:
    - Update your visualization with PropertyValue
    - Log or display the data

Example: Temperature Display

  1. Create an Actor with a Text Render component
  2. Implement ThingseeMessageInterface
  3. In DidUpdateFloat:
    • Format the temperature value
    • Update the Text Render component
  4. Register with TsmTuid, TsmId: 12100, PropertyName: "temp"

WebSocket Server Example

Simple Node.js server to relay Thingsee data:

const WebSocket = require('ws');
const express = require('express');

const app = express();
const wss = new WebSocket.Server({ port: 8080 });

// Store connected Unreal clients
const clients = new Set();

wss.on('connection', (ws) => {
  clients.add(ws);
  ws.on('close', () => clients.delete(ws));
});

// Receive Thingsee data via HTTP POST
app.post('/thingsee', express.json(), (req, res) => {
  const messages = req.body;
  
  // Forward to all connected Unreal clients
  clients.forEach(client => {
    if (client.readyState === WebSocket.OPEN) {
      client.send(JSON.stringify(messages));
    }
  });
  
  res.sendStatus(200);
});

app.listen(3000, () => {
  console.log('HTTP server on port 3000');
  console.log('WebSocket server on port 8080');
});

Testing

Verify Connection

  1. Play your level
  2. Check Output Log for connection messages
  3. If using ExampleActor, you should see logged data

Test with Demo Data

Use the Open MQTT Data demo sensors to test your integration without needing your own hardware.

Known Limitations

  1. Single actor per combination - Only one actor can register for each tsmTuid + tsmId + propertyName combination
  2. No authentication - Current implementation has no WebSocket authentication; use only in development environments
  3. Timestamp note - TsmTs in DidUpdateFloat is when the dispatcher received the message, not the original measurement time

Future Possibilities

  • Direct Thingsee Open Services API integration using VARest
  • Direct MQTT connection for real-time data
  • Firebase integration using EasyFirebase plugin
  • Production-grade authentication

Use Cases

Digital Twin

Create a 3D model of your building with sensors visualized:

  • Color-code rooms by temperature
  • Show occupancy as animated indicators
  • Display air quality with particle effects

VR Dashboard

Build an immersive VR experience:

  • Walk through your facility virtually
  • Interact with sensor data in 3D space
  • Collaborative viewing for remote teams

Marketing Demo

Create eye-catching demos for events:

  • Real-time data from office sensors
  • Interactive visualizations
  • Gamified elements (achievements, animations)