Visual - SmartHome App for iPhone & iPad


Connect

  • Homematic
  • EZControl XS1
  • Philips Hue
  • HomeKit
  • MQTT
  • HTTP/JSON
  • HTML Widgets

Visualize

  • Elegant and Stylish
  • Versatile (values, texts, diagrams)
  • Grouping
  • Optimized for iPhone X OLED
  • Auto layout (screen size, orientation)

Control

  • Button
  • Switch
  • Slider
  • Color selection


Privacy Policy

Data collected

 

The following data can be configured by the user in Visual to enable the function of the app:

  • Configuration data for the external devices and web services (e.g., connection data, user names, passwords)

This data is only stored on the iOS device or synchronized via the user's iCloud account between iOS devices. The data will not be passed on to the developer or third parties. There is also no server-side data processing.

 

Personal data

 

Personal data (eg name, e-mail address, telephone number) will only be collected, stored and processed if you provide the developer with this data through an explicit e-mail request. The developer uses this data solely for the fulfillment and processing of your request or for the transmission of directly related information. Personal data will never be disclosed to third parties.

 

Advertising (only V1.0 to V1.2)

 

Visual provides advertising through the Google Mobile Ads Network (AdMob).

Depending on the user's iOS settings, the Ad-ID of the iOS device can be used to display personalized ads. Google's privacy policy applies (see here). The developer has no access at any time to the collected personal data.

 

In-app purchases and subscriptions

 

Visual offers a subscription via in-app purchase. With this subscription, the app will be ad-free. The subscription can be terminated at any time by the user in his personal iTunes account settings.

In-app purchases and subscriptions are handled through the Apple AppStore platform. The privacy policy of the Apple AppStore applies. The developer has no access at any time to the collected personal data.

 

Contact Person

 

Please direct questions to the developer of the app: me@andreas-binner.de


Manual

Rational

 

 

Visuals manages a so-called "Dashboard" which you can also see directly after the start of the app. The Dashboard is a vertically scrolling list of widgets . A widget can be a pure display or an operating element such as a switch.

 

 

The counterpart to the widgets are the "endpoints". An endpoint represents an external data source such as a smart home device or web service. All endpoints have the commonality of being accessible through the network.

 

 

Widgets and endpoints have one or more "ports". One port represents a dedicated data channel. Ports have one direction ("read only" or "read / write") and one type (boolean, integer, float, percent, data series, color, ...). For example, a weather sensor may have one port each for temperature and humidity ("read only" and "float" type).

 

 

A widget on the other side can also have exactly one port (eg a simple pointer display) or multiple ports for multiple data sources (eg a line chart). Also, controls can have multiple ports ("read / write") to output a value in different representations (eg, the color picker for RGB and HSV color space) or simply to send a value to multiple endpoints.

The Dashboard

The dashboard is the central view in Visual. From here you can also reach all important other views via the toolbar at the bottom.

  • Add a widget
  • Manage endpoints
  • Manage categories
  • General Settings

Grid

The dashboard displays the configured widgets in a fixed grid.Widgets can be up to 3 units wide and 2 units tall. The following 6 sizes are available (depending on the widget type):

Alignment

The dashboard automatically adapts to the screen size and orientation.

Here, the Apple-defined "size class" is crucial. So all iOS devices in portrait format have the size class "Normal". Landscape devices are either "Compact" (iPhones) or "Normal" (iPad, iPhone Plus).

 

In the class "Compact" the dashboard has a width of 3 units. In the class "Normal" the number doubles to 6 units.

Visual - Step By Step

(1) Create Endpoint

To do this, first open the endpoint manager in the dashboard. Add an endpoint by simply tapping on the "+" button and then selecting the appropriate entry in the list. The selection dialog can also be closed without adding, by tapping outside the dialog.

 

 

Currently, Visual supports the following endpoints:

 

  • Homekit
  • EZControl XS1
  • Homematic
  • Philips Hue
  • URL
  • Time of day
  • Yahoo! Wetter
  • HTML Widget

A detailed description of the individual types can be found in the chapter "Endpoints".

 

(2) Configure Endpoints

To configure an endpoint, simply tap the slider icon of the corresponding entry.

 

 

Depending on the endpoint type, there are different configuration parameters (see chapter "Endpoints").

 

 

All endpoints have the parameter "Name" to give the list entry a unique name.

 

 

Important: For all endpoints communicating with an external device or service, it is at least necessary to provide a URL or IP address.

 

 

After an endpoint connects, you can see the endpoint's ports. Simply tap on the endpoint name.

(3) Add Widgets

First enter the "Edit Mode" by tapping on the "Pencil" icon. Now tap on the  "Add widget" icon next to the category title. In the appearing dialog, tap on the corresponding entry in the list. The dialogue can also be closed without adding, by tapping outside the dialogue.

 

Note: If the dashboard is empty, the "Add widget" icon appears in the bottom toolbar!

 

The following widget types are available:

 

  • Gauge display 
    Display of a single value (with unit)
  • Text 
    Display of a single line of text
  • WebView 
    Display of HTML content (eg an HTML widget or an external website)
  • Selection 
    Select a single option from a list
  • Switch 
    Simple on / off switch
  • Keymatrix 
    Display of (up to 6) stateless buttons
  • Slider 
    Discrete slider controller
  • Color control
    Color display and selector
  • Button 
    Stateless button
  • Line diagram 
    Display of (up to 6) line charts

Affect widget order within a category

Select widget by tapping the title once. Now the position of the selected widget can be changed with the arrow buttons einte toolbar . Visual always tries to arrange the widgets within a category as compactly as possible (with few gaps). Therefore the position can't be chosen freely! 

(4) Widget konfigurieren

To configure a widget, just tap on the title of the widget in the Dashboard. Now the configuration dialog opens.

 

 

The following parameters have to be configured:

 

  • Name 
    The title of the widget
  • Size 
    A widget can take one of 6 sizes (not all sizes are allowed on all widgets!)
  • Categorie (or Tags)
    Widgets can be assigned to one or more categories. Widgets appear in the Dashboard in all assigned categories. 
    Attention: If a widget is no longer assigned to a tag, the widget will be deleted!
  • Connections 
    Here are all ports of the widget listed and it can be linked to an endpoint (or deleted)

(5) Organize Dashboard

There are several ways to influence the appearance of the dashboard:

 

    • Change the configuration of the individual widget 
      Some widgets have display options found in the widget configuration. To do this, tap the widget title as described in (4)
    • Change the order of the categories 
      To do this, tap the "Category" icon in the lower toolbar and change the order in the dialog by dragging and dropping it in the list. Here the categories can also be renamed.
  • Affect widget order within a category 
    In the dashboard tap on the icon to the right of the category title. In the dialog, the order of the widgets can now be changed using drag & drop. Important: Visual always tries to arrange the widgets within a category as compactly as possible (with few gaps). Therefore, the given order is only a hint!

Endpoints

Visual supports a number of endpoints, which are described below.

 

HomeKit

 

Provides all Homekit devices in Visual as an endpoint.

Important: Using this endpoint requires that you give Visual the permission to access Homekit devices!

 

EZControl XS1

 

The EZControl XS1 is a gateway for many wireless SmartHome devices. This endpoint allows access to all devices managed in the XS1. The following parameters have to be configured:

 

  • IP address 
    IP address of the XS1
  • Login 
    Login name (if assigned)
  • password 
    Password (if given)
  • Time interval for reloading 
    The data from the XS1 is periodically read out in the specified time interval (in seconds)

HomeMatic

 

This endpoint allows access to homematic devices. This requires a CCU or CCU2 gateway with installed XML-API patch. The following parameters have to be configured:

 

  • URL 
    URL of the CCU
  • Login 
    Login name (if assigned)
  • password 
    Password (if given)
  • Time interval for reloading 
    The data from the CCU is periodically read out in the specified time interval (in seconds)
  • Hide unreadable data points 
    Homematic data points that are unreadable are ignored

Philips Hue

 

With this endpoint you can access Philips Hue lamps. For this a Philips Hue gateway must be present. The following parameters have to be configured:

 

  • URL 
    URL of the Hue Gateway
  • Time interval for reloading 
    The data from the gateway is periodically read out in the specified time interval (in seconds)

Important: On the first start you will be asked to pair the app with the Hue Gateway. Please follow the instructions and press the pairing button on the Hue Gateway.

 

 

URL

 

This endpoint provides only one connection. This port provides a configurable URL. This can be used in conjunction with the WebView widget to display any web page in the dashboard.

 

Time of day

 

This endpoint provides only one connection. This port provides the current time as text. Currently, the only meaningful use is currently the connection with the text widget to display the time in the dashboard

 

OpenWeatherMap

 

The OpenWeatherMap endpoint provides connections for the current temperature, humidity, wind force and wind direction. In the endpoint configuration you can specify the location for the current weather data and your OpenWeatherMap App-Key.

Note: You need to register at OpenWeatherMap first and generate an App-Key. The registration is free.

 

