2016-03-27 10 views
0

Ich bin ein Visual/UI Designer, der an einem Projekt/Produkt arbeitet, das von einem anderen Designer entworfen wurde. Dieser Designer stellte dem Front-End-Entwickler PNG-Icons von guter Qualität zur Verfügung, aber wenn der Frontend-Entwickler die Bilder auf 0,7 skaliert, sehen sie verschwommen aus.PNG-Bilder sehen verschwommen aus, wenn skaliert

Ich habe bemerkt, dass, wenn wir das Bild der Skala auf 0,5 eingestellt, sie sehen nicht verschwommen überhaupt:

0,7: [1]: http://i.stack.imgur.com/jQNYG.png

0,5: [2]: http://i.stack.imgur.com/hBShu.png

Wer weiß, warum passiert das?

Ich persönlich arbeite immer mit 0,5 Waagen, weil mir das so beigebracht wurde. Gibt es einen logischen Grund dafür?

Entschuldigung, wenn die Antwort offensichtlich ist. Ich bin wirklich neugierig darauf. Danke im Voraus.

+1

Mit welchem ​​Programm/welchen Tools skalieren Sie? –

+0

@MarkSetchell Der Front-End-Entwickler skaliert sie mit HTML/CSS. Ich habe einige Antworten auf diese Frage (siehe unten) und sie waren sehr hilfreich. –

+0

Gute Frage, aber ich denke nicht, dass dies die richtige Seite dafür ist. Ich schlage vor, dass diese Frage zu http://computergraphics.stackexchange.com migriert wird. – Evorlor

Antwort

0

Ich denke, dies hat mit der Interpolation zu tun, wenn man die Größe eines Bildes ändert, gibt es keine Möglichkeit zu wissen, was zwischen den beiden Pixeln sein soll, die im Wesentlichen zusammengeführt werden. Der Computer versucht zu erraten, wie das neue Pixel aussehen soll, indem er das Pixel um es herum betrachtet und die Werte kombiniert.

Also zum Beispiel im Bild oben wird es gehen, was zwischen weiß und orange ist? ein weniger helles Orange. OK lässt das zusammengefügte Pixel so aussehen. Wenn Sie in eine Ecke kommen, könnte es mehr Orange geben, so dass das neue Pixel mehr orange aussieht, Sie bekommen den Punkt.

Wenn Sie nun um 0,5 skalieren, betrachtet der Computer die Pixel und führt alle Pixel mit einer konstanten Rate zusammen. Was ich damit meine ist, wenn Sie ein Bild betrachten und versuchen, es in zwei Hälften zu teilen, werden Sie immer 4 Pixel miteinander verschmelzen. Wenn Sie jedoch mit 0,7 skalieren, wird eine unregelmäßige Anzahl von Pixeln zusammengefügt, was zu unterschiedlichen Konzentrationen von Pixeln führt was zu einem unscharfen Bild führt.

Wenn Sie dies nicht verstehen, ich verstehe, ich irgendwie auf eine Tangente losging .... wenn du mehr Klarheit Kommentar muss unten :)

1

Wenn Sie die Größe eines Bildes (in beiden Dimensionen) halbieren, kombinieren Sie effektiv genau 4 Pixel zu einem Bild. Wenn Sie jedoch etwas außerhalb des Maßstabs (z. B. 0,7) arbeiten, haben Sie einen und einen Bruchteil eines Pixels in einem Pixel (in jeder Dimension). Dies bedeutet, dass die Daten von einem Pixel in bis zu 4 Pixel anstelle von einem verwendet werden, was zu einem verschwommenen Effekt führt.

Sorry, ein Beispielbild wäre für mich ziemlich schwierig, aber ich hoffe, Sie bekommen das Konzept.

+1

FYI, Sie haben Grammatikfehler: "Sie haben 1 one" – spottedmahn

+1

Prost, obwohl Sie sich frei fühlen, es beim nächsten Mal zu bearbeiten –

+0

Ich versuchte, sechs Zeichen ändern Minimum :( – spottedmahn

1

Was weitgehend geschieht, hängt von der Software, die Sie verwenden um das Bild zu verkleinern. Es gibt einen großen Unterschied zwischen der Reduzierung um 0,5 und 0,7.

Wenn Sie um 0,5 verkleinern, kombinieren Sie 4 Pixel zu einem.

Wenn Sie um 0,7 verkleinern, machen Sie fraktionierte Stichproben. 10 Pixel in jeder Richtung werden auf 7 reduziert. In 0,5 Abtastungen lesen Sie zwei Pixel quer, lesen zwei Pixel nach unten.

In 0,7 Probenahme lesen Sie 1,42857142857143 Pixel in jeder Richtung. Um dies zu tun, müssen Sie Pixelwerte gewichten. Das wird Unschärfe in einer Zeichnung erzeugen.

Verwandte Themen