bestehenden Background die Größe ändern

[Jyrki]

Hi,
habe mir ein GUI Kit gekauft und möchte gerne den Background (mehrere Farben/Texturen) in der Größe ändern. Die Größe beträgt 1120x2560 und möchte gerne auf 1024x768 oder 1920x1024. Wenn ich in beim Exportieren in PNG in die gewünschte Größe umwandle wird nicht das ganze Bild geändert sondern nur ein Teil.

Wie wird das in Photoshop gemacht?

Sorry, aber bin absoluter Neuling in Photoshop.

[fadami]

Die Seitenverhältnisse der von dir angegebenen Bildformate sind sehr unterschiedlich.
In Photoshop kannst du z.B. unter Bild -> Bildgröße die von dir erstrebten Maße eintragen.
Normalerweise sind die Maße aber in den Proportionen zueinander gebunden, doch wenn du dabei das Häkchen bei 'Proportionen beibehalten' raus nimmst, dann kannst du die von dir gewünschten Pixel-Werte eintragen. Natürlich muss die Maßeinheit auf Pixel eingestellt sein.
Leider bekommst du so aber auch eine Verzerrung des Bildes.

Geschickter finde ich da das Freistellungswerkzeug bei dem du deine Wunschmaße (wieder in Px) einträgst.
Nun wird zwar dein Bild beschnitten, aber du bekommst dafür auch keine Verzerrungen ins Bild.

[Jyrki]

Hi fadami,
danke für die Antwort, werde es mal aus probieren und mal schauen was dabei rum kommt. Ich denke mal wenn ich auch nicht alle Farben erwische, macht das auch nichts.
Es geht dabei um das Thallium Kit.
https://www.behance.net/gallery/1152...allium-GUI-Kit

Wie kann ich den am besten bei z.B. den Buttons eigene Icons einfügen. Soll ich dafür eine eigene Ebene erstellen und mein Icon reinziehen? die Effekte möchte ich aber gerne beibehalten.

Ich habe zwar schon in einem anderen Thread (anderes Thema) von mir gefragt, wie ich am besten die Buttons ins PNG Format bringe und habe es bis jetzt über die Exportieren als... Funktion gemacht. Da habe ich aber auch das Problem das die Breite/Länge immer angepasst wird, was aber für mein Vorhaben nicht funktioniert. Irgendein Maß ist immer zu klein oder zu groß.

Wie kann ich den aus dem Kit nur den Hintergrund "isolieren" und wie kann ich z.B. einen Button in ein neues "Projekt" kopieren das ich mehr Übersicht bekomme. So würde ich dann das was ich wirklich brauche als neue psd Datei abspeichern.

EDIT: Das mit dem Hintergrund funktioniert soweit. Die reichen mir ja als PNG Datei. Aber bleibt noch das Problem mit den einzelnen Buttons, das ich die als eigene psd Datei bekomme und halt das Icon Problem.

[virra]

Schau mal hier hinein:
https://helpx.adobe.com/de/photoshop...l#layer_basics
https://helpx.adobe.com/de/photoshop...rs-groups.html

Ebenen und Ebenegruppen kannst du mit dem Verschieben-Werkzeug in ein anderes Bild zeihen. Bei gedrückter Shift-taste positioniert sich das wieder wie im Original. ggfs müssen mehrere Ebene ausgewählt werden, oder verkettet sein.

[Jyrki]

@virra
Danke, hat mir sehr geholfen. Habe es auch soweit hin bekommen.

Noch eine Frage hätte ich dazu. Wenn ich einen fertigen Button aus dem Kit nehme und den vergrößern/verkleinern möchte geht das nur über Transformieren? Habe das Problem wenn ich den Button vergrößere, wird der Button anders dargestellt. Geht das skalieren auf eine andere Größe auch anders? Das heißt das ein Button der im Original 100x30 Px hat auch in 250x80 Px genau so aussieht oder ist das so gar nicht machbar.

Habe auch schon probiert den Original Button als PNG abgespeichert und dann in Photoshop wieder geöffnet und die Bildgröße verändert.

[dudlhofer]

