Wie erstelle ich Crips und glatte Symbole aus heruntergeladenem PNG?

Das ist wahrscheinlich eine wiederholte Frage, aber ich möchte, dass alle pngSymbole in der Android-Anwendung klar und glatt aussehen. Wie kann ich das in Photoshop machen?

Ich habe 50*50 px pngBilder, die ich auf Mobilgeräten gut aussehen lassen möchte. Aber wenn ich pngdas Bild mit dem Transformationsbefehl reduziere oder Bilder mit der bikubisch schärferen Technik neu sample, sieht das immer noch reduzierte Bild aus irgendeinem Grund auf dem Handy verschwommen aus und ist pixelig.

Wie kann man ein Downsampling durchführen, pngdamit es in der mobilen App und in allen Größen gut aussieht? Brauche ich wirklich ein Vektorformat oder geht das nur mit png?

Hmm... ist das nicht der Punkt, du brauchst einfach größere Bilder?
Welche Größe müssen sie auf dem Antrag haben? verwendest du die richtige dp auflösung?
Bitte geben Sie weitere Details an und überprüfen Sie auf Tippfehler. Ist es möglich, dass Sie 50 x 50 Zoll PNG bei haben? dpi-Auflösung für den Anfang? Wenn Sie nur 50x50 Pixel haben und trotzdem verkleinern wollen (?), gehen Sie von schlecht zu wirklich schlecht. Welche Größe möchten oder benötigen Sie? Erstellen Sie die App selbst? Was schreibt die Dokumentation für Icons vor? Und wie sehen deine Startpngs aus? Sind sie sogar knusprig und glatt oder bitten Sie um Wunder? Ich habe gute Ergebnisse beim Vektorisieren sogar von Bitmaps mit niedriger Auflösung erzielt; aber das ist nicht deine frage...
@MartinZaske DPI spielt keine Rolle, nur Pixel

Antworten (4)

Nein, Sie brauchen keine Vektorform, damit Bilder auf anderen Geräten gut aussehen. Sie benötigen jedoch ein größeres Originalbild, oder es wird in einem Gerät mit sehr hoher Pixeldichte entweder hochskaliert oder winzig klein.

Siehe Browser in High-Density-Maschinen haben ein Problem. Wenn sie Bilder mit einem Verhältnis von 1 Pixel zu 1 Pixel anzeigen, wären alle Bilder für ältere Websites schrecklich klein. Sie überschreiben also Ihre Bildgröße und interpolieren mehr Pixel. Jetzt zeigen die meisten dieser Browser das Bild genau in der Größe an, die Sie angeben, wenn Sie das zu verwendende Bild in CSS oder mit einem Meta-Attribut im Header überschreiben, um dem Browser mitzuteilen, was zu tun ist. Dies hilft möglicherweise nicht, da das Bild auf diesen Geräten im Vergleich zu Geräten, die keine so dichte Pixeldichte haben, sehr klein ist.

In Wirklichkeit möchten Sie höchstwahrscheinlich nur ein separates Symbol für diese Geräte mit mehr Pixeln für diese Bildschirme. Und die einzige Möglichkeit, dies zu tun, besteht darin, das Symbol nicht neu zu zeichnen.

Aber Ihr Anwendungsfall ist in der Frage etwas undurchsichtig, es ist schwer zu sagen. irgendetwas definitives.

HINWEIS : PPI/DPI ist nur ein Ablenkungsmanöver in der Geschichte. Wichtig ist nur, dass Sie genügend Pixel haben. Und erklären Sie dem Browser, dass Sie eine moderne Website sind.

Unschärfe kann von Bildern herrühren, die nicht pixelgenau sind, was bedeutet, dass einige der Begrenzungen Ihres Symbols zwischen einem Pixel liegen, anstatt es vollständig auszufüllen. Dies kann auch von der Skalierung herrühren, die pixelgenaue Symbole verschwommen machen kann, wenn der Skalierungsfaktor nicht zu einer Größe führt, bei der Beschränkungen auf Pixelkanten liegen.

Diese Seite von Adobe könnte etwas Licht ins Dunkel bringen, wovon ich spreche: https://helpx.adobe.com/illustrator/how-to/pixel-perfect.html

Solange das ursprüngliche Icon-Design pixelgenau gemacht wurde, sollte es keine Rolle spielen, ob Sie eine Vektordatei oder PNG verwenden (solange Sie es nicht vergrößern, sondern verkleinern).

Vielleicht möchten Sie das Image Trace-Tool in Illustrator ausprobieren und mit den Einstellungen herumspielen, bis Sie das gewünschte Detail für Ihre Symbole erhalten, und dann fortfahren und die Größe ändern. Vector ist die zuverlässigste Methode, um sicherzustellen, dass Ihre Designs in jedem Maßstab gestochen scharf aussehen.

Zuerst erstellen Sie ein kleines Bild wie 48 * 48 px mit einer Auflösung von 72 ppi.

Wenn Sie die Größe des Bildes ändern, ändern Sie nicht seine Höhe und Breite. Ändern Sie nur die Auflösung. Wenn Sie Ihre Auflösung von 72 ppi auf 144 ppi ändern, wird die Bildgröße automatisch erhöht und es wird 2x sein, bedeutet 96 * 96 Pixel und die Bildqualität wird hoch sein (ohne Pixel) weil die Bildqualität von der Auflösung abhängt, nicht von Höhe und Breite.

äh, es wird immer noch verschwommen sein. Sie sollten ein großes Bild haben und es dann kleiner machen;)