Bester Workflow, um ein Bild in 3 verschiedenen Größen zu speichern

In Photoshop möchte ich 3 verschiedene Größen desselben Logos erstellen. Abhängig von der Größe des Zielbildschirms wird es einige Unterschiede im Aussehen des Logos geben.

Ich glaube, das Slice-Tool ist das, was ich will, aber ich bin mir nicht sicher. Ich habe mehr über das Slice-Tool gelernt. Es scheint, wenn ich es zum Erstellen von Logos unterschiedlicher Größe verwende, wird es viel Zeit sparen, da alles auf einmal gespeichert werden kann. Auf diese Weise muss ich nicht drei verschiedene Bilder mit drei verschiedenen Speichern erstellen.

Ist das Slice-Tool der effizienteste Weg, um das obige Szenario zu handhaben?

Das Slice-Werkzeug ist nicht das Werkzeug, das Sie brauchen. Das Slice-Tool wird verwendet, um ein Bild in viele Bilder zu teilen , nicht um die Größe eines Bildes zu ändern. Sie müssen die Größe der Datei tatsächlich über Bild > Bildgröße ändern. Für das, was es wert ist, sollten Logos in einer Vektoranwendung erstellt werden, nicht in Photoshop.
Ich nehme an, Sie könnten ein Bild mit 3 separaten Iterationen des Protokolls erstellen und dann das Slice-Tool verwenden, um jeden Bereich des Bildes zu definieren. Scheint mir aber ein umständlicher Workflow zu sein.
@Scott - Können Sie nicht dasselbe erreichen, indem Sie alle drei Bilder auf dieselbe Palette legen, sie in Scheiben schneiden und speichern? Ist ein Save nicht besser als 3? Außerdem gibt es, wie ich oben erwähnt habe, leichte Unterschiede in jedem Bild.
@Scott - interessant. Ich dachte, die Methode, auf die Sie hingewiesen haben, wäre umständlich.
Schlage dich um 13 Sekunden :) Für mich wären 3 Dateien besser und zuverlässiger. Ich würde wissen, dass ich bei Bedarf an der richtigen Datei arbeite. Ein Logo sollte einmal erstellt und dann so gut wie nie wieder angerührt werden. Möchten Sie nicht, dass 3 Dateien jede Instanz unabhängig von den anderen platzieren können?
Vielleicht ist das Logo ein schlechtes Beispiel. Sagen wir einfach ein Bild. Wenn Sie dieses eine Bild ändern, aktualisieren Sie immer 3 Bilder. In Bezug auf Ihre Frage handelt es sich um 3 unabhängige Dateien. Sie haben die Haupt-PSD mit 3 Bildern. Wenn Sie aktualisieren/speichern, werden alle 3 Größen ausgegeben. Toller Workflow und sehr schnell. Warum sollten Sie jedes Mal 3 verschiedene Dateien öffnen, wenn Sie ein Bild aktualisieren müssen, wenn Sie eine Datei öffnen und dasselbe Ergebnis erzielen können? Das würdest du nicht.

Antworten (3)

Ich würde sie persönlich im selben Arbeitsbereich haben, und wie Sie erwähnen, würde ich sie zum Speichern in Scheiben schneiden.

Der einzige Unterschied zu den Kommentaren ist, dass ich jedes Bild auch in einem separaten Smart-Objekt haben würde. Auf diese Weise können Sie sie sozusagen in einer anderen „Datei“ frei bearbeiten, aber die Ergebnisse im Vergleich zu den anderen beiden auf derselben Leinwand sehen. Ich vermute, dass dies etwas Ähnliches sein könnte, wonach Sie suchen, weil ich annehme, dass Sie mit Pixelperfektion für die kleineren arbeiten möchten (könnte falsch sein!).

Wenn die Logos sehr ähnlich sind, hätte ich mehr Smart Objects ("yo dawg, ich habe gehört, dass Sie smart Objects mögen, also habe ich Ihre smart Objects in andere smartObjects eingefügt"). Sie könnten einen grundlegenden Stil haben, der allen gemeinsam ist, und dann werden verschiedene Stile darauf gezeichnet, die zu jeder Version passen.

Arbeitsablauf:

  • Erstellen Sie in einem neuen Dokument drei Kopien Ihres Bildes

  • Wandeln Sie jedes in ein separates Smart-Objekt um

  • Erstellen Sie Slices für jede Logogröße

  • Doppelklicken Sie auf ein Smart-Objekt, um es für Sie zu öffnen, damit Sie es bearbeiten können. Wenn Sie im neu geöffneten Dokument auf Speichern klicken, werden die Änderungen, die Sie gerade vorgenommen haben, auf die im Hauptdokument angewendet.

