Ausführliches Webcomic-Tutorial! Vom Entwurf bis zum polierten.

16.956

3mii1y

3mii1y

Ein Webtoon ist ein vertikaler Scrolling-Comic oder ein „Web-Comic“. Jede Plattform hat unterschiedliche Upload-Dimensionen für ihre Seiten. Beachten Sie daher bitte Ihre Einschränkungen, wenn Sie Ihre Layouts planen.

 

Für dieses Tutorial werden wir Line Webtoons verwenden und in Zukunft wird es als Webtoons bezeichnet.

 

  • Dieses Tutorial basiert auf der Annahme, dass Sie ein Konto bei der von Ihnen ausgewählten Webcomic-Hosting-Site haben. Informationen zum Hochladen Ihres Webcomics finden Sie in den offiziellen Tutorials.

d.h. Webtoons, Taptastic.

 

GLOSSARBEDINGUNGEN

 

Webtoons: Die Website / der Hosting-Service von Line Webtoons

CSP: Clip Studio Paint-Programm

Arbeitsdatei / -größe: Die Datei, die Sie auf Ihrer EDIT-ABLE-Zeichenfläche gezeichnet haben

Leinwand / Arbeitsdatei: Die Zeichenfläche Ihrer Datei (austauschbar)

Datei / Größe hochladen: Die Datei, die Sie auf die Site hochladen - die FINISHED-Datei

Seiten: Jede Datei, die auf eine vertikale Webcomic-Hosting-Site hochgeladen werden kann

Panels: Ein traditionelles "Panel" eines Comics

Vektorfenster: Das Tool, mit dem CSP Vektorlinienfelder in einem Ebenenordnerformat erstellt

Buchformat: Ein traditionelles Comic-Layout

Vertikales Format: Ein scrollendes Comic-Layout

WIE STELLEN WIR EINEN VERTIKALEN COMIC AUS?

Da wir in visuellen Medien arbeiten und wunderschöne Kunstwerke zeigen möchten, müssen wir unser Denken vom typischen „Buchformat“ ändern und darüber nachdenken, Panels auf effektive Weise für ein scrollendes vertikales Format auszulegen. Wir behandeln dies, indem wir in 'SEITEN' denken.

 

Webtoons werden in "Seiten" mit einer Größe von 800 x 1280 hochgeladen. Dies bedeutet, dass Sie mehrere "Seiten" benötigen, um eine lange vertikale Aktualisierung durchzuführen.

FÜHREN SIE DAS AUGE VERTIKAL

Denken Sie beim Auslegen Ihrer Kunst daran, wie sie beim Scrollen aussehen wird. Ihr endgültiger Upload beträgt 2,67 x 4,27 Zoll pro "Seite". Wir reden klein. Wenn Sie die Wirkung einer ganzseitigen Illustration wie in einem Buchformat erzielen möchten, muss die Grafik zwei oder mehr "Seiten" einnehmen. Je länger Sie Ihren Leser scrollen lassen, desto spannender wird Ihre Spannung.

 

Dies liegt daran, dass Sie ihr Auge zwingen, sich auf der Seite zu bewegen. Diese Technik wird als "Leading the Eye" bezeichnet. Auf diese Weise schaffen Sie Fluss und Lesbarkeit. Bei einem vertikalen Format muss man das Auge etwas anders führen, aber das Konzept ist das gleiche. Für mehr Wirkung lassen Sie Ihren Leser mindestens zwei Seiten länger scrollen und führen Sie das Auge nach unten.

 

 

Beispiel eines Buchformats

Die Zahlen sind dort, wo Ihr Auge natürlich landet und um das Kunstwerk herum geführt wird.

Beispiel eines vertikalen Formats

LAYOUT IHRE PANELS GANZ

Bei einem vertikalen Format sind Sie darauf beschränkt, wie Sie Ihre Bedienfelder pro Seite gestalten können. Denken Sie daran, dass Sie pro Seite weniger als 800 Pixel breit sind. Trotzdem gibt es wirklich keine Begrenzung, wie Sie Ihre Comicseiten einrichten können.

 

HINWEIS: „Bedienfelder pro Seite“ - Wenn ich meine Bedienfelder auslege, halte ich mich gerne an ein oder zwei Bedienfelder pro Seite, da die Größe auf Mobilgeräten sehr klein werden kann. Webtoons ermöglicht die Größenänderung der Datei auf 320x512px, sodass sie sehr klein wird.

 