Das ist so nicht machbar - da müsstest Du schon auf eine Vektorgrafik zurückgreifen. PNG ist wie vieles andere ein Rastergrafikformat und besteht nur aus unzusammenhängenden Pixeln. Beim Vergrößern - egal mit welcher Methode - werden die aufzufüllenden Nachbarpixel "errechnet", was zwangsläufig zu grausligen Effekten an den Kontrastkanten führt. Ein Vektorgrafikformat wäre EPS - was Du aber in PS nicht bearbeiten kannst. Dazu braucht's Adobe Illustrator oder das kostenlose InkScape.

[Jyrki]

Hallo Ludwig,

Das ist ja nicht so toll. Der Autor des Thallium GUI Kit's beschreibt zwar in seiner Grafik das das ganze zu 100% editierbar wäre weil es Vektorformen wären, deshalb hatte ich gedacht das man die beliebig in der Größe ändern könnte.

[virra]

Wenn es Vektorformen sind, kann man sie verlustfrei vergrößern. Allerdings wäre es mir neu, das png sowas beinhalten können, bei einem psd geht das natürlich.

[dudlhofer]

Ich hab mir das Ding jetzt mal angeschaut (gibt's ja bei Dutzenden von Anbietern). Es gibt eine "Free" und eine "Full" Version. Welche hast Du denn?
Auch die "Free"-Version (ich hab sie von hier...) ist eine PSD-Datei und enthält die Formen in einzelnen Ebenen (die sind allerdings überhaupt nicht gruppiert und deshalb ist das Zurechtfinden etwas mühsam). Jedes UI-Element besteht aus mehreren Ebenen und die sind größtenteils ungerasterte Vektor-Formen, die sich beliebig skalieren lassen. Also alles gut. Warum Du die Elemente als PNGs bearbeiten willst, erschließt sich mir deshalb nicht.

[Jyrki]

Zitat von dudlhofer

Ich hab mir das Ding jetzt mal angeschaut (gibt's ja bei Dutzenden von Anbietern). Es gibt eine "Free" und eine "Full" Version. Welche hast Du denn?
Auch die "Free"-Version (ich hab sie von hier...) ist eine PSD-Datei und enthält die Formen in einzelnen Ebenen (die sind allerdings überhaupt nicht gruppiert und deshalb ist das Zurechtfinden etwas mühsam). Jedes UI-Element besteht aus mehreren Ebenen und die sind größtenteils ungerasterte Vektor-Formen, die sich beliebig skalieren lassen. Also alles gut. Warum Du die Elemente als PNGs bearbeiten willst, erschließt sich mir deshalb nicht.

Danke erstmal für eure Hilfe. Ich habe die Full Version und ich glaube wir haben einander vorbei geredet bzw. habe ich mich nicht klar ausgedrückt, Sorry, ich möchte natürlich bzw. benötige erst zum Schluss die PNG Ausgabe nach dem Bearbeiten. Ich hatte gemeint das man mit der "Exportieren als" Funktion die passende Größe einstellt und hat den fertigen Button. Aber habe es jetzt raus das ich die Buttons mit dem Kürzel "STRG+T" in der Größe ändern kann und dann erst ins PNG Format bringe. Was mir da aber auf fällt, wenn ich den Button ziemlich groß skaliere, ändert sich schon das aussehen an den Rändern, die sind dann rundum nicht mehr gleich. Versucht habe ich die breiten Button mit dem Text "Button Normal", "Button Hover" direkt unter dem Equalizer. Abbildung...


Für die Ausgabe als PNG, mache ich das am besten über diese Exportieren als Funktion?



Was mir aber absolut noch nicht klar ist, wie ich andere Icons in die Buttons bekomme. Habe schon mal folgendes getestet:

Icon geöffnet (habe sie als PNG und SVG), Größe geändert, auf diese Thallium Oberfläche gezogen (vorher alle Ebenen ausgeblendet), die Effekte von dem Original Button auf die Ebene meines Icons gezogen.

Ich weiß halt nicht ob diese Schritte die optimalen sind oder ob es noch andere einfachere Wege gibt.

Das mit der Übersicht des Kit's ist schon echt bescheiden, deshalb hatte ich gedacht das ich alle Button die ich brauche irgendwie einzeln als psd speichern soll.