Nett. Ich muss mehr über intelligente Objekte lesen. Kennen Sie Tutorials, die den oben erwähnten spezifischen Workflow zeigen?
Ich glaube, ich sehe, was du hast. Klingt das richtig: 3 Bilder in einer PSD als Smart Objects. Doppelklicken Sie auf ein Smart-Objekt, wodurch eine neue PSD nur mit diesem Objekt geöffnet wird. Bearbeiten Sie neu geöffnete PSD und es bearbeitet auch nur dieses eine Smart-Objekt. Speichern Sie Smart-Objekt-PSD für das Web. Ich denke, es ist ein guter Workflow und viel besser als das Öffnen von 3 Dateien ... obwohl Sie sie am Ende irgendwie öffnen. Ist es möglich, diese Kaskade zu bearbeiten und auf alle intelligenten Objekte statt nur auf eines zu übertragen? Dies wäre der Fall, wenn Sie ein gemeinsames Element (z. B. Farbe) bearbeiten möchten.
@4thSpace Zum Beispiel: 1. Wählen Sie Ihr(e) Bild(er) aus. 2. In intelligentes Objekt konvertieren. 3. Duplizieren Sie dieses Smart-Objekt Strg + J (cmd auf Mac). 4. Verkleinern Sie das duplizierte Smart-Objekt und wiederholen Sie 3 und 4 so oft wie nötig. Doppelklicken Sie später auf eines davon, um den Inhalt zu bearbeiten, und drücken Sie Strg + s (cmd auf dem Mac) ... - als Beispiel : github.com/joonaspaakko/Photoshop-Image-Framer-Export-Script gleiche Idee, außer dass das Speichern der Datei von einem Skript gehandhabt wird. Sie öffnen im Grunde das oberste Smartobject, um Änderungen vorzunehmen, speichern es dann und gehen zurück zum ursprünglichen Dokument und führen das Skript aus.
Leider funktioniert dieses Skript nicht. Es wird nur ein Fehler "Element nicht gefunden" ausgegeben, nachdem Sie beim Speichern einen Namen eingegeben haben. Abgesehen von diesem Skript müssen Sie noch alle Versionen der Datei speichern. Aber zumindest können Sie die eine Haupt-PSD öffnen, anstatt all diese verschiedenen Versionen zu öffnen ... richtig? Ist das die Hauptsache?
@4thSpace Ich denke, Sie haben das Skript in einer zufälligen Datei verwendet. Leider ist es etwas an die mitgelieferten Vorlagendateien gebunden, da es für eine ganz bestimmte Aufgabe gemacht wurde. -- Ich war etwas in Eile, also habe ich mich nicht gut erklärt, ich habe das nur gepostet, um zu zeigen, wie das gemacht werden kann. -- Grundsätzlich ohne Skript können Sie Slices um die Bilder machen und dann das Originaldokument mit Save for Web & Devices speichern. Nehmen Sie einfach das Slice-Tool und "zeichnen" Sie Kästen um Ihre Bilder und wenn Sie mit Save for Web & Devices speichern, wird ein Bild für jedes Slice erstellt.
Sie könnten diese Erweiterung dezignmatterz.com/photoshop-plugins-and-tools/… verwenden , um die Dateien zu speichern (da Slices etwas umständlich sein können ...) oder wenn Sie einen Mac haben: macrabbit.com/slicy - ich war es Ich denke darüber nach, mein Skript universeller zu machen, aber meine Prioritäten liegen vorerst woanders.
Slicy sieht fantastisch aus und ich denke, es ist die Antwort. Hast du es versucht? Ich würde es lieber anderen Tools vorziehen, da MacRabbit so bekannt ist und eine gute Unterstützung haben sollte.
@4thSpace oh ja, ich habe sofort Slicy gekauft. Ich liebe es. Vielleicht möchten Sie die Testversion vor dem Kauf ausprobieren, nur um sicherzugehen. Hier können Sie ein Beispiel-PSD erhalten, das die Funktionen ziemlich gut darstellt macrabbit.com/slicy/help -- Dieses Skript von mir, von dem ich zuvor gesprochen habe ... Die Vorlagendateien folgen tatsächlich dem Slicy-Benennungssystem / -Workflow so genau, dass Sie kann ziemlich viel es in Slicy fallen lassen und es wird in der Lage sein, es so zu speichern, indem es das verwendet. Eigentlich erinnert mich das an eine Funktion, die auf der Slicy-Website irgendwie nie erwähnt wird. Sie können Ordner erstellen, indem Sie diese einfach zur Ebene hinzufügen.
ZB Myfolder/myimage.jpg – Am meisten liebe ich die automatische Speicherfunktion, die die Bilder nach jedem Speichern einer Photoshop-Datei neu speichert. -- Eine Sache zu dieser Website. Vielleicht möchten Sie @name in die Nachricht schreiben, um sicherzustellen, dass sie eine Benachrichtigung über Ihre Nachricht erhalten
@Joonas Diese Skript-/Erweiterungsdiskussion würde eine wirklich gute Antwort geben. Warum postest du es nicht als eins? Könnte für andere in der gleichen Situation wirklich hilfreich sein. Oh! Und Sie können es auch gerne im Chat fortsetzen , der ist heutzutage ziemlich aktiv :)

