Monday, November 12, 2018

A quick start for HSTouch Designer.

HSTouch Designer like all Homeseer software goes on sale for 50% regularly so keep an eye out for sales.

I've reused icons from various plugins here. For a more consistent look you might want to use icons from icons8.

There is a fair bit of help documentation online but I found I still needed to sort a few things out on my own.

First issue you might run into is it only seems to work on the Homeseer box. It is unclear why it will not connect to a remote Homeseer instance but seems not to be firewall related as it still fails with the firewall off and the HSTouch client works fine from all my Windows PCs I've tried it on which are supposed to be using the same ports. I also tried various compatibility options that did not help. Given this you probably want to install it on the same computer your Homeseer is on.
UPDATE: a week later I brought Designer up on my Windows 10 box just to look at something and saw the devices were populating so my previous issue might have been some sort of limited glitch that corrected itself with a reboot or upgrade in the last week.

Note too I found a lot of references to a HSTouch server and plugin which appear to be outdated. The server is included these days and does not show as a plugin. Instead just confirm it is enabled by bringing up your Homeseer web interface, selecting Tools -> Setup and then the Network tab. Near the bottom you will see the HSTouch options. Enable it if not already checked and adjust the other options as needed.


Next you need to either start with a template. The Android one seems a good one to start with. Especially if you are using Fire Tablets as consoles as I am. You might be happy with most of what is there and just want to remove a few thing you are not using like cameras or energy. For this example my cameras have their own dedicated consoles and video distribution system and I want an alarm status screen so I will swap that out.

In this case it is simplest to start with a new screen. To add a new screen choose File menu

Add a background by clicking on the screen and then selecting ImageBackground or just set the background color with ColorBackground.


To add a status icon for a device drag a device from palette onto the new screen.
Note in device picker dialog top selector is Category (Location 2 Label) and second is Room Location 1 Label). Only the Room one seems to filter while the other is ignored.

In the properties window click on StatusTrackingNormal and set similar to

Note you can start typing in the drop downs to filter the list. Resize the icon with With and Height properties


I suggest you copy the Appearance-Text property to Identification-Name (Label 084 in pic) to make finding elements easier. For status icons you probably want to set ColorPressed to transparent (top of color list) And remove the text is you are using status graphics located relative to each other.

Here is an example of a mix of icons with text and without.


Once you have a screen you can link it to the main screen. To keep it simple I'm just changing the camera button on the main screen First changing the ImageNormal and ImagePressed images to  Documents\HSTouch\Skins\Tabletop2\Graphics\windowclosed.png. Then change ActionsWhenPressed to go to your new screen. In this case "Alarm".

Here is my almost finished alarm screen.
Any red icon means a warning condition (motion or open door or window) making it easy to see where the problem is even though there is a ton of sensors on the screen with no labels in site. Other than the text status button at the bottom.

Note some of the status icons still need changed. They looks fine in the web interface with value set and no corresponding status icons they seem to default to the right ones. But here the icons chosen when not set seem to be random so you need to make sure each is set.

The background was grabbed from Google maps zoomed all the way in and rotated to fit best on screen.

Note too the back and home buttons. Though really you only need one or the other. Simplest way to add is to copy / paste from another screen.

No comments:

Post a Comment