- Penpot は、デザイナーと開発者が一緒に使える オープンソースのデザインおよびプロトタイピングツール で、ブラウザベースまたはセルフホスティングで提供される
- SVG, CSS, HTML, JSON などのオープン標準を基盤とし、デザイントークン、コンポーネントシステム、CSS Grid Layout などの最新機能を含む
- プラグインシステム と API・Webhook統合機能 により外部アプリケーションと連携でき、Inspectモード でそのまま使えるコードの確認をサポート
- コミュニティ主導のプロジェクトで、ライブラリ・テンプレート共有、バグレポート、翻訳への参加 など多様な貢献方法を提供
- Mozilla Public License 2.0 の下で公開されており、デザインと開発のコラボレーション効率 を高めるオープンソースエコシステムの拡大に貢献
Penpot 概要
- Penpot は、デザインとコードのコラボレーションのための初のオープンソースデザインツール であり、デザイナーはインタラクティブなプロトタイプやデザインシステムを作成し、開発者はすぐに使えるコードを活用できる
- ブラウザですぐに利用することも、自社サーバーにインストールすることも可能
- 無料 で提供され、SVG・CSS・HTML・JSON などの標準技術を基盤としている
- 最新バージョンでは デザイントークン をネイティブ統合し、デザインと開発の効率的な協業を支援
- 2.0 リリース では、CSS Grid Layout、UI の全面刷新、新しいコンポーネントシステム などの大規模アップデートを含む
- チーム単位の追加サービスが必要な組織は別途問い合わせ可能
- 毎年 Penpot Fest を開催し、オープンソースデザインコミュニティと交流
Why Penpot
- Penpot はデザインをコードの形で表現することで、デザイナーと開発者の双方向コラボレーション を可能にする
- プラグインシステム により機能拡張と外部アプリ連携をサポート
- 開発者フレンドリーな構造 で、リアルタイムコラボレーションまたは単独作業を選択可能
- Inspectモード で、すぐに使える SVG・CSS・HTML コード を確認可能
- セルフホスティング機能 により、組織は完全な所有権を持つコラボレーション環境を構築可能
- API および Webhook 統合 を通じて開発ツールチェーンと連携
- デザイントークン・コンポーネント・Variants を活用して一貫性のある UI システムを構築
Getting Started
- Penpot は、デプロイ環境に縛られない唯一のデザイン・プロトタイププラットフォーム として、SaaS とセルフデプロイの両方をサポート
- Docker, Kubernetes, Elestio など多様なインストールオプションを提供
- インストールおよびデプロイガイドは公式Webサイトで確認可能
Community
- オープンソースコミュニティを中心に運営されており、デザイン・コード・アイデアの貢献 を歓迎
- コミュニティフォーラムで質問、問題解決、改善提案、イベント参加が可能
- 主なカテゴリ: Ask the Community, Troubleshooting, Help us Improve Penpot, #MadeWithPenpot, Events and Announcements, Inside Penpot, Penpot in your language, Design and Code Essentials
- すべての参加者は Code of Conduct を遵守し、前向きで安全な環境づくりが必要
Contributing
- さまざまな方法でプロジェクトに貢献可能
- ライブラリ・テンプレートの作成と共有
- チーム招待とコミュニティ参加
- バグレポート または GitHub Issue の登録
- 翻訳への参加 および フィードバックの提供
- Penpot コードへの貢献 のための開発者ガイドと動画を提供
- 貢献に関する詳細は Contributing Guide で確認可能
Resources
- ドキュメント、チュートリアル、開発アーキテクチャ、Dev Diaries など多様な資料を提供
- [Documentation], [Getting Started], [Tutorials], [Architecture], [Dev Diaries] のリンクを提供
License
- Penpot は Mozilla Public License 2.0 (MPL-2.0) の下で配布
- 著作権は Kaleidos Inc. にあり、オープンソースプロジェクトとして公開されている
1件のコメント
Hacker Newsの意見
Penpotを本当に気に入りたかったが、数か月前に使ってみたとき、ページ間を移動するだけでドキュメントの一部が妙に変形するバグがあった
重要なドキュメントでそんなリスクは負いたくなかったので、Figmaを使い続けた
そろそろもう一度試してみようかと思ったが、修正されないまま8か月間そのままらしい
そこまで深刻な問題なら、無視され続けることはなさそうだ
Penpotはセルフホスティングしかできないわけではなく、公式ホスティング版もある
無料プランは最大8人、10GBのストレージまで対応している
次の段階は人数無制限で月額$175上限、25GB制限
最上位プランは月額$950上限で無制限ストレージを提供する
「私たちはオープンソース版のXを作った」という話の先には、しばしばエンタープライズ版が現れる
業界でこうした表現があまりに一般的なのは残念だ
UI要素の作業では、Penpotが自分にとって最もよく使うベクターエディタだ
シンプルで、単位やレイアウト管理がうまくできている
アイコンや簡単なグラフィックを作るときに楽しさがある
エクスポートシステムも素晴らしく、整理しやすい
アプリ全体のフロー以外にもさまざまな用途に使え、初期のSketch時代の生産性を思い出させる
これがオープンソースだというのが信じがたいほどだ
フォントが違うと別の環境でデザインが崩れることがある
特にSVGエクスポート時には、テキストを含むデザインがまったく違って見えることがある
Penpotは不安定で、10ページ以上の作業では頻繁にクラッシュする
64GB RAMのサーバーで動かしても、5〜6ページあたりからメモリを20GB使い、チーム全体が深刻なラグに見舞われ、最終的に落ちる
Penpotは自分にとってYaCyを思い出させる
プロジェクトは素晴らしいが、言語選定が惜しい
(YaCyはJava、PenpotはClojureで書かれている)
スタンドアロンのデスクトップ版が欲しいなら、このリリースページを参照できる
オフライン利用のためにはDockerでローカルインスタンスを立ち上げる必要がある
自分はWebスタックやセルフホスティングの性能コスト(performance tax)を受け入れるとしても、自分のデザインファイルがクローズドなクラウドに縛られないことの方が重要だ
Figmaは素晴らしいが、今や製品組織全体の単一障害点になってしまっている
Penpotが今は遅くても、
docker-compose upで自分自身がパイプラインを所有できるなら、その方が良いと思うパフォーマンスはコードで改善できるが、ライセンス制約はユーザーには変えられないからだ
これまではWebデザイナーだけがオープンソースに関心を示していた
Penpotはかなり実用的だが、大きなキャンバスでは非常に遅くなる
すべてを1つのキャンバスに入れない方がいい
非公式デスクトップ版もある
コミュニティ投稿によると、ホスティング版より遅延が大きい
実際に使ったことがある人がいるのか気になる
Penpotはすでに3年前にもHacker Newsで初めて議論された
当時は1145ポイント、128件のコメントが付いていた