Ich habe Stanley Lieber nicht getötet: Wie man mit 9front zeichnet

 (triapul.cz)
1 Punkte von GN⁺ 3 시간 전 | 1 Kommentare | Auf WhatsApp teilen
  • Eine vollständige Übersicht über den Zeichen-Workflow in 9front mit Fokus auf paint(1), von der Auswahl des Eingabegeräts über die Canvas-Verwaltung und Bildbearbeitung bis zum Export
  • Die Arbeit erfolgt im internen Format image(6) von 9front; gezeichnet wird mit paint(1), anschließend wird das Ergebnis mit page(1), crop(1), vcrop(1), resize(1) und rotate(1) angepasst
  • paint(1) bietet keine Druckempfindlichkeit, keine Ebenen und kein Ausschneiden/Einfügen, daher muss man Arbeitsfläche und Farben wie auf Papier selbst verwalten
  • Behandelt werden Maus, Finger, Stift, externes Tablet und Eingaben über drawterm/VNC; da Stifttasten Mausklicks nachahmen, ist eine Anordnung mit Tastatur und Maus in Reichweite praktisch
  • Für das Teilen nach außen eignet sich die Umwandlung nach PNG; PNG oder JPG sind keine direkt bearbeitbaren Formate für paint(1), crop(1) oder vcrop(1) und müssen bei Bedarf zurück in das 9front-image-Format konvertiert werden

Grundaufbau zum Zeichnen in 9front

  • Zum Zeichnen braucht man ein „Werkzeug zum Zeichnen“ und eine „Oberfläche zum Zeichnen“, und in 9front kann man neben echten Stifteingabegeräten auch verschiedene andere Eingabemethoden verwenden
  • Auf jedem Computer, auf dem 9front läuft, kann man How to draw nachvollziehen; wer ein Gerät zum direkten Zeichnen auf dem Bildschirm möchte, ist mit einem 2-in-1-Laptop mit Wacom-Unterstützung gut bedient
  • Die folgenden Geräte aus der ThinkPad-Reihe haben in der Praxis gut funktioniert

Eigenschaften der einzelnen Eingabegeräte

  • Zeichnen mit der Maus ist eine alte Methode, hat aber den Vorteil, dass sie mit jedem Computer mit Maus funktioniert
  • Fingereingabe ahmt bei Bildschirmberührung den linken Mausklick nach, kann aber andere Klicks nicht ersetzen, daher sollte eine Maus griffbereit sein
  • Externe Tablets mit eigenem Bildschirm funktionieren unter 9front möglicherweise nicht, Modelle ohne Bildschirm können dagegen funktionieren
    • Empfohlen wird das GAOMON S620, das unter 9front Plug-and-Play gut funktioniert
    • Das Wacom CTL-672 arbeitet wie ein Touchpad mit relativen Koordinaten
    • Das Wacom CTL-490 funktioniert nicht
    • Weitere Informationen finden sich in [fqa] 3.2.4 - Tablet Digitizers
  • Nur mit der Tastatur lässt sich kaum sinnvoll zeichnen, für die Arbeit mit paint(1) ist sie aber nötig
    • Auf Tablet-Computern oder in besonderen Umgebungen, in denen eine physische Tastatur schwer erreichbar ist, kann die Bildschirmtastatur bitsy/keyboard verwendet werden
    • Beispiel zum Starten: rio -k 'bitsy/keyboard -n'
  • Mit drawterm/VNC kann man sich mit einem entfernten oder virtuellen 9front-Computer verbinden und so vielfältigere Eingabegeräte nutzen
    • Man kann etwa auf einem Android-Telefon mit dem Finger zeichnen, unter Linux und MacOS mit der Maus zeichnen oder unter Windows Eingabegeräte verwenden, die 9front nicht direkt unterstützt
    • Die zugehörige Website ist drawterm.9front.org

Das Format image(6) und die Voraussetzungen von paint(1)

  • Zeichnen, Zuschneiden und Bildbearbeitung in 9front erfolgen im internen Dateiformat image(6)
  • Während man ein Bild erstellt, muss man sich um das Format nicht groß kümmern; zum Teilen nach außen muss es jedoch in ein anderes Format umgewandelt werden
  • Als Dateinamen wird beispielhaft etwas wie file.pic verwendet, man kann aber jeden gewünschten Namen wählen
  • Diese Anleitung behandelt von den verschiedenen Zeichenprogrammen in 9front nur paint(1)
  • An paint(1) sollte man eher so herangehen wie an Papier, Tinte und Farbe als wie an ein typisches digitales Zeichenprogramm

