究極のドラッグ&ドロップ LVGL エディター & GUI ビルダー。

よくある質問

PicoPixel について知っておくべきすべてのこと。お探しの情報が見つかりませんか?お問い合わせください

一般

PicoPixel とは何ですか?

PicoPixel は、LVGL 用のブラウザベースのビジュアルエディターです。LVGL は組み込みディスプレイ向けの人気のオープンソースグラフィックスライブラリです。レイアウトのボイラープレートコードを手書きすることなく、デザイン、ライブシミュレーターでのプレビュー、本番環境対応の C code のエクスポートが可能です。仕組みを見る

何かインストールする必要はありますか?

いいえ。PicoPixel は完全にブラウザ内で動作します — デスクトップアプリ、プラグイン、SDK のインストールは不要です。エディターの URL を開き、GitHub または Google でサインインして、デザインを開始してください。

どのブラウザがサポートされていますか?

PicoPixel は最新バージョンの Chrome、Edge、Firefox で最適に動作します。Safari もサポートされていますが、一部の LVGL ウィジェットで軽微なレンダリングの違いが生じる場合があります。

PicoPixel はどのプラットフォームとボードをサポートしていますか?

PicoPixel は、LVGL ポートを持つあらゆるプラットフォームで動作する標準 LVGL C code を生成します — ESP32(ESP32-P4 を含むすべてのバリアント)、STM32、Arduino、Raspberry Pi Pico、NXP、Renesas、Linux ベースのシステムを含みます。LILYGO、M5Stack、Waveshare、Guition、Elecrow、Adafruit のボードでテスト済みです。

PicoPixel は SquareLine Studio とどう違いますか?

PicoPixel はブラウザベース(インストール不要)で、リアルタイムのチームコラボレーションをサポートし、WebAssembly 駆動のライブ LVGL シミュレーターを搭載しています。SquareLine Studio は商用利用に有料ライセンスが必要なデスクトップアプリケーションです。PicoPixel は generous な無料ティアと競争力のある有料プランにより、大幅に手頃です。詳細な比較については、LVGL エディター比較をご覧ください。

PicoPixel は他の LVGL エディターとどう比較されますか?

PicoPixel、SquareLine Studio、EEZ Studio の詳細な比較を提供しています。機能、料金、コラボレーション、コードエクスポートなどを網羅しています。完全な LVGL エディター比較をご覧ください。

PicoPixel の一般的なワークフローは何ですか?

ワークフローは次の通りです:キャンバス上でインターフェースを視覚的にデザインし、ビジュアルイベントエディターでインタラクションを接続し、ライブ LVGL シミュレーターでプレビューし、本番環境対応の C code をエクスポートし、ファームウェアプロジェクトに統合します。ステップバイステップのガイドについては、PicoPixel の仕組みをご覧ください。

エディターと機能

PicoPixel はどのバージョンの LVGL をターゲットにしていますか?

PicoPixel は現在 LVGL 8.x をターゲットとしており、v9.x のサポートを計画しています。生成されるコードは標準 LVGL API 呼び出しを使用するため、最新の 8.x リリースで問題なくコンパイルできます。

既存の LVGL プロジェクトをインポートできますか?

SquareLine Studio や EEZ Studio など他のエディタの生の LVGL C コードやプロジェクトはインポートできません。ただし、LVGL デザイン全体を含む .picopixel プロジェクトファイルはエクスポート、共有、インポートできます。外部 LVGL ソースファイルからのインポートはロードマップにあり、最も要望の多い機能の一つです。

ライブプレビューはどのように動作しますか?

PicoPixel は LVGL を WebAssembly にコンパイルし、ブラウザで直接実行します。プレビューに表示されるのは実際の LVGL レンダリングエンジンであり、モックアップではないため、出力はターゲットハードウェアとピクセル単位で一致します。

カスタムフォントや画像を使用できますか?

