Penpot auf Saplo: Figma-Alternative ohne Bearbeiterkosten

Figma im Professional-Plan kostet 16 Dollar pro Monat für einen vollständigen Editorplatz bei jährlicher Zahlung, und 20 Dollar bei monatlicher Zahlung. Das sind ungefähr 14 Euro pro Monat für jede Person, die gestaltet. Ein Team von fünf Designern zahlt also etwa 68 Euro pro Monat, also circa 818 Euro im Jahr, und dieser Betrag steigt mit jedem neuen Editor. Penpot ist ein Open-Source-Editor für Interface-Design und Prototyping, der das Gleiche im Browser macht, aber auf deinem eigenen Server keine Platzgebühren berechnet. Unten findest du eine vollständige Anleitung: Was Penpot ist, wann es Figma wirklich ersetzen kann und wann nicht, wie viele Ressourcen es braucht und wie du es Schritt für Schritt auf Saplo einrichtest.

Was ist Penpot

Penpot ist ein UI/UX-Design-Tool, das von der spanischen Firma Kaleidos als Open-Source-Projekt entwickelt wird. Es läuft komplett im Browser, ähnlich wie Figma, daher muss der Designer nichts auf dem Computer installieren. Der wichtigste technische Unterschied: Penpot speichert Projekte in offenen Web-Standards, nämlich SVG, und die Anordnung der Elemente basiert auf CSS Flexbox und CSS Grid. Für das Team bedeutet das, dass das Design näher an dem ist, was der Programmierer später in den Code eingibt.

Das bekommst du praktisch:

• Mockups und Bildschirmdesigns, mit Ebenen, Gruppen, Masken, Text und Vektorgrafiken,
• geteilte Komponenten und Bibliotheken, also Buttons, Formularfelder und Karten, die einmal definiert und in vielen Dateien verwendet werden,
• Flex- und Grid-Layouts, die wie ihre CSS-Pendants funktionieren, sodass ein responsives Design nicht nur eine Zeichnung ist,
• klickbare Prototypen mit Übergängen zwischen Bildschirmen, um sie dem Kunden zu zeigen oder Benutzertests durchzuführen,
• Inspect-Tab, in dem der Programmierer Maße, Farben, Abstände und fertigen CSS- oder SVG-Code auslesen kann,
• Export als PNG, PDF und SVG, unterstützt durch einen separaten Export-Container,
• gemeinsame Live-Bearbeitung, bei der mehrere Personen gleichzeitig an derselben Datei arbeiten können, mit sichtbaren Cursorn und Kommentaren.

Eine ausführliche Beschreibung der Anwendung und ein Installationsbutton findest du auf der Penpot-Seite im Saplo App-Katalog.

Penpot oder Figma: ein ehrlicher Vergleich

Penpot ist kein 1:1-Klon von Figma und es macht keinen Sinn, so zu tun, als ob. Bevor du dein Team umziehst, prüfe, ob deine Arbeit in dem Bereich liegt, den Penpot gut abdeckt.

Kriterium	Figma (Professional)	Penpot auf Saplo
Preis	ca. 14 € pro Monat für jeden Editor	fester Preis der Box, keine zusätzlichen Plätzekosten
Anzahl der Editoren	jeder zahlt separat	unbegrenzt, nur durch Serverspeicher begrenzt
Wo liegen die Projekte	Figma-Cloud, Server in den USA	Deine Box im Rechenzentrum in Deutschland
Dateiformate	geschlossenes Figma-Format	offene Standards, SVG und CSS
Element-Layout	Auto Layout (eigenes Modell)	Flex und Grid nach CSS-Standard
Gemeinsame Echtzeit-Bearbeitung	ja	ja
Prototypen	umfangreich, mit Animationen	grundlegend bis mittelmäßig komplex
Plugins	riesiges Ökosystem	kleiner aber wachsend
AI-Funktionen	integriert, kostenpflichtig über Credits	in Standardinstallation nicht vorhanden

