Photoshop-Ebenen einfach mit Cut & Slice Me exportieren

Schneiden und Schneiden im Designprozess ist zweifellos eine zeitaufwendige Arbeit. Außerdem wird es immer komplizierter, wenn Sie Hunderte von Schichten in verschiedenen Maßstäben schneiden und schneiden müssen.

Natürlich gibt es Kopien zusammengeführt, Ebenen in Dateien exportieren oder Features in Photoshop. Aber diese Ansätze haben nicht viel geholfen, den Schneide- und Schneideprozess schneller zu machen. Was Sie brauchen, ist ein Plugin.

Cut & Slice Me ist eine Photoshop-Erweiterung für die Vereinfachung des Schneidens und Schneidens von Designs . Sie können Ihre Layer dann für iPhone-, Android- oder Desktop-Geräte exportieren. Die exportierten Dateien werden mit verschiedenen Skalen und Auflösungen geliefert, wie Retina für iPhone oder HDPI, LDPI, MDPI und XHDPI für Android.

Cut & Slice Me Installation

Um das Cut & Slice Me Plugin verwenden zu können, müssen Sie mindestens Adobe Photoshop CS6 / CC auf Ihrem Computer installiert haben . Laden Sie das Plugin herunter (und die Beispiel-PSD-Datei, an der wir später arbeiten werden).

Sobald der Download abgeschlossen ist, doppelklicken Sie auf die Datei CutAndSliceMe.zxp und die Installation beginnt automatisch mit dem Adobe Extension Manager . Folgen Sie den Anweisungen und starten Sie Photoshop neu, falls es bereits geöffnet war.

Um das Plugin im rechten Fenster von Photoshop sichtbar zu machen, gehen Sie einfach zu Fenster> Erweiterungen> Schneiden und Schneiden .

Anfangen

Cut & Slice Me ist einfach zu benutzen, aber Sie müssen erst ein wenig arbeiten, um sicherzustellen, dass das Plugin beim Schneiden und Schneiden effizient arbeitet.

Zunächst müssen Sie Ihre Layer-Objekte in Ordnern organisieren, da Cut & Slice Me nur Gruppennamen prüft. Sie müssen auch das "@" - Symbol am Ende des Layers gruppenname hinzufügen, den Sie exportieren möchten.

Slicing definierte Größe

Alle unnötigen transparenten Pixel werden im Exportvorgang entfernt. Um die exportierte Datei in der gewünschten Größe zu halten:

1. Stellen Sie sicher, dass Sie unter Bearbeiten> Voreinstellungen> Allgemein die Einstellung "Vektorwerkzeuge einrasten und in Pixelraster transformieren" aktiviert haben .

2. Erstellen Sie dann eine rechteckige Vektorebene für die gewünschte Größe.

3. Platzieren Sie dieses Shape ganz oben in der Gruppe, damit es dem Plugin die Größe des Bereichs mitteilt, in den Sie exportieren möchten. Schließlich benennen Sie die Form "#" .

Bildquelle: Cut & Slice Me Grundlegendes Tutorial

Anderer staatlicher Vermögenswert

Bei Schaltflächen, die oft unterschiedliche Zustände haben, können Sie eine spezielle Methode verwenden.

1. Erstellen Sie beim Exportieren einer Schaltfläche eine neue Ebenengruppe für die Schaltfläche, und fügen Sie in ihrem Namen die Bezeichnung "_BTN" ein.

2. Erstellen Sie innerhalb der Gruppenschaltfläche eine weitere Gruppe, die Schaltflächenstatus enthält, und benennen Sie sie entsprechend den Status . Die Gruppenzustandsnamen sollten wie folgt lauten:

• normal
• schweben
• geklickt / gedrückt
• ausgewählt
• behindert

Abgesehen von Schaltflächen kann diese Regel auch auf andere Elemente angewendet werden, die unterschiedliche Zustände haben, wie der folgende Screenshot.

Verwenden von Cut & Slice Me

Sehen wir uns an, wie Cut @ Slice Me Ihnen bei Ihren Entwürfen helfen kann. Wie bereits erwähnt, verwenden wir die Muster-PSD-Designdatei von der Cut & Slice Me-Homepage.

Wie bereits erwähnt, können Sie mit Cut & Slice Me auf iPhone, Android und Web exportieren. Sie können wählen, ob alle Assets, Untergruppen oder ausgewählten Layer in Slices aufgeteilt werden sollen. Schneiden Sie das Musterdesign auf das iPhone und exportieren Sie es.

Nachdem der Exportvorgang abgeschlossen ist, finden Sie die Ergebnisdateien im ursprünglichen Speicherort der PSD-Datei (siehe Abbildung).

Soweit ich weiß, haben Sie eine solide Vorstellung davon, wie das Plugin bereits funktioniert. Also, versuchen wir das Plugin mit einem anderen Design zu verwenden.

Mit der Webpaint-Vorlage von Elemis Freebies erfahren Sie, wie Sie die Plugin-Regeln von Grund auf einrichten .

Der Einfachheit halber verwenden wir nur die Hälfte des Designs für den Export. Der folgende Screenshot zeigt, wie die Ebenen vor und nach der Verwendung strukturiert sind.

Auf der linken Seite (in rot) befinden sich die ursprünglichen Ebenen. Nach dem Umordnen und Umbenennen der Zustände der Schichten gelangen wir zu dem, was rechts ist (blau).

Da die Designvorlage für das Web verwendet wird, wählen Sie im Plugin-Fenster den Gerätemodus für Desktop (Monitor Symbol). Hit Cut Alle Assets .

Jetzt wurde das definierte Asset erfolgreich zerlegt.

Beachten Sie, dass Sie, wenn Sie Ihr eigenes Design schneiden, es in der höchsten Auflösung haben müssen, da die endgültigen Bilder für xhdpi in Android und Retina in Apple-Geräten sind. Dieses Plugin führt die volle Auflösung des Designs aus und skaliert es für den Export in verschiedene Größen .

Fazit

Keine Zeit wird verschwendet, wenn Sie mit diesem Photoshop-Plugin schneiden und schneiden. Mit ein wenig mehr Disziplin in der Layer-Organisation können selbst komplexe Designs mit Präzision und Leichtigkeit geschnitten werden.

8 Möglichkeiten, wie Freelancer Ihr Startup starten können

Das sind großartige Zeiten, um als Freelancer zu arbeiten. Die freiberufliche Industrie setzt sich wie wildes Feuer durch, und es wird mehr und mehr Geld in die Mischung gegossen. Es gibt bereits Tonnen von Unternehmen, die die Industrie nutzen. Wenn Sie ein junger, aufstrebender Unternehmer sind, möchten Sie, dass Ihr Startup mit den niedrigsten Gemeinkosten läuft. K

(Tech- und Design-Tipps)

4 AdBlock Plus Alternativen für Chrome

Werbeblocker sind sehr einfache Werkzeuge. Installieren Sie es in Ihrem Browser, und die große Mehrheit der Anzeigen wird Sie in keiner Weise mehr stören . So nützlich sie auch sein mögen, es gibt Leute, die das Gefühl haben, dass Werbeblocker ein bisschen langweilig sind .Wenn Sie einer von denen sind, die einen ziemlich interessanten Werbeblocker bevorzugen und wenn Ihr Hauptbrowser Google Chrome ist, dann sind hier vier Werbeblocker mit einer einzigartigen Wendung.CatB

(Tech- und Design-Tipps)