Anleitung

Die Oberfläche

Beim Aufruf erscheint zuerst ein Startbildschirm, der sich wie über ein Modem aufbaut. Enter, Escape, die Leertaste, ein Klick oder der Knopf Starten öffnen den Editor. Wer "Bewegung reduzieren" im Betriebssystem eingestellt hat, sieht ihn ohne Animation.

Oben liegt die blaue Menüleiste mit Datei, Bearbeiten, Werkzeuge, Zeichen, Ansicht, Vorlagen und Hilfe. Die gelben Buchstaben öffnen ein Menü zusammen mit Alt, zum Beispiel Alt+D für Datei. Alt allein aktiviert die Leiste, danach geht es mit den Pfeiltasten, Enter und Escape weiter.

Links stehen die Werkzeuge, die Optionen, das aktuelle Zeichen und die Farbpalette. In der Mitte liegt die Zeichenfläche, darüber eine Leiste mit den offenen Zeichnungen. Darunter zeigt eine Leiste die Zeichen auf F1 bis F10 und die Nummer des Zeichensatzes. Ganz unten steht die Statuszeile mit Cursorposition, Farben, Werkzeug, Einfügen oder Überschreiben, Größe der Leinwand und Zoom. Ein Stern hinter dem Zoom heißt: noch nicht gespeichert.

Alles lässt sich auch nur mit der Tastatur bedienen. Tab wechselt zwischen Zeichenfläche und Bedienelementen.

Zeichnen mit der Tastatur

Klicke in die Zeichenfläche und tippe. Jedes Zeichen erscheint in der aktuellen Vorder- und Hintergrundfarbe. Die Pfeiltasten bewegen den Cursor, Pos1 und Ende springen an den Anfang oder das Ende der Zeile, Bild auf und Bild ab um eine Bildschirmseite. Enter springt an den Anfang der nächsten Zeile.

Einfg schaltet zwischen Überschreiben und Einfügen um. Beim Einfügen rückt der Rest der Zeile nach rechts, der Cursor wird dicker. Die Rücktaste löscht links vom Cursor, Entf löscht das Zeichen unter dem Cursor und zieht den Rest der Zeile nach.

Zeichensätze auf F1 bis F10

Wie in TheDraw liegen auf F1 bis F10 Sonderzeichen. Es gibt zehn Sätze: einfache Linien, doppelte Linien, gemischte Linien, Kreuzungen, Schattierungen und Blöcke, Symbole, Pfeile und weitere Zeichen. Umschalt+F1 bis F10 wählt den Satz, die Pfeile in der Leiste unten blättern ebenfalls. Am Anfang ist Satz 6 aktiv, er enthält die Schattierungen und Blöcke.

Die Belegung lässt sich ändern: Öffne Zeichen, Zeichentabelle. Dort wählst du ein Zeichen mit den Pfeiltasten und drückst eine Taste von F1 bis F10, das Zeichen liegt dann auf dieser Taste im aktuellen Satz. Die eigene Belegung bleibt im Browser gespeichert. Zeichen, Zeichensätze zurücksetzen stellt die Vorgabe wieder her.

Farben ohne Maus

Strg+Pfeil hoch und runter wechseln die Vordergrundfarbe, Strg+Pfeil rechts und links die Hintergrundfarbe.

Linien mit der Tastatur

Strg+L (oder Werkzeuge, Linien mit Tastatur) schaltet den Linienmodus ein. Dann ziehen die Pfeiltasten eine Linie hinter dem Cursor her, einfach oder doppelt je nach Option Rahmen doppelt. Ecken, Abzweigungen und Kreuzungen mit vorhandenen Linien setzt der Editor selbst. In der Statuszeile steht dann "Linien". Strg+L schaltet wieder aus.

Werkzeuge für die Maus

Für alle Werkzeuge gilt: Die linke Maustaste nimmt die Vordergrundfarbe, die rechte die Hintergrundfarbe. Ein Mauszug ist ein Schritt beim Rückgängigmachen. Alt+Klick übernimmt in jedem Werkzeug Zeichen und Farben der angeklickten Zelle.

Großschrift mit TheDraw-Fonts

TheDraw-Fonts (.tdf) sind Schriften aus großen Buchstaben, gebaut aus Blöcken, Linien oder farbigen Zeichen. Damit entstanden früher die meisten Schriftzüge auf Mailbox-Screens.

1. Wähle das Werkzeug Großschrift und klicke an die Stelle, an der der Text beginnen soll.
2. Tippe den Text. Enter beginnt eine neue Zeile unter der ersten, die Rücktaste nimmt den letzten Buchstaben zurück.
3. Den Font wählst du links im Abschnitt Großschrift oder unter Zeichen, TheDraw-Font wählen.