Wann Penpot vollkommen ausreicht: Du gestaltest Webseiten und Webanwendungen, erstellst Mockups für Kunden, baust eine Komponentenbibliothek auf, übergibst die Designs an Entwickler. Das ist die Mehrheit der Arbeit in kleinen Agenturen und Produktteams.

Wann du bei Figma bleiben solltest: Dein Team ist stark auf bestimmte Plugins aus dem Figma-Ökosystem angewiesen, erstellt sehr aufwendige Prototypen mit Mikroanimationen oder der Kunde verlangt Dateien im .fig-Format. Penpot öffnet Figma-Dateien nicht direkt. Die Migration bestehender Projekte ist eine extra Arbeit, deshalb ist es sinnvoll, neue Projekte in Penpot zu starten und ältere dort fertigzustellen, wo sie entstanden sind.

Wie viel kostet das: Rechnung mit konkreten Zahlen

Figma berechnet pro Person. Box bei Saplo berechnet pro Server. Bei einem einzelnen Designer ist der Unterschied gering, im Team wird er groß.

Team	Figma Professional jährlich	Penpot auf Box L jährlich
1 Designer	ca. 164 Euro	136 Euro
3 Designer	ca. 491 Euro	136 Euro
5 Designer	ca. 818 Euro	136 Euro
10 Designer	ca. 1.636 Euro	295 Euro (Box XL)

Die Beträge für Figma wurden von 16 Dollar monatlich bei jährlicher Zahlung umgerechnet, zum Kurs von etwa 0,85 Euro pro Dollar. Bei monatlicher Zahlung ist Figma ein Viertel teurer. Die Preise bei Saplo sind die Katalogpreise der Boxen, im ersten Jahr kostet es genauso viel wie die Verlängerung.

Es kommt noch ein weiterer Punkt hinzu, der in der Tabelle nicht sichtbar ist: Auf derselben Box kannst du weitere Tools für dein Team installieren. Gemeinsame Laufwerke, Passwortmanager oder Aufgabenboards kannst du neben Penpot ohne Aufpreis betreiben, solange der Speicher reicht.

Anforderungen: Welchen Box wählen

Penpot ist eine der anspruchsvollsten Anwendungen im Saplo-Katalog. Die Installation besteht aus fünf Docker-Containern, die zusammenarbeiten:

• Frontend, der Browser-Editor, der einzige Container, der nach außen freigegeben ist,
• Backend, das Projekte speichert und die gemeinsame Bearbeitung unterstützt; läuft auf einer Java-VM, benötigt also viel Speicher,
• Exporter, der Exporte als PNG, PDF und SVG rendert, indem im Inneren ein Browser gestartet wird,
• PostgreSQL 15, die eigene Datenbank nur für Penpot,
• Redis, Cache und Warteschlange für die gemeinsame Bearbeitung.

Daraus ergeben sich folgende Anforderungen:

• mindestens 4 GB freier Arbeitsspeicher und 15 GB Speicherplatz auf der Festplatte,
• Box mit Docker, der Engine, die bei der Installation aus dem Katalog automatisch gestartet wird,
• Domain oder Subdomain *.saploapp.pl, die du bei jedem Plan kostenfrei bekommst.

In der Praxis bedeutet das:

• Box S (1 GB) und Box M (2 GB) reichen nicht aus. Penpot passt nicht darauf.
• Box L (6 GB RAM, 60 GB SSD, 136 € jährlich) ist das vernünftige Minimum für ein Team von ein paar Personen. Es bleibt also Speicherreserve für ein oder zwei leichtere Anwendungen daneben, und Backups der letzten 7 Tage sind inklusive.
• Box XL (12 GB RAM, 150 GB SSD, 295 € jährlich) wählst du, wenn mehrere Dutzend Personen gleichzeitig designen, die Dateien Hunderte von Bildschirmen umfassen oder du mehr Team-Tools auf demselben Server betreiben möchtest.

