Community

Anleitung zum Erstellen von Community Icons


#1

Hallo Zusammen :wave:t2:

ihr habt so viele Ideen für neue Icons und offensichtlich verstehen auch Einige von euch das Handwerk, deshalb habt ihr ab jetzt die Möglichkeit diese selber zu erstellen und hier zur Integration einzureichen!

In diesem Bereich der Community dreht sich alles um neue homee Icons. Ihr habt ein Tutorial zur Erstellung von homee Icons? Macht ein neues Thema auf und postet es.

Ihr hättet gern ein bestimmtes Icon, traut euch aber nicht zu es zu designen?
Stellt den Icon Wunsch vor und vielleicht findet sich ja ein anderer User der es designen kann.

Um den Prozess für uns (und natürlich auch für euch) so einfach wie möglich zu machen, haben wir eine Liste mit Anforderungen erstellt:

Anforderungen

Normale Icons (für Geräte/Homeegramme/Gruppen in den Hauptscreens)

  • Artboardgröße: 40 x 40 Pixel
  • Mögliche Farben: 3 Fills & 3 Strokes
    • #B781FB Fill 1: #B781FB
    • #CEA7FF Fill 2: #CEA7FF
    • #DCC2FF Fill 3: #DCC2FF
    • #9969D6 Stroke 1: #9969D6
    • #B781FB Stroke 2: #B781FB
    • #CEA7FF Stroke 3: #CEA7FF
  • Stroke Stärke: 2 Pixel
  • Corner Radius: 2 Pixel
  • Keine Hintergrundfarbe

Es reicht wenn ihr uns die Icons in den Z-Wave-Farben schickt. Das Umfärben übernehmen wir.

Monochrom Icons (für Geräte/Homeegramme/Gruppen in den Auswahlscreens)

  • Artboardgröße: 20 x 20 Pixel
  • Stroke Stärke: 1 Pixel
  • Kein Fill
  • Corner Radius: 1 Pixel
  • Keine Hintergrundfarbe

Ein kleines Beispiel findet ihr hier:

Geräte mit mehreren Zuständen

Viele Geräte haben verschiedene Zustände (z.B. An/Aus oder Dimmwert). Falls ihr ein Icon mit verschiedenen Zuständen einsendet, schickt uns bitte alle Zustände.

Wir haben hier eine kleine Liste mit möglichen Gerätezuständen für euch:

  • Steckdosen:

    • An/Aus
  • Fenster/Türen:

    • Geschlossen/gekippt/ auf
  • Geräte mit prozentualen Werten (Rollläden, Lampe mit Dimmwert etc) oder größeren Ranges (Soll-Temperatur):

    • 0% (Aus), 20%, 40%, 60%, 80% , 100%(An)

Abgabe

  • Abgabe als Sketch Datei (alternativ auch als SVG)
  • Per Mail an: icons@hom.ee

Was passiert nachdem ich ein Icon eingereicht habe?

Wir sammeln alle Icons über einen bestimmten Zeitraum hinweg (vom Release bis zur nächsten Beta).
Kurz bevor eine Beta-Phase beginnt werden wir uns zusammensetzen und relevante Icons auswählen. Die ausgewählten Icons werden dann in die Apps eingebunden.

Achtung!

Wir gehen davon aus, dass wir einige Icons (Tür, Fenster etc.) doppelt bekommen werden. Hier werden wir dann im Team entscheiden welches Icon hinzugefügt wird.

Ein weiteres Kriterium zur Aufnahme eines Icons ist der Stil. Wir möchten auch mit den neuen Icons unserem homee Stil treu bleiben. Falls ein Icon dem Stil unserer Meinung nach nicht ganz entspricht werden wir es nicht übernehmen. Wir hoffen ihr könnt diese Entscheidung verstehen.


Update: homee 2.20
Passende Icons für den Fibaro Tür- Fenstersensor (zweckentfremdet)
Icon Request: Terassentür
#2

Sehr gute Idee!
Weshalb muss es unbedingt eine Sketch Datei sein?
Das Programm kostet 99$ im Jahr. An eure Vorgaben kann man sich ja auch mit SVGs halten und Sketch kann die sicher auch gut importieren.


#3

Guter Punkt! Ich habs mal mit aufgenommen


#4

Sonst wäre ich als Nicht-Apple’er schon wieder raus gewesen… :wink:


#5

tolle Idee… ihr nehmt den Input direkt aus der community… sehr geil… das haben sich schon einige hier gewünscht…
lasst mich direkt noch etwas anmerken… wenn die anzahl an Symbolen zunimmt (und das wird sie mit Sicherheit bei dieser Kreativität hier) dann benötigt ihr auch eine übersichtliche Auswahl und unter umständen eine Kategorisierung bei der Icon vergabe… wenn man am ende durch eine liste von 500 Icons blättern muss um das eine passende zu finden, wird man schnell irre… (ich weis von was ich rede… wenn man den einen kackhaufen smily sucht der immer im Handy in der liste ganz unten ist…)
apropos Handy… wenn ihr da dann als vorbild eventuell direkt eine “favoritenseite” macht, kann man öfter gewählte Icons eventuell schneller finden…


