Was bedeutet "Entwerfen eines Symbols im 100% Maßstab"?

13

Aus dem Android Material Design Guide ,

Systemsymbole werden bei 24dp angezeigt. Bei der Erstellung von Symbolen ist es wichtig, dass die Pixelgenauigkeit bei 100% liegt .

Was versteht man unter 100% Design? Bedeutet dies, dass das Symbol 24 * 24 dp-Dimensionen haben sollte? Oder bedeutet dies, dass sie in einem Dateiformat vorliegen sollten, in dem die Skalierung nicht zu Datenverlust oder -verzerrung usw. führen würde, wie im SVG-Dateiformat?

Trost
quelle
1
Es gibt einen tollen Artikel über Stack Overflow - Unterschied zwischen px, dp, dip und sp auf Android?
AndrewH
1
@ AndrewH Ich kenne den Unterschied! Die Frage ist, was unter "etwas im 100% -Maßstab entwerfen" zu verstehen ist!
Trost

Antworten:

23

Bei einer Skalierung von 100% müssen Sie nur die Größe (in Pixel) festlegen, in der Sie Ihr Symbol anzeigen bzw. ausgeben möchten.

Wenn Sie ein 24px × 24px-Symbol entwerfen, richten Sie Ihre Zeichenfläche in Illustrator oder ein Dokument in Photoshop ein oder was auch immer Sie für 24px × 24px verwenden.

Wie aus dem Material Design Guide hervorgeht, dient dies der Pixelgenauigkeit. Wenn Sie in größerem Maßstab oder in einem Vektorformat arbeiten, ohne Pixel zu berücksichtigen, reduzieren Sie die Größe später auf 24px - Ihre Formen, Pfade, Punkte oder Pixel werden nicht am Pixelraster ausgerichtet und Sie erhalten Effekte wie in diesem Beispiel dargestellt:

Bildbeschreibung hier eingeben

Es ist erwähnenswert, da dp keine absolute Maßeinheit ist und sich in eine Reihe verschiedener tatsächlicher Pixelgrößen umsetzt. Das Entwerfen auf einer 100% -Skala bedeutet auch, dass Sie für jede Pixelgröße unabhängig voneinander entwerfen. (Danke Yorik!)

Cai
quelle
Vielen Dank für eine sehr präzise und klare Antwort. =)
Trost
Es ist wichtig zu wissen, dass "24 dp" als abgeleitete "gleitende Skalenmessung" bedeutet, dass "Design für 100% Skala" im angegebenen Kontext tatsächlich bedeutet, dass Sie für jede mögliche Dichte im Idealfall ein anderes Symbol benötigen.
Yorik
1
@Yorik Sehr guter Punkt. Aktualisiert meine Antwort.
Cai
Sie müssen nicht unbedingt bei jeder Auflösung unabhängig arbeiten: 48 kann genau das gleiche Design wie 24 haben, während 126, 128, 64, 32 auch alle gemeinsam nutzen können. Handpixelung 16px wird wahrscheinlich jedoch benötigt. In diesem Beitrag finden Sie die gängigsten Auflösungen.
curiousdannii