《Ideen teilen: Den Titeltext auf dem Vorschaubild gestalten und verzieren》
Das Thema dieses Mal lautet „Textgestaltung und -verzierung“.
Ehe ich mich versah, habe ich bereits über zehn Artikel bei CLIP STUDIO TIPPS eingereicht! Neben der sorgfältigen Erstellung von Schritt-für-Schritt-Erklärungen ist die Gestaltung ansprechender Miniaturansichten der zeitaufwändigste Teil.
Da das Thema der „TIPPS des Monats“ in diesem Monat dekorative Texte sind, möchte ich in diesem Artikel meine Gedanken zur Gestaltung von Titeltexten in Vorschaubildern teilen. Ich hoffe, diese Tipps helfen Ihnen weiter!
Da die folgenden Beispiele und Demonstrationen hauptsächlich in traditionellem Chinesisch verfasst sind, kann die automatische Übersetzung (insbesondere hinsichtlich Wörtern, Satzpositionen usw.) ungenau sein. Bitte haben Sie Verständnis.
【Allgemeine Grundsätze für die Gestaltung von Titeltexten】
Für die Gestaltung von Titeltexten halte ich mich an folgende Grundsätze:
Wichtige Punkte hervorheben und vermitteln
Auffälliger, aber gut lesbarer Text
Bei der Kombination von Text und Bildern auf demselben Bildschirm einen einheitlichen Designstil wahren
Die Verwendung von Bildern in Titeln ist optional, sollte aber, falls verwendet, die Botschaft vermitteln.
Da ich außerdem meist Text in Bilder mit vielen Bildern einfüge, versuche ich, die Textverzierungen so einfach wie möglich zu halten, um ein überladenes Bild zu vermeiden.
Bei einigen Designs mit Text als Hauptteil sind jedoch auch etwas komplexere oder ausgefallenere Verzierungen möglich.
【Erklären Sie verschiedene Techniken der Titelgestaltung anhand von Beispielen】
In diesem Abschnitt verwende ich die Vorschaubilder meiner bisherigen Einsendungen als Beispiele, um verschiedene Techniken der Titelgestaltung zu veranschaulichen.
Da im selben Titeldesign mehrere Techniken verwendet werden können, kann es vorkommen, dass sich die Beispiele bei der Erläuterung verschiedener Punkte wiederholen. Bitte haben Sie Verständnis dafür.
🔴 Stufe 1: Schriftfarbe ändern
▶Verwenden Sie Farbe, um Textinhalte hervorzuheben
Am einfachsten ist es, wichtige Punkte durch unterschiedliche Farben hervorzuheben.
Im folgenden Beispiel werden für „Modellstil“ unterschiedliche Farben verwendet, wodurch das Schlüsselwort auf den ersten Blick erkennbar ist.
Darüber hinaus kann die Unterscheidung der einzelnen Wörter (dreidimensionale Perspektive/Modellstil/Illustration) die Leseflüssigkeit verbessern.
▶Verwenden Sie eine begrenzte Anzahl von Farben
Für Anfänger ist die Verwendung einer begrenzten Farbanzahl immer die sicherste Option.
Im folgenden Beispiel ist die Farbanzahl bewusst auf Dunkelblau und Rosa beschränkt.
Sobald Sie Ihre eigenen Farbgewohnheiten entwickelt haben, können Sie natürlich auch andere Farben verwenden.
Im folgenden Beispiel werden passend zum Thema Regenbogenfarben verwendet.
▶Die Farbauswahl von Text und Abbildungen sollte aufeinander abgestimmt sein
Darüber hinaus müssen die Farben von Text und Illustrationen aufeinander abgestimmt sein.
Beispielsweise ist der Bildteil von „Winter Snow Scene“ überwiegend blau, daher wird auch für den Text eine ähnliche Farbe gewählt, um eine Farbharmonie zu erreichen.
Neben der Tonharmonie können auch Farbabstimmungsprinzipien wie Tonkontrast angewendet werden. Der englische Teil von „Nostalgic Scenes“ verwendet Grün, das den Gegensatz zum Hauptteil (Orange) bildet.
【 💡 HINWEIS】
Farbabstimmung ist nicht dein Ding? Kein Problem!
Du lernst nicht nur die Prinzipien der Farbgebung kennen, sondern kannst auch einfach die Funktion [Farbverlaufszuordnung] in der [Tonwertkompensationsebene] verwenden, um ganz einfach verschiedene Farbkombinationen zu erhalten und dein eigenes Farbgefühl zu entwickeln!
Ausführliche Informationen zur Verwendung der Gradientenkorrektur finden Sie in diesem offiziellen Tutorial.
Geben Sie in der CLIP STUDIO PAINT-Bibliothek „Farbverlauf“ ein und stellen Sie die Suche auf „Farbverlauf“ ein, um von anderen Benutzern freigegebene Farbverlaufssets zu finden.
Informationen zum Installieren von Gradientengruppenmaterialien finden Sie in diesem offiziellen Tutorial.
🟠Level 2: Schriftgrößenänderung, Anordnung
Nachdem wir die Änderungen der Textfarbe verstanden haben, besteht der nächste Schritt darin, die Schriftgröße zu ändern, um Designziele zu erreichen.
Was die Bestimmung der Schriftgröße für jedes Wort betrifft, ist die naheliegendste Idee natürlich: Je wichtiger das Wort, desto größer sollte es sein.
Ich denke, dieser Punkt ist ohne weitere Erklärung verständlich.
Außerdem werde ich den Text bewusst in Zeilen unterteilen, anstatt ihn in einer Zeile zu platzieren.
Im Allgemeinen dauert das Lesen einer zu langen Textzeile länger als bei mehreren Zeilen, die aber jeweils kürzer sind. Daher können bewusste Zeilenumbrüche die Leseeffizienz erhöhen.
Darüber hinaus werde ich die Textgröße, den Zeichenabstand, den Zeilenabstand usw. bewusst anpassen, um eine geometrische Form zu bilden.
Passen Sie die Position der Parameter an:
Darüber hinaus können Sie den Text selbst als Hintergrund verwenden, die Schrift vergrößern und die Striche dicker machen, den positiven Raum in einen negativen Raum umwandeln und so den gestalterischen Eindruck verstärken.
(Das heißt, die Bereiche, die keine Strichpositionen sind, färben. Dies ist beim Wort „图“ (dem Wort links) leichter zu verstehen, da der äußere Rahmen zum „negativen Raum“ (leeren Raum) und der leere Raum im Inneren zum farbigen „positiven Raum“ wird.)
🟡Level 3: Rahmen, Schatten usw. zum Text hinzufügen
Sie können der Textfarbe auch weitere Variationen hinzufügen, zum Beispiel:
Kanteneffekte
Farbverlauf
Wörter einrahmen
Muster
Schatten
Diese Effekte können Text von Hintergrundbildern abheben und gleichzeitig die Lesbarkeit und Hervorhebung verbessern.
【 💡 HINWEIS】
Ist das Hinzufügen von Effekten wie Rahmen zeitaufwändig? Die Materialbibliothek von CLIP STUDIO PAINT bietet zahlreiche automatische Aktionen für dekorativen Text, die von Nutzern geteilt und heruntergeladen werden können. Nach der Installation erhalten Sie verschiedene Effekte ganz einfach mit nur einem Klick!
Geben Sie „Text“ in die Materialbibliothek ein und wählen Sie in der Suche „Automatische Aktion“ aus. Anschließend können Sie das gewünschte Material auswählen.
Darüber hinaus lassen sich Kanteneffekte auch ganz einfach durch automatische Aktionen erzielen.
Geben Sie in der Materialbibliothek „Umriss“ ein und stellen Sie die Suche auf „Automatische Aktion“, dann können Sie das passende Material auswählen.
Nachdem Sie das Material heruntergeladen haben, lesen Sie bitte die offizielle Hilfe zur Installationsmethode für automatische Aktionen diesen Artikel.
🟢Level 4: Fügen Sie Formen und Rahmen hinzu, die Text enthalten können
Neben der Anpassung von Farbe und Größe des Textes können Sie auch zusätzliche Rahmen hinzufügen, um den Text zu platzieren.
Manchmal genügt es, einfach ein einfaches geometrisches Muster zu verwenden!
【 💡 PUNKT】
Durch das Hinzufügen von Rahmen, Schatten und anderen Änderungen an einfachen geometrischen Mustern erhalten Sie ganz einfach ein schlichtes und nicht eintöniges Textfeld! Diese lassen sich alle mit den Formwerkzeugen zeichnen.
Oder Sie können Kanten hinzufügen und diese dann basierend auf dem Titeltext glätten, um daraus ein Textfeld zu machen.
【 💡 TIPP】
Neben diesen einfachen Textrahmen können Sie in der Bibliothek von CLIP STUDIO PAINT auch nach vorgefertigten Rahmen suchen!
Geben Sie in der Materialbibliothek „Rahmen“ ein und stellen Sie die Suche auf „Bildmaterial“ ein, um das passende Material auszuwählen.
Sie können auch Designelemente wie „Band“, „Blume“ usw. als Schlüsselwörter eingeben, um die Auswahl weiter einzugrenzen.
Einige einfache Sprechblasen, die man häufig in Comics sieht, eignen sich ebenfalls zum Übertragen von Text.
Geben Sie einfach „Dialog“ oder „Sprechblase“ in die Bibliothek ein, um sie zu finden.
Neben Bildmaterialien gibt es auch einige direkt gezeichnete Formwerkzeuge, die sich für Textrahmen eignen.
Suchen Sie nach „后光“, um verwandte Materialien zu finden.
Anwendungsbeispiele (links: Bildmaterial; rechts: Formwerkzeug)
🔵 Stufe 5: Dekorative Symbole hinzufügen
Darüber hinaus können Sie Textrahmen gestalten und dekorative Symbole hinzufügen, die auf den Textinhalt oder das Thema der Illustration abgestimmt sind.
Natürlich ist dies auch mit Materialien möglich!
【 💡 PUNKT】
Das Symbol kann in einer Textecke oder mittig platziert werden.
Wichtig ist, dass die Grafik die Lesbarkeit nicht beeinträchtigt.
Bezüglich des Größenverhältnisses empfehle ich, dass das Symbol nicht größer als ein Drittel des Textes ist.
Sollte das Symbol zu groß sein, können Sie es auch in einen Rahmen verwandeln, der den Text hält.
🟣Fallstudie
Anhand der oben genannten Designprinzipien wollen wir kurz eines der Titeldesigns analysieren!
Das folgende Vorschaubild stammt aus meinem vorherigen Tipp-Beitrag.
【Textteil】
Es werden nur drei Farben verwendet: Dunkelblau, Gelb und Rot.
Bewusste Zeilenumbrüche: (Puppe/Transformation), (Gebote und Verbote).
Textgröße: Reduzieren Sie die Größe des Hilfstextes „PuppetWarp“.
Der Text ist in einer geometrischen Form angeordnet.
【Muster】
Textrahmen: Das dreieckige Gittermuster, das bei Verwendung der Puppet-Warp-Funktion erscheint. Um die Verformung hervorzuheben, werden die vier Ecken zusätzlich nach außen gezogen, sodass eine konkave Linsenform entsteht.
Dekoratives Symbol 1: Der repräsentative „Pin“ für die Puppet-Transformationsfunktion wird verwendet.
Dekoratives Symbol 2: Da es in diesem Artikel um Verhaltensregeln geht, werden Häkchen und Kreuze verwendet, um die Botschaft des Titels zu unterstreichen.
Indem wir beides zusammenfügen, haben wir den Teil des Titeldesigns abgeschlossen!
⚠️NG-Projekt
Hier möchte ich noch einige NG-Angelegenheiten ergänzen, die oben nicht erwähnt wurden.
▶Bitte die Anzahl der Schriftarten begrenzen
Neben der Anzahl der Farben müssen Sie auch die Anzahl der Schriftarten begrenzen! Sofern Sie keinen Collage-Effekt erzielen möchten, verwenden Sie im Allgemeinen nur ein oder zwei Schriftarten in Ihrem Titel, nicht mehr als drei.
Zu viele Schriftarten können beim Lesen Verwirrung und Unbehagen verursachen. Siehe folgendes Beispiel:
▶Bitte begrenzen Sie die Wortanzahl im Titel
Ein Titel in einem Vorschaubild soll unter anderem Aufmerksamkeit erregen.
Zu langer Text macht die wichtigsten Punkte unklar und verlängert die Lesezeit, wodurch die Vorschau für die Leser weniger effektiv wird.
Das folgende Beispiel zeigt eine Vorschau meiner Tipps von vor einem halben Jahr.
Damals hoffte ich, dass mehr Leute das Vorschaubild verstehen würden, und habe deshalb darauf bestanden, sowohl die chinesische als auch die englische Version des gesamten Titels in das Bild einzufügen. Dadurch werden nicht nur die wichtigsten Punkte nicht hervorgehoben, sondern das Bild wirkt auch ziemlich langweilig ... Ist das etwa das Cover einer Schulzeugnisfolie?
Außerdem ist die Farbauswahl nicht gut genug.
Rosa, Hellblau, Rot, Grün, Gelb ... es werden zu viele Farben verwendet. Zum Glück sind weniger Elemente auf dem Bildschirm, sodass es nicht blendend aussieht.
Obwohl dies meine eigene Arbeit ist, muss ich leider sagen, dass diese Vorschau nicht ansprechend genug ist 😰
Also! Im nächsten Abschnitt zeige ich zum Abschluss dieses Artikels die Neugestaltung der obigen Vorschau!
[Praktische Gestaltung des Titeltextes]
Jetzt kommt der eigentliche Kampfteil!
Neben meinen Ideen zur Neugestaltung des Vorschaubilds und des Titeltextes stelle ich auch die darin verwendete CSP-Funktion vor. Die hier vorgestellten Funktionen sind jedoch relativ grundlegend. Leser mit Erfahrung im CSP-Betrieb können diesen Abschnitt gerne überspringen.
1. Titeltext festlegen
Zuerst müssen Sie sich natürlich für einen Titel entscheiden, d. h. die Anzahl der Wörter reduzieren.
Das Thema dieses Artikels lautet: „Wie man den Protagonisten in einer Komposition mit mehreren Personen hervorhebt“. Die Schlüsselwörter lauten „Komposition mit mehreren Personen“ und „Hervorhebung des Protagonisten“, daher lautet der vorläufige Titel: „Den Protagonisten in einer Komposition mit mehreren Personen hervorheben“.
Die englische Übersetzung lautet vorläufig „Gruppenkomposition“.
(Wenn Englisch oder andere westeuropäische Sprachen als Hauptsprache verwendet werden, müssen möglicherweise weitere Wörter gestrichen werden.)
2. Hintergrundbild vorbereiten
Normalerweise verwende ich die Illustrationen im Artikel als Hintergrund für das Cover.
Im Gegensatz zu anderen Artikeln konzentriert sich dieser Artikel jedoch ausschließlich auf die Komposition, weshalb keine hochentwickelten Illustrationen verfügbar sind.
Da der Artikel die Verwendung von CSP-3D-Puppen vorstellt, ist die Verwendung von 3D-Puppen zur Erstellung von Hintergrundbildern eine gute Wahl!
Im Folgenden habe ich die im Artikel vorgestellte Komposition mit 3D-Puppen reproduziert:
3. Brainstorming zu visuellen Ausdrücken, Bildern, Diagrammen usw. zum Thema
In diesem Schritt können Sie sich anhand der Schlüsselwörter verschiedene Bilder überlegen, die zum Thema passen.
Beispiele:
„Prominent“: Können Sie Farbkontraste verwenden, um das Motiv hervorzuheben? Kann der Fokusrahmen der Kamera ebenfalls die Bedeutung von Fokus vermitteln?
„Protagonist“: Kann eine Krone als Symbol hinzugefügt werden? Können wir auch einen Heiligenschein hinter dem Kopf hinzufügen, um den „Protagonisten-Halo“ auszudrücken? Oder ein Spotlight-Muster oder -Effekt hinzufügen?
„Mehrere Personen“: Können sich wiederholende Objekte verwendet werden, um mehrere Personen darzustellen?
„Komposition“: Was kann Komposition darstellen? Neun-Raster-Verhältnis (Drittelregel)? Goldenes Dreieck?
4. Titeltext gestalten
Entwerfen Sie den Titeltext basierend auf dem im vorherigen Schritt erstellten Bild.
Hier ist meine Vorgehensweise während des Designprozesses:
1. Beginnen Sie mit dem Text: Im Titeltext ist die Hervorhebung des Protagonisten wichtiger als die Darstellung einer Komposition mit mehreren Personen. Daher habe ich die Schriftgröße des Titeltextes größer angepasst.
2. Bei den Worten „in einer Komposition mit mehreren Personen“ habe ich Farbe verwendet, um die Komposition mit mehreren Personen hervorzuheben.
🎨 Bei den Farben habe ich mich für Rosa, Hellgrün und Dunkelblau aus dem alten Design entschieden. Diese können in späteren Schritten jederzeit geändert werden.
🔧 Normalerweise füge ich vor dem Kolorieren eine neue Ebene hinzu und lege sie als Schnittebene fest. Ändern Sie die Farbe erst mit dem Textwerkzeug, nachdem Sie sie endgültig festgelegt haben. So haben Sie mehr Flexibilität bei späteren Änderungen. Dieser Teil hängt jedoch von Ihren Gewohnheiten ab.
3. Bildbetrachtung: Der „Fokusrahmen in der Kamera“ ist nicht nur schlicht, sondern vermittelt auch die Botschaft „Fokus auf den Protagonisten“. Daher lege ich bei diesem Design Wert darauf.
4. Obwohl der visuelle Effekt durch den Fokusrahmen gut ist, wird die unklare Bedeutung des Wortes „außerhalb des Hauptteils“ verdeckt hervorgehoben. Dies muss angepasst werden.
Da der Fokusrahmen quadratisch ist, teilen Sie den Text „Protagonisten hervorheben“ in zwei Zeilen (Quadrate) auf und fügen Sie diese ein. Die Ausrichtungsfunktion dient zum Zentrieren von Text und Bildern.
5. „In einer Komposition mit mehreren Personen“ – dieser Satz stört leicht die Balance, egal wo er platziert wird. Deshalb habe ich versucht, die Wiederholungstechnik anzuwenden, indem ich diesen Satz in vier Sätze aufgeteilt und diese um den Fokusrahmen herum platziert habe.
🔧 Um die Lesbarkeit des Demonstrationsbildes zu verbessern, wird hier diese automatische Aktion verwendet, um einen Textrahmen hinzuzufügen.
🔧 Kopiere die Text-, Farb- und Rahmenebenen, füge sie ein und drehe sie mit der Transformieren-Funktion (Strg+T) und halte dabei die [Umschalt]-Taste gedrückt, um sie in den entsprechenden Winkel zu drehen.
🔧 Verwende die Ausrichtungsfunktion zum Ausrichten.
6. Die Abstände zwischen den vier Sätzen „in einer Mehrpersonenkomposition“ sind etwas störend. Ich möchte sie füllen, um mich sicherer zu fühlen.
7. Ich habe versucht, den Satzabstand anzupassen, aber das Ergebnis war nicht ansprechend. Deshalb habe ich ein weiteres Quadrat hinzugefügt, um die vier Sätze miteinander zu verbinden.
8. Das Gesamtdesign ist immer noch etwas eintönig, daher habe ich mich für einen hellgrünen Hintergrund, einen weißen Rahmen sowie einen rosa-roten Rahmen entschieden.
9. Die weißen Kreuze in den vier Ecken fallen zwar nicht ins Auge, vermitteln aber bei genauerem Hinsehen einen Eindruck von Details.
10. Da das Ganze quadratisch ist, wirkt es immer noch etwas zu starr und eintönig. Deshalb habe ich oben links ein Kronensymbol hinzugefügt, um das Thema aufzugreifen und die quadratische Form aufzulockern.
Das Hauptdesign des Titeltextes ist fertig!
Fügen Sie anschließend den Titeltext zum Hintergrundbild hinzu.
Da sich dieser Beitrag nur auf die Gestaltung des Titeltextes konzentriert, wird der Denkprozess zu diesem Teil etwas ausgelassen.
11. Entscheiden Sie anhand der aktuellen Komposition, wo der englische Zusatztext eingefügt werden soll.
Da sich oben links im Titeltext ein Kronensymbol befindet, habe ich den englischen Text unten rechts platziert, um das Bild auszugleichen.
💭 📝 Das Hinzufügen von Zusatztext oder kleinen Symbolen nach dem Kombinieren mit dem Bild ermöglicht eine flexiblere Anpassung der Gesamtkomposition.
Beispielsweise befinden sich in der Puppet Warp-Vorschau alle kleinen Symbole am rechten Rand, da sich der Titeltext auf der rechten Bildschirmseite befindet. Betrachtet man hingegen nur den Titeltext, wird dieser nicht an dieser Position angezeigt.
12. Passen Sie die englische Kursivschrift an, um das Bild weniger steif zu gestalten.
Fügen Sie weitere Fokusrahmenmuster und Drittelhilfslinien hinzu, um das Bild abzurunden.
Beenden!
Abschluss
Vielen Dank fürs Lesen!
Obwohl der Titel dieses Artikels dekorativen Text für Vorschaubilder behandelt, können Sie diese Techniken durchaus nutzen, um Texten auch für andere Kreationen wie Poster, Grußkarten und sogar Charakterillustrationen mehr Originalität zu verleihen!
Weitere Textbearbeitungsmethoden, darunter Vektorebenen, Textverformung und individuellere Materialempfehlungen, habe ich in meinen vorherigen Tipps ausführlicher erläutert. Schauen Sie doch mal rein:
Dieser Artikel ist nur ein Gedankenaustausch, und es gibt noch Verbesserungspotenzial. Denkt daran: Es gibt definitiv kreativere Möglichkeiten, Textdekorationen zu gestalten!
Was haltet ihr von diesem Beitrag?
Schreibt mir gerne eine Nachricht! Ich hoffe, diese Informationen sind hilfreich für euch.
Dieser Beitrag gefällt
Kommentar