はい。エディタにカスタムフォントファイルや画像アセットを直接アップロードできます。PicoPixel にはバンドルフォントのライブラリもあり、手動でフォントを探して変換しなくても、クリックするだけで LVGL プロジェクト向けに変換できます。Arabic、Hebrew、Chinese、Japanese、Korean などの言語向けにフル Unicode サポートも含まれます。Fonts ワークスペースモードでは LVGL フォントの配列を作成・管理でき、Assets Library には再利用可能なウィジェット、画像、フォント、カラーを保存できます。詳しくは LVGL fonts guide、または複数言語入りのバンドルフォントを試せる fonts template をご覧ください。

PicoPixel にはライブ LVGL シミュレーターがありますか?

はい。PicoPixel は LVGL を WebAssembly にコンパイルし、ブラウザで直接実行します。シミュレーターは実際の LVGL エンジンを使用してデザインをレンダリングするため、表示はターゲットハードウェアと一致します。インタラクションオーバーレイにより、タップやスクロールが可能な要素が表示されます。クライアントやチームメイト向けに共有可能なシミュレーターリンクも生成できます。

複数の人が同時にプロジェクトを編集できますか?

はい。PicoPixel はリアルタイム共同編集に対応しています。複数のチームメンバーが同じプロジェクトで同時に作業し、コメントや注釈を残し、お互いの変更をライブで確認できます。内蔵バージョン管理でチェックポイントを作成して変更を追跡でき、チームメイトがフィードバックを残したときは通知で把握できます。

PicoPixel はどのようなコードをエクスポートしますか?

PicoPixel は、クリーンで本番環境対応の LVGL C code(.c および .h ファイル)を含む zip ファイルをエクスポートします。出力にはウィジェットのセットアップ、スタイリング、レイアウト、イベントバインディング、アセット参照が含まれます — すべて標準 LVGL API 呼び出しを使用し、プロプライエタリな依存関係はありません。

PicoPixel にはビジュアルイベントエディターがありますか?

はい。イベントエディターでは、LVGL イベントハンドラーをビジュアルに設定できます — 画面遷移、スタイル変更、値の更新などのアクションをウィジェットにドラッグするだけで、C code を書く必要はありません。PicoPixel はエクスポート時に LVGL イベントコールバックを自動生成します。すべての機能をご覧ください。

PicoPixel には組み込みのバージョン管理がありますか?

はい。PicoPixel にはチェックポイント、詳細なセッション履歴(Session Actions)、任意の以前の状態への復元機能を備えた組み込みバージョン管理が含まれています。UI デザイン作業に外部 VCS は不要です。

ワークスペースモードとは何ですか?

PicoPixel のエディタには Build、Reference、Animation の3つのモードがあります。Build mode では LVGL ウィジェットを配置・デザインし、アセットを管理してインターフェースを作ります。Reference mode では LVGL 画面の外側に、自分やチーム向けのメモとしてテキストや画像を追加できます。これらは LVGL コンテンツではなく、エクスポートもされず、.picopixel ファイル共有時にも引き継がれません。Animation mode では、位置、サイズ、不透明度などのウィジェットプロパティにカスタムアニメーションを作る高度なタイムライン型キーフレームエディタを使えます。

PicoPixel にはアニメーションエディタがありますか?

はい。PicoPixel には、フルタイムライン型キーフレームエディタを備えた強力な Animation mode があります。位置、サイズ、不透明度などのウィジェットプロパティを時間に沿ってアニメーション化し、カスタムアニメーションカーブを作成し、複雑なマルチトラックシーケンスを組むことができます。アニメーションはシミュレータでライブプレビューされ、LVGL C コードの一部としてエクスポートされます。他のエディタとは異なり、PicoPixel は無料・有料を問わずアニメーションをプランで制限しません。悪用防止のためプロジェクトあたり 100 アニメーションという現実的な上限はありますが、ティア別の制限はありません。

技術

PicoPixel で ESP32 のタッチスクリーン UI を構築できますか?

もちろんです。PicoPixel は、ESP32-S3、ESP32-P4 などを含む、あらゆる ESP32 バリアントで動作する標準 LVGL C code を生成します。エクスポートは Waveshare と Guition の ESP32-P4 ボードでテスト済みです。タッチスクリーンのレイアウトを視覚的にデザインし、シミュレーターでプレビューし、ESP-IDF、Arduino、または PlatformIO 用のコードをエクスポートできます。PicoPixel for ESP32 について詳しく見るか、ESP32 LVGL UI のステップバイステップチュートリアルで始め方を学ぶ。

