SVGcode ist eine neue Progressive Web App, die Rasterbilder (wie JPEG und PNG) automatisch in SVG-Grafikdateien konvertieren kann.
Es gibt zwei verschiedene Kategorien von Bildern, die Sie normalerweise im Internet sehen. Rasterbilder (wie JPG, PNG, WebP usw.) sind eine Reihe von Pixeln mit einer festen Auflösung, während Vektorbilder (wie SVG) verschiedene Linien und Formen verwenden. Vektorgrafiken sind für Logos und andere einfache Bilder beliebt, da sie bei hohen Auflösungen (oder beim Vergrößern) nicht schlecht aussehen, die Erstellung von Grund auf jedoch arbeitsintensiv sein kann. Jetzt gibt es eine praktische Web-App zum Erstellen von SVGs aus Standardbildern: SVGcode.
SVGcode ist eine neue Progressive Web-App, die von Thomas Steiner, einem Developer Relations Engineer bei Google, erstellt wurde (obwohl SVGcode selbst kein Google-Produkt ist). Sobald Sie es in Ihrem Browser öffnen unter svgco.dekönnen Sie ein Bild von Ihrem PC aus öffnen und es wird automatisch als SVG „gezeichnet“. Bei den meisten Bildern sind einige Anpassungen erforderlich, um eine anständig aussehende SVG-Datei zu erstellen. Es handelt sich jedoch um eine beeindruckende Webanwendung, die sich als nützlich erweisen könnte, wenn Sie jemals eine sauberere Vektorversion eines Rasterlogos erstellen möchten.
SVGcode basiert auf einigen der neuesten APIs, die Webbrowser wie Chromium und Firefox hinzugefügt haben. Die Kernfunktionalität des Zeichnens basiert auf dem Potrace-Projekt, der für diese Web-App in Web-Assembly-Code konvertiert wurde. SVGCode kann die fertige Datei in Ihre Zwischenablage kopieren (mit dem Asynchrone Zwischenablage-API), wird als Option im Dateimanager Ihres PCs angezeigt, wenn Sie mit der rechten Maustaste auf ein Bild klicken (mit der File Handling API) und öffnen/speichern Sie Dateien von Ihrem Gerät (mithilfe von Dateisystemzugriffs-API). Es nutzt sogar das Neue Fenstersteuerungs-Overlay-API um die Titelleiste des Systems bei der Installation auszublenden, sodass es sich eher wie eine native Anwendung anfühlt.
Weitere Informationen zum Entwicklungsprozess für SVGcode finden Sie unter ein Blogbeitrag im Webentwicklungsblog von Google. Da es sich um eine PWA handelt, können Sie SVGcode auf jedem Gerät mit einem modernen Webbrowser verwenden und installieren.