ÄNDERUNGSFELDER

Das Abwechseln von Panels in Größe und Länge verleiht der Seite Tiefe und macht die Panels Teil des Bildmaterials und führt das Auge.

BOX PANELS

Wenn Sie Ihr Bildmaterial in der gleichen Größe halten, fühlt sich Ihr Comic einheitlich, klar und sauber an.

ILLUSTRATIONSFELDER

Kunsttafeln auf einer einzelnen Illustration können Ihren Comic immersiver und wie eine einzigartige Leinwand wirken lassen. Hinweis: Dies ist zwar eine wirklich coole und schöne Methode, aber denken Sie daran, dass sie sehr schnell übertrieben werden kann. Ich schlage vor, diese Art von Panel-Layout für sehr wichtige Szenen zu verwenden.

WELCHE GRÖSSE SOLLTE IHRE ARBEITSDATEI SEIN?

GLOSSAR -

Arbeitsdatei / -größe - die Datei, auf der Sie zeichnen - Ihre EDIT-ABLE-Zeichenfläche

Datei / Größe hochladen - die Datei, die Sie auf die Site hochladen - die FINISHED-Datei

Leinwand - Zeichenfläche für das Kunstwerk

 

 

BESTE ÜBUNG

Wenn Sie mit 800px zeichnen, haben Sie eine Arbeitsdatei von weniger als drei Zoll. Wenn Sie jemals diese fertige Kunst vergrößern müssen, erhalten Sie Kunst, die wie eine zensierte Leiste aussieht. Nicht süß. Die beste Vorgehensweise besteht darin, Ihre Datei zu skalieren. Ich möchte eine Arbeitsdatei haben, die dreimal so groß ist (x3) wie die endgültige Upload-Datei. Auf diese Weise habe ich viele Pixel, mit denen ich herumspielen kann, wenn ich ein Panel in einen Druck verwandeln möchte.

 

Beispiel für 300 dpi gegenüber 72 dpi auf Bildern:

GRÖSSE HOCHLADEN

Ihre endgültige Upload-Seite muss 800 x 1280 sein, daher multiplizieren wir diese mit 3, wodurch wir eine Arbeitsfläche von 2400 x 3840 erhalten.

 

Seite mit Dateigröße hochladen:

800 x 1280

 

Seite mit der Größe der Arbeitsdatei (x3):

2400 x 3840

 

Es wird so aussehen, wenn die Upload-Größe verkleinert wird (das große Bild ist die Arbeitsdatei (2400 x 3840) und das kleine die Upload-Größe (800 x 1280)).

ARBEITSDATEI GRÖSSE

Für eine Arbeitsdatei möchte ich fünf Seiten lang sein. Dadurch kann ich es in überschaubaren Dateigrößen an meinen Coloristen senden, aber ich kann auch nicht für immer über die Leinwand scrollen. Ich verwende die Arbeitsdateigröße von 3840 und das Fünffache von 19200 (3840 x 5 = 19200). Die genaue Größe der Arbeitsdatei beträgt 2400 x 19200, wobei die Größe zum Hochladen auf 800 x 6400 geändert wird.

 

Hier ist die letzte Aufschlüsselung der Seite:

Lassen Sie sich von den folgenden Zahlen nicht einschüchtern. Es ist zusätzlich Mathematik. Wir haben das.

BATCHING IHRE SEITEN

Ich arbeite in Stapeln von fünf (5) Seiten, bis ich mit dem Kapitel fertig bin. Dies umfasst alle Logos und sozialen Medien, Kapitelüberschriften und Abspann. Eine Seite funktioniert gut für diese Informationen, aber ich habe gesehen, dass bis zu fünf Seiten verwendet wurden, um Kunden und Assistenten zu danken. Es liegt an dir. Die Leinwand ist deine Welt und du kannst sie so gestalten, wie du willst.

 

Beispiel für „Seiten“ und Skizzieren des Grafik- und Panel-Layouts:

WIE FUNKTIONIERT DIE ÄNDERUNG DES TEXTES FÜR MOBILE?