Einschränkungen und grundlegende Bedienung von paint(1)

  • Stift- und Tablet-Tasten ahmen Mauseingaben nach; in der Anleitung werden daher alle Vorgänge als Mausbedienung beschrieben
    • Der schwebende Zustand über dem Bildschirm entspricht Mausbewegung
    • Das Berühren der Oberfläche entspricht linkem Klick oder Gedrückthalten
    • Ein idealer Stift hat zwei Tasten für mittleren und rechten Klick
    • Wenn nur eine Taste für den rechten Klick vorhanden ist, kann man mit gedrückter Umschalttaste und der Taste einen mittleren Klick nachahmen
  • paint(1) und 9front unterstützen keine Druckempfindlichkeit
  • Es gibt auch keine Ebenen und kein Ausschneiden/Einfügen; das Gezeichnete ist direkt das Ergebnis
  • Speichern und Öffnen erfolgen per Tasteneingabe
    • w: Datei speichern
    • r: Datei öffnen oder neu einlesen
    • |: aktuelle Canvas per Pipe an einen Befehl zur Umwandlung übergeben
    • < command: Ausgabe eines Befehls in paint(1) einlesen und die aktuelle Canvas ersetzen
    • > command: aktuelle Canvas an einen Befehl übergeben und in eine Datei schreiben
  • Beispiele für solche Arbeitsabläufe
    • | rotate -u: Canvas drehen
    • < crop -i -50 glenda.pic: glenda.pic mit einem schwarzen Rand von 50 Pixeln öffnen
    • > crop -i -50 | rotate -r 90 > modified_glenda.pic: der aktuellen Canvas einen Rand hinzufügen, um 90 Grad drehen und speichern

Die Canvas wird durch den Bereich mit gesetzten Pixeln bestimmt

  • In paint(1) ist die Canvas der rechteckige Bereich, der die Zeichnung enthält
  • Das weiße Fenster direkt nach dem Start ist eine leere Datei; erst nachdem der erste Pixel gezeichnet oder gelöscht wurde, entsteht eine Canvas
  • paint(1) betrachtet die am weitesten entfernten gesetzten Pixel als Begrenzung der Canvas
    • Die Fenstergröße bestimmt nicht die Größe der Canvas
    • Auch mit dem Radiergummi gelöschte Pixel gelten als gesetzte Pixel
  • Es wird empfohlen, die Größe des zuerst erzeugten paint(1)-Fensters als Arbeits-Canvas zu betrachten, an den Ecken Zuschneidemarkierungen zu setzen und dann zu arbeiten
  • Wenn man ein Bild mit exakter Größe braucht, muss man über ein separates Verfahren eine Canvas fester Größe anlegen und nach der Arbeit Zuschneideberechnungen oder das Entfernen von Rändern einplanen

Die wichtigsten Werkzeuge in paint(1)

  • Werkzeuge werden ausgewählt, indem man die untere Werkzeugleiste mit der linken Maustaste anklickt
  • Farben
    • Mit linkem Klick wird eine Farbe ausgewählt
    • Mit Rechtsklick auf eine Werkzeugleistenfarbe kann man durch Eingabe eines Hex-Codes die Palette ändern
    • paint(1) merkt sich die Palette nach dem Beenden nicht; sie muss daher bei jedem neuen Fenster erneut angepasst werden
    • Wenn man mehr als 16 Farben nutzen will, kann man dieselbe Bilddatei in mehreren paint(1)-Fenstern öffnen und mit w und r synchronisieren
  • Pinsel
    • Mit 0-9 oder per linkem Mausklick wählt man die Pinselgröße und zeichnet per Drag
  • Füllen
    • Verwendet werden f, c, linke Maustaste und mittlere Maustaste
    • Dabei wird ein zusammenhängender Bereich von Pixeln gleicher Farbe in eine andere Farbe geändert
    • Das wird auch zum Ändern der Hintergrundfarbe verwendet; in diese Farbe radiert der Radiergummi
    • c entfernt alles und setzt den ausgewählten Farbton als Hintergrund, wodurch wieder ein leerer Dateizustand entsteht
  • Radiergummi
    • Verwendet werden 0-9 und die mittlere Maustaste
    • Der Bereich unter dem Cursor wird mit derselben Größe wie der aktuelle Pinsel auf die Hintergrundfarbe gesetzt
  • Gerade Linien und Kreise
    • Für gerade Linien verwendet man ein Lineal
    • Kreise zeichnet man, indem man einem flachen, runden Gegenstand oder einem mit dem Zirkel auf Transparentpapier vorgezeichneten Kreis folgt
  • Bewegen, Zoomen, Rückgängig
    • Mit gedrückter rechter Maustaste und Bewegung wird gepannt
    • Mit - und + wird hinein- und herausgezoomt, aber nicht weiter heraus als bis zur ursprünglichen Zoomstufe
    • Esc setzt den Zoom zurück und zentriert die Canvas
    • u macht das zuletzt gezeichnete zusammenhängende Liniensegment rückgängig; auch eine einzelne lange Linie kann in mehrere Undo-Schritte aufgeteilt sein