PicoPixel はオフラインで動作しますか?

PicoPixel はインターネット接続を必要とするウェブアプリケーションです。自動保存機能が含まれているため、接続が途切れても作業は保護されます。オフラインサポートをご希望の場合はお知らせください。防衛・医療など、エアギャップ環境が必要な組織向けには、アプリ全体を自社ハードウェア上で自社認証(LDAP、SSO、任意の OAuth プロバイダ)配下に展開できる専用オンプレミスオプションを提供しています。カスタム監査ログと完全な監査証跡も含まれます。詳細をご希望の場合はお問い合わせください。

PicoPixel はどの LVGL ウィジェットをサポートしていますか?

PicoPixel は、ボタン、ラベル、スライダー、スイッチ、ドロップダウン、ローラー、アーク、バー、チャート、画像、チェックボックス、テキストエリア、タブビュー、コンテナなどのコア LVGL ウィジェットセットをサポートしています。ウィジェットセットは拡大中で、新しいウィジェットが積極的に追加されています。

PicoPixel は ESP-IDF、Arduino、PlatformIO と連携しますか?

はい。エクスポートされたコードはプロプライエタリな依存関係のない標準 LVGL API 呼び出しを使用するため、ESP-IDF、Arduino IDE、PlatformIO を含む LVGL をサポートするあらゆるビルドシステムと統合できます。ステップバイステップの手順については ESP32 統合ガイドをご覧ください。

PicoPixel はどのディスプレイ解像度をサポートしていますか?

PicoPixel では、ターゲットハードウェアに合わせて任意のディスプレイ解像度を設定できます — 240x240 の小型丸型ディスプレイ(GC9A01)から 320x240 SPI TFT、800x480 パネル、さらに大きなサイズまで。ライブシミュレーターは選択した解像度でレンダリングします。

料金とプラン

PicoPixel は無料で使えますか?

はい。PicoPixel は無料で使え、今後も無料ティアは続きます。クレジットカードは不要です。ローンチ以降、PicoPixel は予想以上のペースで成長しており、コミュニティの反応をとてもうれしく思っています。有料プランは、より大きな規模が必要なチームやユーザー向けに現在ご利用いただけます。無料の Community ティアは、コア編集、ライブシミュレータ、コードエクスポートなどを含む generous な内容のまま残ります。有料プランは拡張ストレージ、より多くのプロジェクト、より大きなチーム、商用利用しきい値が必要な場合のためのものです。詳細は 料金ページをご覧ください。

無料ティアはありますか?

はい。コア編集、ライブシミュレータ、コードエクスポート、最大 10 プロジェクトを含む無料の Community ティアをご利用いただけます。生成コードの商用利用は一部の有料ティアで利用できます。詳しくは 料金ページをご覧ください。

料金体系はどうなっていますか?

有料プランは個人向けに Starter($10/月)から Pro($20/月)、チーム向けに Startup($100/月)から Enterprise($450/月)までで、年額割引もあります。プランはストレージ、プロジェクト上限、チーム席、商用利用しきい値を拡張します。既存アカウントはそのまま引き継がれます。全体の内訳は 料金ページをご覧ください。

PicoPixel で生成されたコードを商用製品に使用できますか?

エクスポートされたコードは、独自依存のない標準 LVGL API 呼び出しを使用しています。Pro プラン以上では、PicoPixel が生成したコードを商用製品で自由に使用できます。Community と Starter プランは個人、教育、ホビー用途向けで、商用利用権は含まれません。詳しくは 料金ページをご覧ください。

LVGL インターフェースを無料で作り始める

組み込み UI をビジュアルに設計し、ライブ LVGL シミュレータでプレビューして、本番対応 C コードをエクスポートできます。インストール不要。クレジットカード不要。ブラウザで PicoPixel を開いて、すぐにデザインを始められます。

無料で始める!

FAQ を読む · お問い合わせ