Dies könnte auch in Illustrator erfolgen (inspiriert durch die Antworten hier ):

Wenn es sich bei der Originalvorlage um eine Vektorgrafik handelt ...

1. Wandeln Sie Ihre Grafik in ein Symbol um

Platzieren Sie Ihre Grafik auf Ihrer Hauptzeichenfläche. Wählen Sie das gesamte Bildmaterial aus und klicken Sie dann auf die Schaltfläche „Neues Symbol “ im SymbolsBereich (alternativ können Sie das ausgewählte Bildmaterial in das SymbolsFenster ziehen). Dadurch wird Ihre Grafik in ein Symbol umgewandelt.

2. Erstellen Sie eine Reihe von Zeichenflächen, eine für jede gewünschte Ausgabegröße.

Ich habe 3 Zeichenflächen in unterschiedlichen Größen. Jeder hat nur das Symbol, das ich aus dem SE-Logo gemacht habe. SymbolsZiehen Sie dann Ihr Bildmaterial aus dem Bereich heraus und platzieren Sie es auf den anderen Zeichenflächen (und ändern Sie die Größe nach Belieben).

Illustrator

3. Bearbeiten Sie das Logo nach Bedarf

Um das Logo zu bearbeiten, doppelklicken Sie einfach auf die Symbole im SymbolsBereich:

Symbol bearbeiten

Wenn Sie mit der Bearbeitung fertig sind, drücken Sie Escape und alle Instanzen des Symbols werden aktualisiert:

Aktualisiertes Symbol

4. Exportieren Sie das Bildmaterial

Im Exportteil kommt das Machtspiel von Illustrator zum Tragen.

File→ Export...als PNG, stellen Sie sicher, dass Sie Use Artboards(alle):

Logo exportieren

Die Zeichenflächen und Ihre Auflösungen werden alle automatisch basierend auf dem Namen der Zeichenfläche gespeichert.

Wenn das Originalbild aus Photoshop stammt ...

Sehr ähnlicher Aufbau, ignorieren Sie einfach den Symbolteil. Verwenden Sie stattdessen File→ Place...und platzieren Sie die .PSD-Datei so oft im Dokument, wie Sie Zeichenflächen haben. Sie können das Bildmaterial weiterhin in Photoshop aktualisieren. Jedes Mal, wenn Sie es in PS speichern, fragt Illustrator, ob Sie es aktualisieren möchten:

Verknüpfungen aktualisieren

An diesem Punkt würde ich jedoch wahrscheinlich stattdessen mit Yiselas Lösung gehen. Der Arbeitsablauf muss nicht zwischen zwei verschiedenen Programmen aufgeteilt werden.

http://www.cutandslice.me/ könnte hilfreich sein - ?! - kostenloses Plugin. Wenn Sie für Android entwickeln und genau das gleiche Bild in xhdpi hdpi mdpi benötigen, dann sieht es so aus, als würde dieses Plugin für Sie funktionieren (lesen Sie die Seite vor der Verwendung .... Sie müssen Ebenen mit einer bestimmten Syntax wie dem Hinzufügen von # speziell benennen vor dem Namen, damit es richtig funktioniert.

Bester Workflow, um ein Bild in 3 verschiedenen Größen zu speichern
AntwortenHierDatenschutz-Bestimmungen1y, 0v