拼豆(Perler Beads)AI図案ジェネレーター

Web

概要

本リポジトリ「perler-beads-ai」は、画像から拼豆(Perler Beads)の図案(ドット絵形式のテンプレート)をAIで自動生成するプロジェクトです。Zippland/perler-beads をベースに改良を加え、AIを使って色の統合・境界の整形・不要ノイズの削減などを行うことで、色数や必要ビーズ数を抑えつつ視認性の高い図案を作成します。生成結果は多様なスタイルに対応し、購入リストや印刷用出力など実用的な機能も備え、趣味のクラフトや教育用途に適したワークフローを提供します。

GitHub

リポジトリの統計情報

  • スター数: 9
  • フォーク数: 4
  • ウォッチャー数: 9
  • コミット数: 13
  • ファイル数: 23
  • メインの言語: TypeScript

主な特徴

  • AIによる画像最適化:色数の削減、同系色の自動統合、境界のノイズ除去を行い図案を見やすくする
  • ワンクリック生成:アップロードした画像から自動で拼豆図案を生成、必要なビーズ数の集計や印刷用出力が可能
  • 多様なスタイル対応:ドット密度や色数の制御でシンプル〜詳細まで複数スタイルの図案を生成
  • 実用性重視:購入リスト出力や色ごとの集計、エクスポート機能で制作〜購入〜制作完成までを支援

技術的なポイント

本プロジェクトはTypeScriptベースのWebアプリケーションで、既存のZippland/perler-beadsの図案生成ロジックにAIベースの前処理を組み合わせています。AI処理は主に画像の色空間解析とクラスタリング、エッジリファインメント(境界の滑らか化)にフォーカスしており、色のクラスタリングにはk-meansや平均シフトのような手法に近い処理を用いるとともに、人間の視認性を考慮した色合成アルゴリズムを導入しています。これにより「近似色の自動統合」や「灰色の毛羽立ち」を抑えることが可能です。

生成パイプラインは、入力画像の前処理(リサイズ、ノイズ除去)→AI最適化(色クラスタリング、エッジ補正、パレット最適化)→マッピング(ビーズ格子への割当)→出力(PNG/印刷レイアウト、材料リスト)の流れで実装されています。TypeScriptを採用することでフロントエンドでの高速なインタラクションと型安全なコードベースを実現し、必要に応じてサーバーサイドでの重い処理(大きな画像やモデル推論)を分担できる構成になっています。

また、ユーザーが色数や粒度(ビーズの大きさ・グリッドサイズ)を調整できるUIを備え、AI出力に対する手動微調整もサポート。これにより、完全自動生成と細かな手動チューニングの両立を図っています。READMEやdocsのスクリーンショットからも分かる通り、生成される図案は視覚的に明瞭で、実際の制作時の把握や材料調達に役立つデータ(色ごとの数、合計数)を出力できる点が実用面での強みです。

プロジェクトの構成

主要なファイルとディレクトリ:

  • .cursor: dir
  • .gitignore: file
  • CLAUDE.md: file
  • LICENSE: file
  • README.md: file

その他の構成要素(抜粋と想定される役割):

  • docs/: 生成結果のサンプル画像(docs/1.png 〜 docs/6.png)が配置され、出力イメージの確認が可能
  • src/(想定): TypeScriptで書かれた主要ロジック。画像処理、AI最適化、図案化アルゴリズム、UI連携を含む
  • public/ または assets/: ウェブUI用の静的ファイルやアイコン、フォント等
  • package.json(想定): 依存関係とスクリプト。TypeScript、ビルド、ローカル起動用の設定が含まれているはずです
  • README.md: プロジェクトの説明、利用方法、デモ画像、目標とする改善点(色認識の精度向上、境界の改善、同色合成、自動色選択、購買リスト、出力制限の解除)についての記載

実際のリポジトリは23ファイルとコンパクトな構成で、開発を始めやすい構造になっています。AI関連の処理は軽量なクライアント側実装か、外部API/サービス(またはローカルの軽量モデル)に委任する設計が想定され、拡張やサービス化もしやすい作りです。

まとめ

AIで図案作成を自動化し、実用的な制作ワークフローを提供する優れた試作プロジェクト。

リポジトリ情報:

  • 名前: perler-beads-ai
  • 説明: 因为市面上的拼豆软件差强人意 ,所以我基于开源项目:Zippland/perler-beads , 我加上AI优化了项目,AI辅助优化图片功能,写了一个专门生成拼豆图纸的网站。 经过大量测试,我觉得已经可以达到 一键生成拼豆图纸了!
  • スター数: 9
  • 言語: TypeScript
  • URL: https://github.com/liangdabiao/perler-beads-ai
  • オーナー: liangdabiao
  • アバター: https://avatars.githubusercontent.com/u/1232260?v=4