Es gibt drei Arten: Block-Fonts nutzen die aktuellen Farben, Farb-Fonts bringen eigene Farben mit, Umriss-Fonts bestehen aus Linien. Für Umriss-Fonts gibt es 19 Umrissstile wie in TheDraw, von einfachen über doppelte Linien bis zu Halbblöcken.

Mitgeliefert werden zwei eigene Fonts, VGA Block und VGA Color. Weitere .tdf-Dateien lädst du im Font-Dialog mit Fonts laden. Eine Datei kann viele Fonts enthalten, alle erscheinen in der Liste. Geladene Fonts bleiben in diesem Browser gespeichert, bis du sie entfernst. Fehlt ein Kleinbuchstabe, nimmt der Editor den Großbuchstaben.

Eigene Fonts bauen

Unter Zeichen, TheDraw-Font bearbeiten baust du eigene Block- und Farb-Fonts oder änderst vorhandene:

1. Lege einen neuen Font an (Name bis 12 Zeichen, Farbe oder Block) oder wähle einen vorhandenen und klicke Bearbeiten.
2. Schließe den Dialog, zeichne einen Buchstaben auf der Leinwand und wähle ihn mit Auswahl oder Zauberstab aus.
3. Öffne den Dialog wieder, klicke den Buchstaben in der Liste an und dann Aus Auswahl übernehmen.

Leerzeichen auf Schwarz bleiben im Buchstaben durchsichtig, Leerzeichen mit farbigem Hintergrund werden gezeichnet. Auf die Leinwand holen legt einen vorhandenen Buchstaben als schwebende Auswahl ab, so kannst du ihn ändern und wieder übernehmen. Jede Änderung landet sofort in deinen eigenen Fonts im Browser (Datei my-fonts.tdf in der Fontliste). Änderst du einen mitgelieferten oder geladenen Font, entsteht dabei eine Kopie. Als .tdf herunterladen speichert den Font als Datei, die auch andere Programme lesen. Umriss-Fonts lassen sich benutzen, aber nicht bearbeiten.

Auswahl und Zwischenablage

Einen Bereich wählst du mit dem Werkzeug Auswahl, dem Zauberstab oder mit Umschalt+Pfeiltasten. Strg+A wählt alles, Escape hebt die Auswahl auf. Mit gedrückter Umschalttaste nimmst du bei Auswahl und Zauberstab weitere Bereiche dazu, mit gedrückter Strg-Taste nimmst du Bereiche weg. So entstehen auch Auswahlen, die kein Rechteck sind. Bearbeiten, Auswahl invertieren wählt alles außer der Auswahl.

• Strg+C kopiert, Strg+X schneidet aus, Entf leert den Bereich.
• Strg+V fügt als schwebende Auswahl ein. Du verschiebst sie mit der Maus oder den Pfeiltasten, Enter oder ein Klick daneben setzt sie ab, Escape verwirft sie.
• Zentrieren, Linksbündig und Rechtsbündig im Menü Bearbeiten richten den Text der Cursorzeile aus, bei einer Auswahl jede Zeile innerhalb der Auswahl.
• Im Menü Bearbeiten: mit dem aktuellen Zeichen füllen, nur die Farben ersetzen, waagerecht oder senkrecht spiegeln. Beim Spiegeln werden richtungsabhängige Zeichen mitgedreht, etwa Halbblöcke, Ecken, Abzweigungen, Klammern und Schrägstriche. Ohne Auswahl wird das ganze Bild gespiegelt, bei einer schwebenden Auswahl nur sie.

Bei einer Auswahl, die kein Rechteck ist, wirken Leeren, Füllen, Farben ersetzen und Spiegeln nur auf die gewählten Zellen. Beim Einfügen bleiben die Zellen dazwischen, wie sie sind.

Beim Kopieren landet das Bild auch als ANSI-Text in der Zwischenablage des Systems. So kannst du es in ein Terminal oder einen Texteditor einfügen. Text aus anderen Programmen fügt der Editor als einfachen Text ein, Unicode-Zeichen werden auf CP437 abgebildet.

Rückgängig (Strg+Z) und Wiederholen (Strg+Y) reichen mindestens 200 Schritte zurück, über alle Werkzeuge hinweg.

Mehrere Zeichnungen

Bis zu neun Zeichnungen können gleichzeitig offen sein, jede in einem eigenen Reiter über der Zeichenfläche. Neu, Öffnen, Vorlagen und umgewandelte Bilder kommen in einen neuen Reiter, die aktuelle Zeichnung bleibt also immer erhalten. Ist die aktuelle Zeichnung noch leer und unverändert, nehmen Öffnen, Vorlagen und umgewandelte Bilder ihren Reiter. Neu und das + öffnen immer einen neuen Reiter.