HTML Widget

 

In this endpoint you can deposit an HTML widget. HTML widgets are usually intended for embedding into a web page. They can be found on the Internet eg many weather sides are offering HTML widgets. The HTML code is simply copied to the designated field in the endpoint configuration via "Copy / Paste". The port then provides a local URL that can then be linked to a WebView widget.

 

MQTT client

 

This endpoint allows to receive data from an MQTT broker

Important: It is assumed that the MQTT topics are formatted as a JSON object!

  • URL 
    URL of the MQTT broker
  • port 
    Port number of the MQTT broker (default: 1883)
  • Login 
    Login name (if assigned)
  • password 
    Password (if given)

Connections

 

Here you can configure up to 8 individual connections

 

  • Ident: Unique ID (please enter the MQTT topic here for the MQTT client!)
  • Value: value of the ports
  • Unit: unit
  • Name: Port name
  • Min: minimum value of the port
  • Max: maximum value of the ports

Static values can be entered directly in the fields. In most cases it is necessary to get the value dynamically from the JSON response of the brokers or web services. This can be accessed with a simplified "JSONPath" notation on individual JSON properties. The "JSONPath" must be entered in angle bracket (<...>).

 

Examples :

 

{

   "Name": "Mustermann",

   "Vorname": "Max"

}

 

<Name> returns 'Mustermann'

<Vorname> returns 'Max'

 

{

   "color": { "red": 1.0, "green": 0.2, "blue": 0.5 }

}

 

<color.red> returns 1.0

<color.blue> returns 0.5

<color.@keys> returns 'red, green, blue'

 

{

   "Fahrzeuge": [

       {"Typ": "PKW", "Räder": 4},

       {"Typ": "Fahrrad", "Räder": 2}

   ]

}

 

<Fahrzeuge.[0].Räder> returns 4

<Fahrzeuge.[1].Typ> returns 'Fahrrad' 

<Fahrzeuge.*.Typ> returns 'PKW, Fahrrad' 

<Fahrzeuge.@count> returns 2 

 

In addition, mathematical expressions in the fields can be used. To do this, start the expression with "=".

 

e.g.: 

 

=<color.blue>*100 returns 50.0

=<color.blue>*<color.green>*100 returns 10.0

 

 

HTTPJSON

 

This endpoint allows to retrieve data from any web service via HTTP (GET) call.

Important: It is assumed that the web service provides its data in the form of a JSON object!

  • URL 
    URL of the web service
  • Login 
    Login name (if assigned)
  • password 
    Password (if given)
  • Authentication Token 
    Authentication Token (if assigned)
  • Time interval for reloading 
    The data is requested periodically in the specified time interval (in seconds)

Connections

 

Up to 8 individual connections can be configured here (see section "MQTT Client" / Connections)

 

PVOutput.org

 

This endpoint reads data from the photovoltaic web service pvoutput.org

 

  • Time interval for reloading 
    The data is requested periodically in the specified time interval (in seconds)
  • System ID 
    System ID (taken from the personal PVOutput.org profile)
  • API ID 
    API-ID (from the personal PVOutput.org profile)

Global Settings

The global attitude currently includes

 

  • Treat iPhone X like Plus model 
    With this option enabled, Visual in landscape mode on iPhone X doubles the dashboard width from 3 to 6 units (as on iPhone Plus models)
  • About visual 
    Displays the version number and license notes
  • In-app purchases 

    Visual V1.0 - V1.2: In the standard version, Visual is free and displays ads at the bottom of the screen. If you want an ad-free dashboard, you can complete a monthly renewal subscription for € 1.49 here via In-App Purchasing.

    Visual V1.3: This version is ad-free by default. In addition a monthly subscription for € 1.49 can be purchased to unlock advanced features. Previous buyers of the Ad-Free subscriptions automatically get these features unlocked, too!
    The features mainly target users with Large SmartHome setups:
    • Search and filter datapoints
    • Import scenes (from selected endpoints)
    • Debug-Logging for all endpoints helps solving issues

 

Please support Visual with this in-app purchase for the cost of less than a cappuccino per month! Only then can Visual be further developed (new features) and maintained (new iOS versions). Thank you! 

Note: The subscription can be ended at any time in the personal iTunes settings! 

iCloud Sync

The entire visual configuration is stored locally in the app's sandbox and automatically synced to the user's iCloud account. That means any change in Visual will automatically be visible on all other iOS devices in Visual - as long as you're signed into the same iCloud account!

 

If you make changes on multiple devices at the same time, you get a conflict warning and you have to manually decide on a version.