Eine separate Datenbank kaufst oder konfigurierst du nicht extra. PostgreSQL und Redis sind Teil der Rezeptur und laufen im selben Container-Set wie Penpot.

Schritt-für-Schritt-Installation

1. Melde dich im Saplo-Panel an und gehe zum App-Katalog. Dort findest du Penpot unter den Tools. Du kannst auch direkt von der Penpot-Seite starten und den Deploy-Button klicken.
2. Wähle die Box aus, auf der der Editor laufen soll. Wenn die Box nicht genügend freien Speicher hat, erhältst du vor der Installation eine Warnung, nicht erst nach einem fehlgeschlagenen Versuch.
3. Gib die Adresse an. Am einfachsten ist eine Subdomain wie projects.saploapp.pl. Wenn du eine eigene Domain bevorzugst, zum Beispiel design.deinefirma.de, kannst du diese bei der Installation einstellen, das SSL-Zertifikat wird automatisch erstellt.
4. Bestätige die Installation. Die Engine installiert Docker, lädt die Images für Penpot, PostgreSQL und Redis herunter, generiert zufällige Datenbankpasswörter sowie einen Sitzungsschlüssel und startet alle fünf Container.
5. Warte. Die drei Penpot-Images sind zusammen über ein Gigabyte groß, daher dauert das erste Herunterladen auf einer frischen Box länger als bei leichteren Anwendungen. Die Installation ist erst abgeschlossen, wenn der Editor unter deiner Adresse tatsächlich erreichbar ist.
6. Wenn der Status auf "aktiv" wechselt, öffne die Adresse im Browser.

Erste Inbetriebnahme: Konto und Team

Penpot hat kein vordefiniertes Administrator-Passwort. Das Konto richtest du dir beim ersten Besuch der Seite selber ein:

1. Wähle auf dem Login-Bildschirm Create an account.
2. Gib E-Mail, Passwort und Namen an. Die E-Mail-Bestätigung ist in dieser Installation deaktiviert, daher ist das Konto sofort aktiv.
3. Penpot erstellt automatisch dein erstes Team. Im Team legst du Projekte an, und in den Projekten Dateien mit Screens.

Installationsdetails, darunter die Namen der Container und Befehle zum Einsehen der Logs, werden in der Datei PENPOT-SETUP.txt im App-Verzeichnis auf der Box gespeichert. Das Saplo-Panel zeigt dir deren Inhalt, wenn du ihn brauchst.

Wichtig bei der Registrierung: Da das Formular geöffnet ist und die E-Mail-Bestätigung deaktiviert ist, kann jeder, der die Adresse kennt, ein Konto anlegen. Für ein kleines Team auf einer wenig bekannten Subdomain ist das meistens kein Problem. Wenn die Adresse jedoch öffentlich bekannt wird, solltest du nach der Einrichtung des gesamten Team-Kontos die Registrierung deaktivieren, dazu weiter unten mehr.

Wie das Team arbeitet: Einladungen ohne E-Mail

Einladungen zum Penpot-Team werden per E-Mail verschickt. Die Standardinstallation auf Saplo hat keinen angeschlossenen Mailserver, daher werden Einladungs-E-Mails nicht versendet. Es gibt zwei Möglichkeiten:

• einfachere: Jedes Teammitglied legt ein eigenes Konto unter deiner Adresse an, und du fügst es dem Team hinzu oder teilst das Projekt mit ihm,
• vollständige: Du verbindest einen SMTP-Server, zum Beispiel dein bestehendes Firmenpostfach. Das machst du per SSH, indem du die Flagge enable-smtp und die Variablen PENPOT_SMTP_* in der Datei docker-compose.yml im App-Katalog einträgst und anschließend docker compose up -d startest. Ab dann funktionieren Einladungen, Passwortzurücksetzungen und Benachrichtigungen wie gewohnt.