• Ein Klick auf einen Reiter oder Alt+1 bis Alt+9 wechselt die Zeichnung. Ansicht, Nächste Zeichnung und Vorherige Zeichnung gehen der Reihe nach.
• Das + rechts neben den Reitern legt eine neue Zeichnung an.
• Das ■ im Reiter oder Datei, Zeichnung schließen schließt sie. Gibt es ungespeicherte Änderungen, fragt der Editor vorher.
• Jede Zeichnung hat ihr eigenes Rückgängig, ihre eigene Auswahl und ihr eigenes Vorlagebild. Kopieren und Einfügen geht zwischen den Zeichnungen.

Ansicht, Übersicht blendet unten rechts die ganze Zeichnung klein ein. Der gelbe Rahmen zeigt, welcher Teil gerade zu sehen ist. Ein Klick oder Ziehen in der Übersicht springt dorthin, praktisch bei großen Bildern und hohem Zoom.

Leinwand, Farben und Ansicht

Die Leinwand ist am Anfang 80 Spalten breit und 25 Zeilen hoch. Unter Bearbeiten, Leinwandgröße stellst du 1 bis 160 Spalten und 1 bis 1000 Zeilen ein. Zeilen und Spalten fügst du an der Cursorposition ein oder löschst sie dort.

Die Palette hat die 16 VGA-Farben. Ein V markiert die Vordergrundfarbe, ein H die Hintergrundfarbe. Linke Maustaste wählt den Vordergrund, rechte Maustaste den Hintergrund.