Pseudo-Ebenen und farbbasiertes Entfernen

  • paint(1) hat keine Ebenen, aber man kann Pseudo-Ebenen erzeugen, indem man mit einer Farbe skizziert, die man im eigentlichen Bild nicht verwenden will, und dann darüber die endgültigen Linien zeichnet
  • Im Beispiel wird HotPink als Skizzierfarbe verwendet und nach Abschluss nur diese Farbe entfernt
  • Manuelles Füllen oder präzises Radieren kann lange dauern; hilfreich ist daher, mit pico eine bestimmte Farbe in die Hintergrundfarbe umzuwandeln
  • pico kann mit folgendem Befehl bezogen werden
  • Eine zugehörige Erklärung gibt es unter Image Manipulation on Plan 9 Using pico
  • Der HotPink-Farbwert #ff5fd7 entspricht in dezimalem RGB 255, 95, 215; dazu gehört auch ein Beispiel für die Umwandlung mit pc(1)

page(1), crop(1), vcrop(1), resize(1), rotate(1)

  • page(1) ist ein Dokumentbetrachter und dient zum Anzeigen verschiedener Bildformate, PDFs, E-Books und mehr
    • Mit page my_picture.pic kann man eine Zeichnung ansehen
    • Es wird empfohlen, die Ergebnisse von Bildbearbeitungsschritten mit page(1) zu prüfen, bevor sie in eine Datei geschrieben werden
    • Auch in page(1) kann man mit w das gerade angezeigte Ergebnis in eine Datei speichern
  • Wenn ein Bild größer geworden ist als das paint(1)-Fenster, kann man ein separates Fenster mit page picture.file öffnen und es mit fit width oder fit height als Vorschaufenster verwenden
  • vcrop(1) ist ein grafisches Zuschneidewerkzeug
    • Linke Maustaste zum Pannen
    • Mittlere Maustaste zur Auswahl des Zuschneidewerkzeugs
    • Rechte Maustaste zeigt Optionen wie Speichern an
    • Es gibt keine Zoomfunktion; deshalb ist das Werkzeug begrenzt, wenn man Bereiche zuschneiden will, die größer als das Fenster sind, oder pixelgenau arbeiten muss
  • crop(1) entfernt oder fügt Pixelreihen hinzu
    • crop -x 50 mypic.pic > mypic_crop.pic: an links und rechts je 50 Pixel abschneiden
    • crop -i -10 -b 255 255 255 mypic.pic: einen weißen Rand von 10 Pixeln hinzufügen
  • resize(1) vergrößert oder verkleinert ein Bild
    • Um das Seitenverhältnis zu erhalten, gibt man nur -x oder -y an
    • Beispiel: resize -n -y 245 mypic.pic > mypic_resized.pic
  • rotate(1) kann Bilder in 90-Grad-Schritten drehen
    • rotate -r 90 my.pic > rotated.my.pic
    • rotate -ul > flipped.my.pic

