ハクソク

世界を動かす技術を、日本語で。

デラックスペイントをモデルにしたウェブベースの画像編集ツール

120日前原文(github.com)

概要

DPaint.jsは、伝説的なDeluxe Paintを模した ウェブベース画像編集ツール。 Amigaレトロファイル形式 に特化し、現代の画像フォーマットも幅広く対応。 Amigaエミュレータ を内蔵し、実機同様のプレビューが可能。 完全無料・オープンソースで、 ブラウザのみで動作。 オフライン利用や独自ビルドも対応、開発者向けサポートも充実。

DPaint.jsの主な特徴

  • Deluxe Paint風UI を採用したWebベース画像エディタ
  • レイヤー・選択・マスク・変形・エフェクト・フィルタ など多機能搭載
  • 複数回のアンドゥ/リドゥ、他画像ソフトとのコピペ互換
  • カスタマイズ可能なディザリングツール と、細かな減色オプション
  • カラーサイクリング 対応によるレトロな動的表現
  • Amigaアイコンファイル全形式の読み書き・変換
  • IFF ILBM画像 （HAM/24bit含む）読込、最大256色での書き出し
  • Amiga Disk File (ADF) から直接画像の読み書き
  • 内蔵Amigaエミュレータ で実際のDeluxe Paint互換プレビュー
  • 12bit/9bitパレット制限 （Amiga OCS/ECS、Atari STモード対応）
  • PBMファイル （PC版Deluxe Paint形式）対応
  • Deluxe Paint Atari ST圧縮モード サポート
  • 100%無料・オープンソース・広告/トラッキング/アカウント不要
  • 全処理がローカルブラウザ内 で完結、データ送信なし
  • 全コードはプレーンJavaScript（ES6モジュール）、依存パッケージ無し
  • iPad等タッチデバイス対応
  • オンライン版: https://www.stef.be/dpaint/
  • ドキュメント: https://www.stef.be/dpaint/docs/

ビルドとオフライン利用

  • ビルド不要、依存ライブラリ無し、index.htmlをWebサーバで公開するだけ
  • Parcel.js利用のビルド（省スペース版） も可能
    • package.json同梱、npm install後npm run buildでdistフォルダ生成
  • オフライン利用 も可能（Webサーバ経由でindex.htmlを提供）
    • 例：Sparkアプリを利用し、ローカルサーバで動作
    • Chromeの「アプリとしてインストール」機能でオフライン利用
  • Amigaエミュレータファイル はリポジトリ非同梱、Scripted Amiga Emulatorベース

コントリビュート・開発者向け情報

  • 現状α版、バグ報告・プルリクエスト歓迎
  • 今後の予定機能
    • カラーサイクリング（実装済）
    • GIF/Amiga ANIMファイルのアニメーション対応（実装済）
    • パレット内で完結するシェーディング/透明度ツール（実装済）
    • 非正方形ピクセルモード（HiRes/Interlaced）
    • PSDインポート/エクスポート
    • スプライトシート対応
    • HAM/SHAM/Dynamic HiRes画像書き出し
    • Commodore 64グラフィックモード対応

ブラウザ固有の注意点

  • Braveブラウザ は「farbling」機能で画像ノイズ発生の可能性
    • プライバシー保護のためだが、正常動作しない場合あり
    • Brave利用時はシールド解除、または他ブラウザ推奨

カラーサイクリング

  • Color Cycling は、パレット内の色を回転させて静止画をアニメーション化する手法
  • DPaint.jsで完全対応、レトロな表現を再現可能
  • サンプル: The_Vision_cycle.mp4
  • 上記画像のレイヤー付きソースファイルをDPaint.jsで直接開くことが可能

Hackerたちの意見

いいね！コードがすごくきれいだね！それに、なんかクリーンな感じもする。こういうプロジェクト好きだな、"エンタープライズ"とか、もっとひどいスタートアップのコードにある退屈な制約がないから。

SteffestがGERP 2026のカラサイクリングコンペに出した作品を見せてたよ。彼のツールのいくつかを使って作ってるんだ、DPaintも含めて。 https://www.youtube.com/watch?v=VyB5cvA6f78 編集：Readme.mdの一番下にリンクが貼ってあったのに、最初に下までスクロールしておくべきだったな。