• iCE-Farben: Normalerweise sind nur die acht dunklen Farben als Hintergrund möglich, die hellen Hintergründe bedeuten auf echter Hardware Blinken. Mit iCE-Farben stehen alle 16 Farben als Hintergrund zur Verfügung. Der Schalter wird in SAUCE vermerkt.
• 9-Punkt-Modus: Echte VGA-Karten zeigen Textzeichen 9 Punkte breit. Die Linienzeichen von C0 bis DF werden in die neunte Spalte verlängert, damit Linien durchgehen. Auch dieser Schalter landet in SAUCE und im PNG.
• Zoom: 1x bis 4x, immer in ganzen Faktoren und ohne Glättung. Strg+Plus und Strg+Minus oder Strg+Mausrad.
• Raster: blendet die Grenzen der Zeichenzellen ein.
• Hilfslinien: Hilfslinien 80x25 zeigen die Grenze nach 80 Spalten und alle 25 Zeilen, also einen Bildschirm. Die Mittellinie markiert die senkrechte Mitte.
• Blinken anzeigen: Ohne iCE-Farben blinkt bei hellen Hintergründen der Vordergrund, wie auf echter Hardware. Der Schalter stellt das Blinken in der Ansicht ab.
• Schriftart: IBM VGA (8x16), IBM VGA50 und EGA43 (8x8), IBM EGA (8x14) und Amiga-Schriften (Topaz 1 und 2, jeweils mit und ohne Plus, P0T-NOoDLE, mO'sOul). Die Schrift wird in SAUCE vermerkt. Amiga-Schriften zeigen die Zeichen nach ISO-8859-1, getippter Text wird passend umgesetzt.
• Palette: Die 16 Farben lassen sich frei einstellen. Eigene Farben werden in XBin gespeichert und in ANSI als 24-Bit-Codes, die PabloDraw, Moebius und 16colo.rs anzeigen. Andere Programme zeigen dort die VGA-Farben.
• Zuletzt benutzt: Unter der Palette stehen die letzten acht Farbpaare, mit denen du gemalt oder geschrieben hast. Ein Klick stellt Vorder- und Hintergrund zusammen ein.
• Vorlagebild: Unter Ansicht, Vorlagebild legst du ein PNG, JPG, GIF oder WebP halbdurchsichtig über die Zeichnung, zum Abpausen. Deckkraft und Größe sind einstellbar. Das Bild wird nicht gespeichert und nicht exportiert, und es verlässt deinen Browser nicht.

Alle Tasten

Die Tasten gelten, solange die Zeichenfläche den Fokus hat. Die Liste steht auch im Menü Hilfe, Tastenbelegung.

Strg+N, Strg+T und Strg+W gehören dem Browser und sind deshalb nicht belegt. Neu findest du im Menü Datei.

Dateien öffnen und speichern

Öffnen geht über Datei, Öffnen (Strg+O) oder indem du eine Datei auf die Seite ziehst. Gespeichert wird als Download, den Namen wählst du im Dialog.

24-Bit-Farben in ANSI-Dateien (ESC[38;2 und die Codes von PabloDraw) werden beim Öffnen zu einer eigenen Palette. Sind es mehr als 16 Farben, nimmt der Editor die ähnlichsten und sagt dir Bescheid.

Die Steuerzeichen 09, 0A, 0D, 1A und 1B können in .ans- und .asc-Dateien nicht als Zeichen stehen. Sie werden als Leerzeichen gespeichert, der Editor sagt dir Bescheid. In .bin bleiben sie erhalten.

Volle Zeilen mit 80 Zeichen enden trotzdem mit CRLF. Mailbox-Terminals, WebCarrier BBS und 16colo.rs zeigen das richtig an. Für sehr alte DOS-Terminals, die nach dem 80. Zeichen sofort umbrechen, lässt du die letzte Spalte frei.

SAUCE

SAUCE ist ein kleiner Block am Ende der Datei mit Angaben zum Bild. Archive wie 16colo.rs und viele Betrachter lesen ihn. Unter Datei, SAUCE-Angaben trägst du Titel (35 Zeichen), Künstler (20), Gruppe (20), Datum und Kommentare ein. Breite, Höhe, iCE-Farben, 9-Punkt-Modus und die Schriftart setzt der Editor selbst. Beim Speichern ist SAUCE standardmäßig an, du kannst es im Dialog abschalten.

Vorlagen für WebCarrier BBS

Das Menü Vorlagen enthält schlichte Screens in 80x25 für WebCarrier BBS: welcome (Begrüßung), logon (nach der Anmeldung), logoff (Abmeldung) und newuser (neue Benutzer). Sie enthalten Makros wie @BBSNAME@, @SYSOP@, @USER@, @DATE@ und @TIME@ als normalen Text. WebCarrier BBS ersetzt sie beim Anzeigen durch die echten Werte.

Gestalte die Vorlage, speichere sie als .ans unter dem passenden Namen und lade sie in deiner Mailbox als Screen hoch. Welche Makros es gibt, steht im Sysop-Handbuch von WebCarrier BBS. Denk daran, dass ein Makro nach dem Ersetzen länger oder kürzer sein kann. Setze deshalb rechts neben ein Makro keinen Rahmen, oder nutze die Makros mit fester Breite wie @BBSNAME:40C@.

Bild in ANSI umwandeln

Datei, Bild in ANSI umwandeln macht aus einem PNG, JPG, GIF, WebP oder BMP eine Zeichnung, die du danach Zelle für Zelle weiter bearbeiten kannst. Die Vorschau zeigt das Ergebnis, bevor du es übernimmst.

• Breite: 1 bis 160 Zeichen, die Höhe ergibt sich aus dem Seitenverhältnis.
• Halbblöcke: zwei Bildpunkte pro Zelle, gut für Logos, Pixel-Art und klare Formen.
• Schattierungen: ein Farbton pro Zelle aus zwei Farben und ░ ▒ ▓, gut für Fotos und weiche Verläufe.
• Rasterung: Fehlerverteilung (Floyd-Steinberg) gibt die feinsten Übergänge, das gleichmäßige Muster wirkt ruhiger, ohne Rasterung entstehen klare Flächen.
• Helligkeit und Kontrast gleichen dunkle oder flaue Bilder aus.
• iCE-Farben erlauben helle Hintergründe und geben die besten Farben. Ohne iCE-Farben bleibt das Bild auch in alten Terminals ohne Blinken.
• Ergebnis: als neue Zeichnung in einem eigenen Reiter oder als schwebende Auswahl in die aktuelle Zeichnung.

Das Bild wird nur in deinem Browser umgewandelt und nirgends hochgeladen.

Wie in der Mailbox ansehen, GIF und Video

Datei, Wie in der Mailbox ansehen spielt das Bild Zeichen für Zeichen ab, so wie es früher über ein Modem kam. Wähle 2400, 9600, 14400, 28800 oder 57600 Baud oder unbegrenzt. Escape oder ein Klick auf das Bild bricht ab, Neu starten spielt es noch einmal.

Datei, Als GIF oder Video speichert genau diesen Aufbau als Datei, zum Zeigen in sozialen Netzen oder auf einer Website:

• Animiertes GIF: ist in wenigen Sekunden fertig. Als Ausschnitt wählst du 80x25 wie am Bildschirm (scrollt bei hohen Bildern mit) oder das ganze Bild. Auf Wunsch wiederholt es sich endlos.
• Video: MP4 oder WebM, je nachdem, was dein Browser aufnehmen kann. Das Video wird in Echtzeit aufgenommen, bei 2400 Baud dauert das also so lange wie damals. Fehlt die Möglichkeit im Browser, gibt es nur das GIF.

Dazu stellst du Geschwindigkeit, Vergrößerung (1x oder 2x) und die Zeit ein, die das fertige Bild am Ende stehen bleibt.

Als Link teilen

Datei, Als Link teilen packt die ganze Zeichnung mit Farben, Schrift, Palette und SAUCE-Angaben in einen Link. Wer ihn öffnet, sieht das Bild: am Rechner im Editor in einem neuen Reiter, auf dem Handy im Betrachter.

Die Zeichnung steckt komplett im Link hinter dem #. Dieser Teil wird vom Browser nie an einen Server geschickt, nichts wird hochgeladen. Bei großen Bildern wird der Link lang. Der Dialog zeigt die Länge und warnt, wenn Chat- oder Mailprogramme ihn abschneiden könnten. Dann schickst du besser die Datei.

Tablet, Stift und Handy

Auf Tablets startet der Editor mit einer Touch-Leiste unter der Zeichenfläche: Zurück, Vor, Malt mit Vorder- oder Hintergrund, Zoom, Tastatur und Absetzen für eine schwebende Auswahl. Unter Ansicht, Touch-Leiste schaltest du sie an oder aus, auch am Rechner mit Touchscreen.

• Ein Finger malt mit dem gewählten Werkzeug.
• Zwei Finger verschieben die Zeichnung, auseinander und zusammen ziehen zoomt. Begonnene Striche werden dabei zurückgenommen.
• Stift (Apple Pencil, S Pen und andere): malt sofort und genau. Sobald ein Stift benutzt wurde, verschieben und zoomen die Finger nur noch, so malt die aufgelegte Hand nichts. Die Seitentaste des Stifts malt mit der Hintergrundfarbe.
• Malt: Hintergrund in der Touch-Leiste ersetzt die rechte Maustaste. Auch ein Tipp auf die Palette wählt dann die Hintergrundfarbe.
• Tastatur holt die Bildschirmtastatur, getippte Buchstaben landen am Cursor. Die Zeichen von F1 bis F10 wählst du in der Leiste darunter als Pinselzeichen.

Auf Handys (unter 600 Pixel Breite) startet statt des Editors ein Betrachter. Dort kannst du Dateien und geteilte Links öffnen, ansehen, zoomen, als PNG speichern, in der Modem-Vorschau abspielen und als GIF oder Video speichern. Der Link "Trotzdem den Editor öffnen" startet den Editor auch dort.

Tipps für gute ANSI-Art

• Halbblöcke: Mit ▀ und ▄ hast du doppelt so viele Bildpunkte in der Höhe. Der Halbblock-Pinsel kümmert sich um Zeichen und Farben, du malst einfach.
• Schattierungen: ░ ▒ ▓ mischen Vorder- und Hintergrundfarbe. Eine Reihe wie Blau, ░ Blau auf Hellblau, ▒, ▓, Hellblau ergibt einen weichen Übergang.
• Farbverläufe: Gute Verläufe gehen über Farben, die zusammenpassen: Schwarz, Dunkelgrau, Hellgrau, Weiß. Oder Blau, Hellblau, Hellcyan, Weiß. Oder Rot, Hellrot, Gelb, Weiß.
• Kontraste: Helle Schrift auf dunklem Grund liest sich am besten. Ein dunkler Schatten unten rechts hebt Schriftzüge vom Hintergrund ab.
• Wenig ist mehr: Zwei oder drei Farbfamilien pro Bild wirken ruhiger als alle 16 Farben.
• Breite: 80 Spalten sind der Standard für Mailboxen. Plane Screens für 80x25, damit sie ohne Scrollen auf einen Bildschirm passen.

Speicherung im Browser

Der Editor sichert alle offenen Zeichnungen laufend im localStorage deines Browsers. Beim nächsten Aufruf fragt er, ob der gesicherte Stand wiederhergestellt werden soll, und öffnet dann wieder alle Reiter.

Gespeichert werden nur die Zeichnungen, deine Einstellungen (Zeichensätze, Zoom, Schalter, zuletzt benutzte Farben, zuletzt gewähltes Format), geladene TheDraw-Fonts und deine eigenen Fonts. Nichts davon verlässt deinen Browser, es gibt keine Cookies und keine Anfragen an fremde Server. Datei, Gespeicherte Daten löschen entfernt alles wieder. Die Sicherung ersetzt kein Speichern: In einem privaten Fenster oder nach dem Löschen der Browserdaten ist sie weg.