Eine exakte Canvas-Größe erstellen und Strategien zum Zuschneiden

  • Wenn man eine exakt definierte Größe wie 250x250 braucht, erstellt man ein leeres Bild, bringt es mit resize(1) auf die gewünschte Größe und öffnet es dann in paint(1)
    • w empty_canvas.pic
    • resize -n -x 250 -y 250 empty_canvas.pic > empty_canvas_250x250.pic
    • cp empty_canvas_250x250.pic mypicture.pic
    • paint mypicture.pic
  • paint(1) verhindert nicht, dass man über die Canvas-Grenzen hinaus zeichnet; wenn man das tut, wird die Bildgröße erweitert
  • Es gibt drei Möglichkeiten
    • Linien über die Grenze hinweg ignorieren und nach der Arbeit rechnerisch zuschneiden
    • Vor der Arbeit gleichmäßige zusätzliche Ränder hinzufügen und sie nach Abschluss entfernen
    • Zuschneidemarkierungen in die Ecken zeichnen und später zuschneiden
  • crop -r a b c d schneidet anhand absoluter Koordinaten des Bildes zu; die Koordinaten kann man mit dd -bs 128 -count 1 prüfen
  • Bei der Randmethode kann man zum Beispiel einer weißen 250x250-Canvas einen roten Rand von 25 Pixeln hinzufügen, darauf arbeiten und am Ende mit crop -i 25 wieder auf das exakte Ergebnis von 250x250 kommen

Nachzeichnen und Paletten

  • Man kann ein Bild aus dem Internet holen, in das 9front-Format umwandeln, mit pico aufhellen und es dann in paint(1) nachzeichnen
  • In paint(1) kann man dann mit einer bestimmten Farbe wie HotPink die Linien nachziehen und anschließend mit pico nur diese Farbe stehen lassen, während alles andere weiß wird
  • Material zum Thema Paletten gibt es unter git.sr.ht/~amavect/makeu

Export und Weitergabe nach außen

  • Unter 9front gezeichnete Bilder sind praktisch Pixel Art, daher wird die Umwandlung nach PNG empfohlen
  • PNG ist immer kleiner und schärfer als JPG und zeigt das Bild so an, wie es in paint(1) zu sehen war
  • Andere Formate wie PNG oder JPG können in paint(1), crop(1) oder vcrop(1) nicht direkt bearbeitet werden, lassen sich aber mit page(1) anzeigen
  • Wenn das Original verloren gegangen ist, kann man ein PNG wieder in das 9front-Format umwandeln und weiterbearbeiten
    • png -c9 my_picture.png > my_picture.pic
  • Es gibt viele Wege, das Ergebnis auf ein anderes Gerät zu übertragen, von sehr einfach bis komplexer
    • In page(1) öffnen und den Bildschirm mit dem Handy fotografieren
    • Ein FAT-USB-Laufwerk anschließen und nach /shr/sdS0M3TH1NG kopieren
    • Mit sshfs(4) an einen Unix-Computer übertragen
    • Von einem Unix-Computer per drawterm verbinden und nach /mnt/term/some/where kopieren
    • Mit mothra(1) in snac posten
    • Vom 9front-Computer aus eine E-Mail an sich selbst senden
    • Mit sshfs(4) an eine virtuelle Maschine innerhalb von 9front übertragen
    • Auf einen 9front-Webserver kopieren und von einem anderen Gerät herunterladen

Verwandte Beiträge

1 Kommentare

 
GN⁺ 3 시간 전
Lobste.rs-Kommentare
  • Ich fand Plan 9 und 9front schon immer faszinierend, und der Humor von 9front erinnert mich an das frühe Web :) Das hier ist keine Ausnahme
    • Es ist ein entspanntes System
      Geschrieben in Mothra auf 9front
  • Mit einem Lineal auf einem Zeichentablett gerade Linien zu ziehen, hat etwas seltsam schön Chaotisches, aber es ist schwer zu erklären, warum das schlecht sein soll. Vielleicht ist es überhaupt nicht schlecht.
    Möglicherweise sehen die natürlichen kleinen Abweichungen sogar besser aus als eine Bresenham-Linie.
    Immerhin wurde der Zirkel nicht direkt auf die Tablet-Oberfläche gesetzt, sondern auf Transparentpapier benutzt.
    • Wenn man langsam zeichnet, entstehen besonders leicht gewisse künstliche Wellen
      Meistens lässt sich das aber vermeiden, wenn man darauf achtet, deshalb empfehle ich dringend physische Hilfsmittel statt künstlicher Präzision.
    • Der Zirkel aus der Schulzeit ließ sich auf der Zeichenseite mit praktisch jedem Stift bestücken
      Wenn man die Nadel in ein Stück Korken von einer Weinflasche steckt, dürfte das ganz gut funktionieren :^)
  • @pmjv, wenn sowohl der Memeplex von triapul.cz als auch stanleylieber.com von dir sind … woher nimmst du überhaupt die Zeit?!
    • Das sind nicht dieselbe Person!