このアプリをしばらくフォローしてるよ。著者がすごく才能のあるグラフィックアーティストで、デモシーンの人でもあるってことは注目すべきだね。このツールで作られた作品は、いろんなデモシーンのコンペでよく見かける。

└

そうだね！彼の最近の作品の一つを別にコンペに投稿したけど、このスレッドにまとめて投稿すればよかったな。 https://www.youtube.com/watch?v=VyB5cvA6f78 彼はこのアミガデモも作って、その音楽も書いてるんだ。マルチタレントだね！ https://www.youtube.com/watch?v=cc8f7zg3-v8

懐かしさは感じるけど、DPIIはライトテーマのツールだったのに対して、これはダークテーマで、読みづらいな。DPIIはLinuxのDoxBoxでこうやって動かしてるよ：dosbox DP.EXE あと、君のアプリにはパースペクティブツールが見当たらないね。

これいいね！数年前にシンプルなDPaintクローンを作ろうと思ったことがあって（でもこのプロジェクトよりずっと簡単なやつ）、最初はツールアイコンを描いてたんだけど、興味を失っちゃった :-P。でも、結局それをLazarusのピクセルアート編集コンポーネントに再利用したんだ[0]（アイコンは自分のGUIプログラム用の「Bad-Common-Icons」アイコンセット[1]に入れてる）。いつかPaint Shop Pro 7（デスクトップ用、ウェブじゃなくて）みたいなものを作りたいと思ってる。あれが画像編集プログラムの中で一番UXがいいと思うから（後のPSPのバージョンはあまり好きじゃないけど）。それはさておき、これを少し触ってみたら、スムージングツールのブレンドにバグがあったよ[2]。ブラウザによって動作が違うみたいで、FirefoxとFalkon（QtWebEngine / Chromiumを使ってる）で挙動が異なる。スムージングツールの不透明度の扱いも変な感じで、1%でも画像にかなり影響を与えてるように見える。ほんの少しの違いのはずなのにね。[0] https://i.imgur.com/kht16dJ.png [1] http://runtimeterror.com/tools/icons/ [2] https://github.com/steffest/DPaint-js/issues/50

└

確かに！色を混ぜるのって意外と難しいよね。ほとんどの懸念に対処したアップデートを出したよ。まだ完璧ではないけど、改善はされてる。これらの変更がある開発版はここにあるよ：https://www.stef.be/dpaint/dev/

もう一つのDeluxe PaintクローンはPyDPainterだよ。Pythonベースで、Windows、Mac、Linuxで使える。UIはオリジナルをすごく思い出させるね。 https://github.com/mriale/PyDPainter

これってDeluxePaintにどんな関係があるの？俺にとってDeluxePaintの特徴はブラシの使い方なんだ。Bを押して、いくつかのピクセルを選ぶと、そのピクセルがすぐに描画に使うブラシになるんだよ。 https://classicreload.com/play/dosx-deluxe-paint-animation.h... このクローンはそれをやってないから、全然Deluxe Paintとは似てないし、モデルにしてるって言うのはちょっと不誠実だと思う。

└

DPの曖昧な記憶は、カラーパレットをサイクルするためのカスタムレンジに集中してるな。才能あるアーティストなら、シンプルなアニメーションシーンを作れるよね。

└

リンク先のバージョンには入ってないけど、開発版にはさらにブラシの強化があるよ。ブラシ関連はまだ作業中みたい。

DOS用のDeluxe Paint 2が僕のお気に入りの描画プログラムだったから、これをチェックしないわけにはいかなかった。結構いい感じ！ただ、ピクセルアートには特に悪い非整数ズームレベルがあるから、推薦するのをためらっちゃう。レイヤーを移動させるのも混乱した。Layer → Transform → Free Transformをクリックしないと移動できなかったから、ツールパネルにそれ専用の移動アイコンがあればもっと分かりやすいのに。

依存関係ゼロのバニラJSは新鮮だね。コードを見てみると、Amigaファイルフォーマットや色のサイクルを扱ってる割には意外と読みやすい。デモシーンとのつながりも納得だね。そのコミュニティは常に少ないもので多くを成し遂げることを重視してきたから。

└

そうだね、みんながNodeをインストールしてる前提の無限のJavaScriptライブラリにはうんざりだよ。