Drücke die Tasten ◄ ► für weitere Artikel  

WebCode: Zeichenprogramm generiert HTML-Vektorgrafiken

Eine neue Anwendung namens WebCode soll Entwicklern den Alltag in Bezug auf Webseiten und Vektoren erleichtern. Anstatt Vektorgrafiken mit teuren Programmen zu konvertieren oder sie von Hand zu programmieren gibt es mit WebCode nun eine günstige und praktische Alternative. Das kleine Zeichenprogramm gibt am Ende nämlich sauberen Code aus – wahlweise als HTML und CSS oder als JavaScript beziehungsweise Canvas-Element.

WebCode: Zeichenprogramm generiert HTML-Vektorgrafiken

Vektorgrafiken auf dem Vormarsch

Vektorgrafiken setzen sich immer mehr auch im Bereich des Webdesigns durch. Die Vorteile liegen klar auf der Hand – gerade in Zeiten von Retina-Displays und Co. ist die verlustfreie Skalierung von Vektorgrafiken ein unschlagbares Argument für den Einsatz im Internet. Inzwischen ist auch die Browser-Kompatibilität größtenteils gewährleistet.

WebCode verfügt über eine sehr übersichtliche Oberfläche.
WebCode verfügt über eine sehr übersichtliche Oberfläche. (Screenshot: WebCode)

WebCode: Elementares Zeichenprogramm mit Code-Export

Das manuelle Anlegen von Vektorgrafiken über den Quellcode aber ist nach wie vor sehr umständlich und für komplexere Grafiken kaum geeignet, weswegen man oft ein teures Grafikprogramm zur Umwandlung der Grafiken heranziehen muss. Mit WebCode gibt es nun eine Alternative: Das Programm kann sowohl bestehende Vektorgrafiken als SVG oder PSD importieren, als auch bei der manuellen Erstellung der Grafiken helfen.

WebCode ist prinzipiell ein simples Zeichenprogramm, das mit einfachen geometrischen Formen umgehen kann. So lassen sich tolle Grafiken, Bedienelemente und Animationen für zeitgemäße Webseiten erstellen. Dabei bietet die Anwendung viele Einstellmöglichkeiten, etwa für kombinierte Formen, Bezier-Kurven oder Farbverläufe. Einige beeindruckende Beispiele für Einsatzgebiete von WebCode liefert der Hersteller auf der Produktseite.

Der von WebCode erzeugte Code ist ordentlich und übersichtlich.
Der von WebCode erzeugte Code ist ordentlich und übersichtlich. (Screenshot: WebCode)

Ausgabe als HTML, JavaScript oder SVG

Am Ende kann sich der Nutzer entscheiden, ob er sein Ergebnis gerne als JavaScript-Canvas-Objekt, als reines HTML- beziehungsweise CSS-Element oder als SVG-Grafik exportieren möchte. Der generierte Code ist in jedem Fall sehr sauber und übersichtlich.

WebCode ist momentan nur für Mac verfügbar und kann im Mac App Store für rund 45 Euro erworben werden. Das ist in Anbetracht der kommerziellen Alternativen durchaus ein attraktiver Preis. Für Interessierte gibt es außerdem eine Testversion, mit der man 20 Minuten am Stück mit eingeschränkten Export-Funktionen arbeiten kann.

Weiterführende Links

93 Shares bis jetzt – Dankeschön!

Bewerten
VN:F [1.9.22_1171]
2 Antworten
  1. von Daniel am 29.04.2013 (19:43Uhr)

    Gibt es eine alternative ohne Mac?

Deine Meinung

Bitte melde dich an!

Du musst angemeldet sein, um einen Kommentar schreiben zu können.

Jetzt anmelden

Mehr zum Thema HTML
Vokabular der HTML-Syntax: Warum „Tag“ zu 90 Prozent falsch verwendet wird
Vokabular der HTML-Syntax: Warum „Tag“ zu 90 Prozent falsch verwendet wird

„Und dann fügst du das ‚rel='nofollow'-Tag‘ in die dritte Zeile ein.“ Das ist falsch – in diesem kleinen Guide zur HTML-Syntax lest ihr, warum. » weiterlesen

Erheiternde Umfrage: 23 Prozent der Befragten halten „MP3“ für einen Roboter aus Star Wars
Erheiternde Umfrage: 23 Prozent der Befragten halten „MP3“ für einen Roboter aus Star Wars

Mithilfe einer Umfrage wollte eine amerikanische Gutscheinseite herausfinden, wie gut der durchschnittliche US-Bürger über IT-Begriffe bescheid weiß. Die Ergebnisse sprechen leider eine deutliche.. ... » weiterlesen

blink-Tag: Google-Easteregg bringt den Usability-Fail der 90er zurück
blink-Tag: Google-Easteregg bringt den Usability-Fail der 90er zurück

Ein Google-Easteregg bringt den vielleicht größten Usability-Fail der 90iger zurück. Das blink-Tag. Probiert es aus! » weiterlesen

Kennst Du schon unser t3n Magazin?

t3n 35 jetzt kostenfrei probelesen! Alle Inhalte des t3n Magazins Diesen Hinweis verbergen