Ihre Seiten sind 800x1280 und auf dem PC perfekt lesbar. Bei der Größenänderung auf Mobilgeräte treten jedoch Probleme mit der Lesbarkeit von Text auf. Dies liegt daran, dass bei der Größenänderung eines Bilds Pixel verloren gehen, um alles in seiner neuen "Rahmengröße" anzupassen. Stellen Sie sich vor, Sie müssten zusätzliches Papier wegschneiden, damit es in den Rahmen passt.

 

Beispiel für 300 dpi gegenüber 72 dpi (Beide haben eine Leinwandgröße von 3,21 x 0,82 Zoll:

Wenn Sie Text auf Ihre Arbeitsdatei anwenden, sollten Sie mindestens 35pt Schrift verwenden. Dies kann sich je nach Schriftart ändern. Ich schlage vor, es selbst bei einem Text-Upload auf der Comic-Host-Site zu überprüfen, um sicherzustellen, dass Sie die von Ihnen ausgewählten Schriftarten lesen können. Wenn Sie der Größe der Upload-Datei Text hinzufügen, können Sie eine Schriftart von 8pt bis 15pt verwenden. In den folgenden Beispielen können Sie sehen, wie der Text mit der Größenänderung der Seite für Handys kleiner wird.

 

Ich habe festgestellt, dass das Hinzufügen von Sprechblasen, Text und Soundeffekten auf einer Upload-Leinwandgröße von 800 x 1280 eine bewährte Methode ist, da Sie genau sehen können, wie groß der Text sein wird.

Mit welchem Workflow sollte ich beginnen?

Das Folgende sind die Schritte, mit denen ich meinen Comic zeichne. Durch viel Ausprobieren (Stunden und Stunden) habe ich etwas gefunden, das für mich gut funktioniert. Dies sind Tipps, die Sie verwenden und anpassen können, wenn Sie die Erstellung Ihres Webcomics komfortabler gestalten möchten.

 

 

BESTE ÜBUNG

Dateivorlagen sind hilfreich und sparen Zeit. Im Wesentlichen werden Ordner und Ebenen für jede neue Datei gefüllt, die Sie erstellen. Sie können lernen, wie Sie Ihre eigenen erstellen, indem Sie in der Bedienungsanleitung (F1) auf HILFE gehen und nach „Ebene als Vorlagenmaterial registrieren“ suchen.

ODER

Schau dir mein Video-Tutorial an. Ich gehe es genauer durch.

MEINE DATEIVORLAGE

Dies ist meine Vorlage mit allen Ordnern und Ebenen, die ich täglich zum Zeichnen des Comics verwende.

MEIN WORKFLOW

 

Leere Leinwand → Skizzieren → Lineart → Farbe → Effekte → Größe der Leinwand ändern, um Größe hochzuladen → Bedienfelder → Sprachblasen → Text → Sound-Effekte → Seiten verbinden

 

Ich zeichne alle meine Skizzen im Ordner 'SKETCHES'. Alle meine Strichzeichnungen (Tinten) werden in den Ordner 'LINEART' verschoben. Ich zeichne auf eine Vektor * -Ebene namens LINEART für meine Strichgrafiktinten. Je nachdem, was für diese Seiten besser funktioniert, kann ich einen neuen COLOR-Ordner erstellen oder einfach alles im LINEART-Ordner ausführen.

 

  • HINWEIS: Es ist sehr wichtig, dass Sie Strichzeichnungen auf Vektorebenen erstellen! Es hilft beim Färben und Ändern der Größe. CSP bietet großartige Tutorials zu Vektor- und Rasterebenen. Bitte schauen Sie sie sich an, wenn Sie sich nicht sicher sind, wie Sie sie verwenden sollen. Hier ist ein großartiges Turtorial:

HINWEIS: Sie können den Füllbereich nicht auf einer Vektorebene verwenden. Nur eine Rasterebene ermöglicht das Färben. Weitere Informationen zur Verwendung des Füllwerkzeugs finden Sie hier:

PASSEN SIE DIE ARBEITSDATEI AN

Leere Leinwand → Skizzieren → Lineart → Farbe → Effekte → LEBENSMITTEL VERÄNDERN, UM GRÖSSE HOCHLADEN → Bedienfelder → Sprachblasen → Text → Sound-Effekte → Seiten verbinden

 

Ich ändere die Größe der gesamten Arbeitsdatei auf die Upload-Größe von 800x6400.

HINWEIS: Ich reduziere das Bild NICHT. Alles bleibt auf separaten Ebenen / Ordnern.

 

Gehen Sie dazu zu BEARBEITEN → BILDAUFLÖSUNG ÄNDERN → Ändern Sie die Auflösung ZUERST auf 300 → Ändern Sie die Breite auf 800 → Höhe, um sie automatisch auf 6400 anzupassen. Ihre Leinwandgröße wird auf 800 x 6400 300 dpi geändert.

Ich gehe in meinem Video-Tutorial ins Detail. Bitte schauen Sie sich Teil 2 an!

PANELS

Leere Leinwand → Skizzieren → Lineart → Farbe → Effekte → Größe der Leinwand ändern, um die Größe hochzuladen → PANELS → Sprachblasen → Text → Sound-Effekte → Seiten verbinden

 

Eine kurze Übersicht über die Funktionsweise von Panels in CSP:

Dies sind Ordner, die als Maske für alle Grafiken im Ordner dienen

Sie sind Vektorlinien

Jedes Panel ist ein eigener Ebenenordner

 

Jedes Mal, wenn Sie ein neues Bedienfeld erstellen, wird eine Ebene erstellt, die gleichzeitig als Ordner fungiert. Alles, was Sie von da an zeichnen, wird automatisch direkt in dieses Bedienfeld verschoben. Ich habe nicht herausgefunden, wie ich das verhindern kann, aber ich mag diese Funktion nicht. Deshalb zeichne ich zuletzt meine Vektorfelder. Beachten Sie, dass Vektorlinien für die Bedienfelder als Maske fungieren.

 

Zeichnen Sie mit dem Bedienfeld-Werkzeug Ihre Bedienfelder in der gewünschten Größe. Stellen Sie sicher, dass Sie ZU AUSGEWÄHLTEM ORDNER HINZUFÜGEN auswählen, wenn Sie nicht mit jedem Bedienfeld eine neue Ebene erstellen möchten.

Wenn Sie fertig sind, legen Sie Ihre Zeichnungsebenen in den PANEL-ORDNER ab. Dadurch werden automatisch alle Grafiken außerhalb der Bedienfeldlinien maskiert.

Alles, was sich über der Bedienfeldebene befindet, wird vom Bedienfeld nicht zugeschnitten. Ich benutze dies für Kunstwerke, die ich außerhalb der Panel-Box sitzen möchte.

CUSTOM SPEECH BUBBLES

Leere Leinwand → Skizzieren → Lineart → Farbe → Effekte → Größe der Leinwand ändern, um Größe hochzuladen → Bedienfelder → SPRACHBUCHEN → TEXT → Sound-Effekte → Seiten verbinden

 

Zeit, Ihren Text hinzuzufügen. Ich mache benutzerdefinierte Sprechblasen, um Charaktere voneinander zu unterscheiden. Sprechblasen sind ebenfalls Vektorlinien, werden jedoch automatisch mit einer Hintergrundfarbe ausgefüllt. Dies macht es einfach, Blasen hinzuzufügen, ohne dass Sie zurückgehen und jede einzelne ausfüllen müssen.

 

BALLONWERKZEUG → Linienfarbe und Füllfarbe auswählen → Ballon platzieren → Ballonschwanz hinzufügen

Verwenden Sie das OPERATION-Werkzeug (es sieht aus wie ein 3D-Quadrat mit einer Maus darüber), um die Blase auszuwählen.

 

BETRIEBSWERKZEUG → Blase auswählen → Pinselform auswählen → Wählen Sie den gewünschten Linientyp aus.

 

Es wird so aussehen! Sie können mit der Ebeneneigenschaft herumspielen, um Leuchten oder andere spezielle Optionen hinzuzufügen. Habe Spaß! Hinweis: Für ein organischeres Aussehen können Sie die Sprechblasen von Hand zeichnen ODER die Vektorpunkte in der Blase anpassen, um die Form zu ändern.

TEXT HINZUFÜGEN

Weitere Informationen zum Hinzufügen von Text zu Ihren Sprechblasen finden Sie in diesem Tutorial:

SPLIZEN SIE IHR KAPITEL AUF SEITEN

Leere Leinwand → Skizzieren → Lineart → Farbe → Effekte → Größe der Leinwand ändern, um Größe hochzuladen → Bedienfelder → SPRACHBUCHEN → TEXT → Sound-Effekte → SPLICE-SEITEN

 

CSP kann eine Datei nicht länger als 30.000 Pixel verarbeiten, sodass Sie keine unendliche Zeichenfläche verwenden können. Deshalb haben wir in Chargen gearbeitet, damit unser Leben einfacher wird. Um Ihre Arbeitsdatei in Upload-Dateien mit einer Größe von 800 x 1280 zu bringen, müssen Sie sie in Scheiben schneiden. CSP verfügt nicht über eine integrierte Funktion, sodass Sie ein anderes Programm benötigen. Ich benutze GIMP, weil es eine kostenlose Option ist, obwohl Photoshop auch diese Funktion hat.

 

Öffnen Sie GIMP und wählen Sie Datei → Als Ebenen öffnen → Suchen Sie Ihre Upload-Datei → Öffnen.

 

Jetzt erstellen Sie Ihre GUIDES zum Spleißen der Seiten.

 

Gehen Sie zu Bild → Anleitung → Neue Anleitung → Ein Feld wird angezeigt → Stellen Sie sicher, dass Sie die Ausrichtung Ihrer Anleitung in HORIZONTAL geändert haben, und geben Sie das Pixel ein, auf dem die Seite geschnitten werden soll. Für die erste Seite ist es 1280, die nächste ist 2560, dann 3840 und die letzte ist 5120.

BRINGEN SIE DIE ANDEREN HOCHLADEDATEIEN EIN

Sobald Sie alle Ihre Anleitungen eingerichtet haben, können Sie Ihre anderen Upload-Dateien einbringen. Datei → Als Ebenen öffnen → Suchen Sie Ihre Upload-Datei → Öffnen.

HINWEIS: Wenn Sie Ihre Dateien in Scheiben schneiden, muss nur diese Ebene sichtbar und die Ebene ausgewählt sein, da sonst die Ebene nicht registriert wird.

 

Zum Slice gehen Sie zu Filter → Web → Slice → Ein Feld wird geöffnet → Einstellungen nach Ihren Wünschen ändern → OK → Dateien werden in 800x1280 Seiten gespleißt.

Erklärungen zu den Einstellungen:

Pfad für den HTML-Export: Name des Ordners, in dem Sie Ihre Seiten speichern möchten.

 

Dateiname für den Export: Ich lasse als Slice, weil ich diese Einstellung nicht verwenden werde.

 

Bildnamenpräfix: Wie soll jede Datei aufgerufen werden? Ich behalte das Präfix "Slice" oder ändere es in "Seite" und füge für jeden Stapel eine Nummer hinzu, damit sie in numerischer Reihenfolge gespeichert werden. Dies hilft beim Upload. Beispiel: Slice2, Slice3, Exkremente.

 

Bildformat: Nur JPEG

 

Separater Bildordner: Nein. Sie möchten, dass alle im selben Ordner gespeichert werden.

 

Ordner für den Bildexport: Scheint keinen Unterschied zu machen. Ich nenne es EP_ (Nummer einfügen). d.h. EP_2

 

Leerzeichen zwischen Tabellenelementen: 0 (Ändern Sie dies nicht, da sonst nach dem Hochladen auf die Website Leerzeichen zwischen Ihren Dateien entstehen.)

 

Die letzten beiden Optionen werden nicht benötigt, ändern Sie also nicht die Einstellungen.

Wenn Sie diese Methode nicht verwenden möchten, können Sie eine Online-Site verwenden, die die Arbeit für Sie erledigt. Dies wird Croppy genannt und in Kyorins Tutorial erklärt.

Hier ist der Link:

ERLEDIGT! Jetzt können Sie Ihre Seiten auf den Host der Website hochladen!

Ich hoffe, dies hat die wesentlichen Teile der Erstellung Ihres eigenen Webtoons erklärt. Bitte lassen Sie mich wissen, wenn ich etwas anderes erklären oder die Erklärungen klarer machen muss. Sehen Sie sich auch das Tutorial-Video an, da es hilfreich sein kann, wenn ich es in Echtzeit mache.

Wenn Sie das Tutorial sehen möchten, klicken Sie auf das Video unten!

Kommentar

Neu

Neu! Offizielle Tutorials