SSH-Zugang ist in jeder Box ab Plan M inklusive, also hast du ihn auf Box L und XL sofort, zusammen mit vollem sudo.

Sicherheit und Einstellungen, die sich lohnen zu verändern

Einige Dinge, die du in der ersten Woche erledigen solltest:

• Deaktiviere die Registrierung nachdem du das Teamkonto angelegt hast. Füge die Flagge disable-registration zur Variable PENPOT_FLAGS in docker-compose.yml für Frontend und Backend hinzu und starte dann die Container neu. Neue Teammitglieder kannst du dann per Einladung hinzufügen, sofern SMTP eingebunden ist.
• Nutze deine eigene Domain für Kunden. Ein Prototyp, der an den Kunden unter der Adresse projects.deinefirma.de gesendet wird, wirkt seriöser als ein Link zu einer fremden Cloud.
• Denk an Backups. Bei der Box L sind Backups für 7 Tage im Preis enthalten, bei der Box XL für 14 Tage. Zusätzlich solltest du ab und zu die wichtigsten Dateien aus Penpot im Format .penpot exportieren, um eine Kopie unabhängig vom Server zu haben.
• Updates bewusst durchführen. Das Rezept nutzt stets die neuesten Penpot-Images. Vor größeren Updates überprüfe die Änderungsübersicht des Projekts und stelle sicher, dass du eine aktuelle Sicherung hast.

Die Kundenprojekte verlassen deinen Box nicht und landen nicht auf Servern in den Vereinigten Staaten. Für Agenturen, die mit Kunden Vertraulichkeitsvereinbarungen abschließen oder für sensible Branchen arbeiten, ist das oft ein stärkeres Argument als der reine Preis.

Häufige Probleme

Der Editor lädt beim ersten Aufruf sehr langsam. Das Java-Backend braucht nach dem Start der Container etwas Zeit zum Aufwärmen. Das erste Öffnen nach einem Neustart ist daher langsamer, die nächsten Male geht es schneller.

Der Export als PDF oder PNG funktioniert nicht oder dauert sehr lange. Der Exporter startet einen Browser im Hintergrund und verbraucht viel Speicher. Wenn auf der Box viele Anwendungen gleichzeitig laufen, reicht der RAM möglicherweise nicht aus. Prüfe die Logs des Exporter-Containers und wechsle bei dauerhaftem Speichermangel auf einen höheren Plan.

Die Einladung zum Team ist nicht angekommen. Das ist das Standardverhalten, da Penpot ohne SMTP keine E-Mails verschickt. Verbinde entweder SMTP oder bitte die Person, ein Konto anzulegen, und füge sie manuell hinzu.

Ich kann mich nach der Adressänderung nicht einloggen. Penpot speichert die öffentliche Adresse in der Konfiguration. Eine Änderung der Domain nach der Installation erfordert eine Aktualisierung der Variable PENPOT_PUBLIC_URI und einen Neustart der Container. Am einfachsten ist es, gleich zu Beginn die endgültige Adresse zu wählen.

Zusammenfassung

Penpot macht besonders dort Sinn, wo Figma am meisten weh tut: bei einem Team aus mehreren Designern, von denen jeder einzeln monatlich kostet. Für die Box L zum Preis von 139 € pro Jahr kannst du einen Editor für das gesamte Team einrichten, mit gemeinsamer Live-Bearbeitung, Komponentenbibliotheken, Prototypen und Exportmöglichkeiten, und die Projekte bleiben auf deinem eigenen Server. Bevor du das gesamte Team umziehst, erstelle ein neues Projekt in Penpot und prüfe, ob dir das Fehlen bestimmter Figma-Plugins auffällt. Wenn nicht, spricht die Rechnung für sich.

Starte auf der Penpot-Seite im App-Katalog von Saplo, und wenn du noch keine Box hast, vergleiche die Pläne im Preisverzeichnis.