NEWS
ioBroker User Interface Kit für VIS (download)
-
Die Idee ist echt super. Was mich allerdings erstmal stört ist, dass du alles als Grafik umsetzt und dann dementsprechend einbindest. Sprich du bindest eine Hintergrundgrafik ein und legst das Icon drüber. Es ist halt wesentlich einfacher solch Dinge mit CSS zu lösen und bedarf eigentlich nur minimale Programmierkenntnisse. In dem Fall wären das nur paar kurze Befehle in CSS, die genau das bewirken, was du erzielen möchtest.
Du sparst dir dann auch viel Rechenpower ein.
@NukNuk Danke für die Tipps! Ich benutze den ioBroker jetzt ca. einen Monat. Als ich mir das Design gebaut habe, war das für mich die einfachste/schnellste Lösung und wusste auch nicht, wie man das anders umsetzten kann, da ich mich in der Thematik noch nicht so auskenne. Vielleicht werde ich es in Zukunft anders lösen, aber für Einsteiger wie mich und vermutlich auch andere ohne große CSS Kenntnisse ist das eine gute Möglichkeit schnell eine kleine VIS zusammen zu basteln.

-
Das sieht ja mal richtig klasse aus !! Da ich meine VIS auch endlich mal von "schnell mit Hausmitteln gebaut" zu "kann man so lassen" umbauen will, werde ich ganz sicher auf Dein Material zurückgreifen! Vielen Dank dafür!
-
Hallo zusammen,
ich habe vor ein paar Tagen das erste Mal von ioBroker gehört und finde es echt super, dass Leute das System in ihrer Freizeit entwickelt haben und auch in Zukunft weiterentwickeln werden. Ich bin leider kein Programmierer, sondern Designer und kann daher nicht aktiv zur Weiterentwicklung von ioBroker beitragen. Was ich allerdings kann ist ein Design für VIS zu gestalten.

Deshalb habe ich ein ioBroker User Interface Kit zum Downloaden erstellt. Es ist ein Set aus verschiedenen Hintergründen und Icons und wird nach und nach von mir weiterentwickelt. Daher wird man vermutlich erst mal nur kleinere statt komplexe Visualisierungen erstellen können.
Würde gerne noch eigene Widgets machen die zum Design passen, aber leider hab ich davon absolut keine Ahnung
Für die Schrift benötigt Ihr den vis-google-fonts.0 Adapter. Dort findet ihr dann die Schrift "Comfortaa".
Hier könnt ihr euch das Kit ansehen: ioBroker UI Kit
Und hier könnt ihr es downloaden: Download
Ich hoffe der ein oder andere kann damit was anfangen.

.
.
.
.
Update 23.6.
-Custom CSS für Slider Widget horizontal/vertikal
-Demoprojekt zum Importieren mit hochgeladenUpdate 28.6.
-Neue Icons darunter auch ein Set der gängigsten SprachassistentenUpdate 07.8.
-Neue Icons für Netatmo Darstellung
-Neue Hintergründe (Tür auf/zu, Steckdose, Lautsprecher, Computer)@pat3195 Hi, sehr schönes Design-Kit!
@eMd hat mich darauf aufmerksam gemacht.
Das würde glaube ich auch ganz gut mit iQontrol zusammen passen:
https://forum.iobroker.net/topic/22039/neuer-adapter-visualisierung-iqontrol
https://github.com/sbormann/iobroker.iqontrol
Mit der neuen Version kann man Hintergründe und Icons selbst anpassen und mann kommt ziemlich schnell zu einem Ergebnis.
Ihr könnt ja mal schauen.
LG!
-
@pat3195 Hi, sehr schönes Design-Kit!
@eMd hat mich darauf aufmerksam gemacht.
Das würde glaube ich auch ganz gut mit iQontrol zusammen passen:
https://forum.iobroker.net/topic/22039/neuer-adapter-visualisierung-iqontrol
https://github.com/sbormann/iobroker.iqontrol
Mit der neuen Version kann man Hintergründe und Icons selbst anpassen und mann kommt ziemlich schnell zu einem Ergebnis.
Ihr könnt ja mal schauen.
LG!
@s-bormann hat da noch niemand drauf geklickt oder ist das nur bei mir so.
github link

-
da fehlt nur ein .iqontrol
https://github.com/sbormann/ioBroker -> https://github.com/sbormann/ioBroker.iqontrol
-
da fehlt nur ein .iqontrol
https://github.com/sbormann/ioBroker -> https://github.com/sbormann/ioBroker.iqontrol
@Homoran jetzt wo du´s geschrieben hast...hab ich auch die ganze Zeile gelesen:woman-facepalming:
-
da fehlt nur ein .iqontrol
https://github.com/sbormann/ioBroker -> https://github.com/sbormann/ioBroker.iqontrol
-
Hallo zusammen,
ich habe vor ein paar Tagen das erste Mal von ioBroker gehört und finde es echt super, dass Leute das System in ihrer Freizeit entwickelt haben und auch in Zukunft weiterentwickeln werden. Ich bin leider kein Programmierer, sondern Designer und kann daher nicht aktiv zur Weiterentwicklung von ioBroker beitragen. Was ich allerdings kann ist ein Design für VIS zu gestalten.

Deshalb habe ich ein ioBroker User Interface Kit zum Downloaden erstellt. Es ist ein Set aus verschiedenen Hintergründen und Icons und wird nach und nach von mir weiterentwickelt. Daher wird man vermutlich erst mal nur kleinere statt komplexe Visualisierungen erstellen können.
Würde gerne noch eigene Widgets machen die zum Design passen, aber leider hab ich davon absolut keine Ahnung
Für die Schrift benötigt Ihr den vis-google-fonts.0 Adapter. Dort findet ihr dann die Schrift "Comfortaa".
Hier könnt ihr euch das Kit ansehen: ioBroker UI Kit
Und hier könnt ihr es downloaden: Download
Ich hoffe der ein oder andere kann damit was anfangen.

.
.
.
.
Update 23.6.
-Custom CSS für Slider Widget horizontal/vertikal
-Demoprojekt zum Importieren mit hochgeladenUpdate 28.6.
-Neue Icons darunter auch ein Set der gängigsten SprachassistentenUpdate 07.8.
-Neue Icons für Netatmo Darstellung
-Neue Hintergründe (Tür auf/zu, Steckdose, Lautsprecher, Computer)@pat3195
Kann ich iwo selber die Icons finden oder sind die alle selbst gemacht?
Hatte da bald noch ne Menge Wünsche
Als erstes wären das:
Person abwesend/anwesend
Steckdose an/aus
Symbol Temperatursensor/Bewegungsmelder/Rauchmelder
Tür offen/zuMfG
eMd -