#6

Viel wichtiger wäre es, dass man bei Geräten auch den kompletten Icon-Pool zur Verfügung hat. Momentan bietet ihr z.B. bei einem Bewegungsmelder (der Bewegung, Helligkeit und Temperatur kann), nur ein Bewegung-/Temperatur-/ und Helligkeits-Icon.

Könnt ihr darunter alle anderen Icons auch auswählbar machen? Die drei “Haupt”-Icons können ja weiterhin an erster Stelle als Vorschlag angezeigt werden. Denn für Homeegramme gibt es schon jetzt einige Icons, die ich auch gerne für Geräte nutzen möchte, z.B. den Lautsprecher für eine Schaltsteckdose.


#7

@Susi wie wollt Ihr das bei “dynamischen” Icons handhaben?

Ich nehme als Beispiel mal Fenstericons, die ja heute optisch schon mehrere Zustände (offen/geschlossen/geklappt) einnehmen können. Auch bei Plugs erkennst Du heute schon ob diese an oder aus sind und auch die Sollwerte von Temperatursteuerungs-Devices sind optisch im Icon schon erkennbar (ich habe sicherlich etwas vergessen, aber das sind mal die wesentlichen Beispiele).

Ist Eure Erwartungshaltung hier, dass in solchen Fällen auch diese möglichen “Zustände” angeliefert werden oder übernehmt Ihr das?

Ich würde erwarten, dass das zumindest für Fenstericons (@Kappezkopp wird da deutlich bessere Vorschläge bringen) und für alternative Geräteicons, welche einfach Plugs steuern bzw. deren Zustand im homee angebildet ist, ebenfalls der Fall sein könnte.


#8

ja :grinning: das Umfärben kostet uns quasi keine Zeit und kann schnell erledigt werden. Daher machen wir das dann selber. Alles andere nimmt zuviel Zeit in Anspruch.


#9

@Kappezkopp - Du darfst also öffnen/klappen/schliessen/schieben/an&aus schalten wie Du willst :wink:


#10

Also @Susi, wenn die dynamischen Zustände mitgeliefert werden sollen - in welcher Granulation sollen die Zustände von 0% - 100% denn geliefert werden? Die Lampen-Icons und die Heizungs-Icons füllen sich ja schrittweise.


#11

…das würde auch heissen, dass geräte deren integration wir (irgendwann) mal erwarten (hustSonoshustAlexahustGoogle Homehust) auch einen kreativen An-Zustand haben können (z.B. mit von der Box wegfliegenden Noten)…


#12
  • Steckdosen: An/Aus
  • Fenster/Türen: Geschlossen/gekippt/ auf
  • Geräte mit prozentualen Werten (Rollladen, Lampe mit Dimmwert etc) oder größeren Ranges (Soll-Temperatur): Es gibt 6 Zustände:
  • 0% (Aus), 20%, 40%, 60%, 80% , 100%(An)

Ich nehme das noch mit in die Anleitung auf :slight_smile:


#13

Jetzt noch mal zu erstellen der Icons… Braucht man dazu wirklich ein Pgm für 99€ im Monat?
Gibt es da nichts kostenloses auf dem Markt, wenn ja, welches?

Ich habe Autosketch, würde das gehen? Welche Dateiendung muss die Datei haben?

Danke schon mal für Eure Antworten
Thorben


#14

Wie Susi schrieb:

SVG sollte dir Autosketch eigentlich exportieren können.

Als Freeware kommt beispielsweise GIMP in Frage. Photoshop (kostenpflichtig) kann das auch.

:coffee:


#15

Ich könnte Gravit Designer empfehlen: https://designer.io


#18

#19

@Kappezkopp ich muss meine Aussage bezüglich der Zustände bei Geräten mit prozentualen Werten korrigieren:

  • Es gibt 6 Zustände:
  • 0% (Aus), 20%, 40%, 60%, 80% , 100%(An)

#20

Hallo Zusammen,
das hört sich toll an auch wenn ich garantiert keine Icons erstellen kann :slight_smile:

Wird es denn in absehbarer Zeit auch möglich sein, einen einen dunklen anstatt hellen Hintergrund zu bekommen? Dann bräuchte Imperihome gar nicht mehr…

LG
MC


#21

@Susi, die monochromen Icons benötigt ihr aber nur im geschlossenen/deaktivierten Zustand, richtig?


#22

Richtig :relaxed: