Frontend design (printscreen sharing)

It's looking very nice, clean and sharp! Good work, I almost couldn't recognise it's bOS!

Also feel free to share it to our Examples so people can use it and make their home as pretty as yours.

Best regards, David

Hi Ricardo,

I really like your idea to share some printscreen ! I do find your really nice and simple to read... really good !

Here few of mine take from my computer interface (constantly evolving since few months...) :

Regards,

podzielisz się swoim przykładem i konfigurają pogody bo to nie jest pogoda bos

Hi Fabien. Your visualization looks great and neat. I would like to ask how you have achieved the battery icons to look relevant to charging percentage. Did you used "status values" to change the icons?

Great to see! That's the spirit!

I think that some of us are constantly changing the template, I speak for myself, every time I think of something new. So actually my template is quite changing also. Sometimes I like my template clean and simple, suddenly I go crazy!

Nice template Fabien, great use of custom images and icons! Keep up the good work.

Btw, how do you transmit the battery levels (for example your iOS devices) to bOS? Are you using any third party software?

Thanks a lot Ricardo...I really appreciate !

Well, regarding the iOS data, the only solution I found was to install the 'iCloud Binding' on an Openhab server (install under a docker container on a QNAP NAS). The data are then parsed over JSON in bOS via http device.

It works like a charm.... I would have prefered to find a bOS native solution, but unfortunately didn't find a way to get it to work.

You have too much spare time :-D Just kidding...

Great to see that people like to explore and develop

Hi,

I also hope that this topic becomes popular. That's the point 😁

Glad to see that I'm not the only one with dar sober template 😃

Keep up with the good work.

Ricardo

What devices are you using for visualisation? I was thinking on a cheap android tablet from China but Im reluctant to buy as the bOS app performance on my Nexus 6p is quite bad compared to my wife's iphone 7/8. CC offers a dedicated display (Bobcat) but all i've seen are renderings. No actual footage or video

Hi Joachim,

To be honest, I always thought that the standard theme that comes with bOS is a little bit heavy, because of lots of transparencies etc.

So, by understanding the limitations of the hardware, I've tailored my visualization. Removed any transparent buttons and backgrounds etc, and the theme is lighter.

To give you an idea, I use a Huawei P9 as my daily phone, and at home I have an old iPad 2 with iOS 9. Both of them work pretty fine.

So, try remove all the transparent backgrounds, on the buttons, labels etc, and you'll see that your theme will get faster.

Best regards

Hi Joachim,

On my side, as you can see, I have a "heavy loaded" theme. All is running fine on iPad 2 with iOS 9, iPhone 6S and  7 with iOS 11 and Win 10.

Except the one tab (1st picture of my presentation) who's very heavily encoded and therefore take up to 3 seconds to open, all others respond instantly.

Best regards,

As you can see, my visu has backgrounds etc removed to make it faster. It runs "fine" on my nexus. But its far from "snappy"

As im testing many things i went a different route, i wanted to stress out my pc as much as i could so here is my memed out theme https://drive.google.com/open?id=1Tqn5-iVtZ6NKK7Ev9YDq9r94YNAKSEyQ  video quality is worse than it really is.
I really like cinematic gifs, its awesome that bOS supports gifs.

Really interesting to see that animated gifs are working....gives me some ideas !

Hey people! Where are your themes? C'mon, wake up everybody! :-)

Lets power up this post with some screen sharing! Don't be afraid, no one is going to judge your templates, it's just screen sharing so that everybody can take some ideas and lever up bOS!

Thanks Jürgen, for the animated gifs ideas.

Best regards

Very nice

Using gifs my windows bOS client is starting to give me errors, out of memory etc also configurator is having some problems.  Usually restart helps. But on android it works like a charm. for testing im using a oneplus 6 video quality is bad again but this time i filmed it on my android  not in win client so IRL it looks much better. https://drive.google.com/open?id=1cOqVXsUjyyF7pnCAYNZBnrM5k6l0PUuf  

I'm not a big fan of gifs, because of the image quality... But I have to say, that some animations would be cool on bOS, rather than using static content.

Btw, even though my old iPhone 3GS doesn't support bOS app (iOS 6), I found out that bOS can still run on Safari... a little bit slow, but it runs! Well done...that shows the flexibility of responsive web interface from bOS even on old platforms...

I found the solution for low res/high PC usage issue of gif. I am using svg animation instead. Yes it is little bit harder to make and code but it works great on mobile and WEB, but in Windows client it dont becouse of old something.... Example: on Google Chrome it works but on EE it wont it is just static. But svg is lossless format so nice smooth edges. 2018_11_29_08_18_38.mp4

Very nice Kristián Vojčík
I think webm support would be nice too. Webm's quality is much better while file size is smaller. Configurator and windows client is having problems with larger files(I got a 16mb gif to work but  yeah it not pretty when it loads late and is glitchy), although on android there is no problems when the internet is good.  https://drive.google.com/file/d/1dXjLfXzf1hk6wd-OxqoXyPkHfWwhUv_H/view?usp=sharing

I messed up again with the link, i wanted to post this https://drive.google.com/open?id=1azdyher-Vzr6GBviatq6W3q5F4cvEn3d other video has some compression glitches in it.

Hey Kristián,

Was it too hard to code / create the animation?

I'm looking forward to also use SVG animations, but didn't had time to explore the process.

Best regards

Ricardo.

it is not necessary hard to code, if you have some skills with html and css you should be good. But if you want "100%" compatibility with bOS there are some rules to follow. A have hard time getting it to work with bult in color change. But in the end it works. And also please CC team let us change icon for weather so we can use cool animation :)

I've downloaded a SVG animation file for testing, and I can confirm that in Android phone the animation works, but not in the Windows client... :-( I think it has to do with the SVG browser compatibility...

Also, I have a problem / bug:

The demo file I'm using is transparent. If I placed it has Image on a button, I can't center the image... But if I place it as Background image, I can center the image. The problem is that it messes with the text, so the image gets on the back of the text and the text appears centered on the button rather than below.

Example: (Left: Animated SVG as Image. Right: Animated SVG as Background image)

Is it supposed? :-(

Ricardo.

I have same problems with SVG at start. Picture should have 256pix x 256pix size, or background of 512pix x 256pix with two pic of 256pix x 256pix. Try resize it and try again.

za tu wersja mobilna

czekam na inspirację bo mam niedosyt