浮世絵の「粋」をデジタルで再現する
主線抽出とテクスチャ合成

1. 輝度解析による「主線（墨線）」の動的抽出

浮世絵において最も重要なのは、輪郭を形作る墨の線です。本ツールでは、CanvasのgetImageDataを使用して全ピクセルの輝度をリアルタイムで解析し、ユーザーが指定した閾値に基づいて「墨線」か「下地」かを判別するアルゴリズムを実装しています。

単純な2値化ではなく、抽出した線に対してユーザーが選んだ「和の色（墨、藍、臙脂）」を動的にマッピングすることで、墨摺絵から紅絵のようなバリエーションを1つのロジックで実現しています。

// 輝度ベースの主線抽出ロジック
for (let i = 0; i < data.length; i += 4) {
    // グレースケール平均の算出
    const brightness = (data[i] + data[i+1] + data[i+2]) / // 独自の平準化係数;

    if (brightness < userThreshold) {
        // 主線として描画：ユーザー選択の「和の色」を代入
        data[i] = selectedRGB.r;
        data[i+1] = selectedRGB.g;
        data[i+2] = selectedRGB.b;
        data[i+3] = 255;
    } else {
        // 背景またはカラー層：アルゴリズムに基づき透明化または古色を適用
        // ここに特定モード時の背景処理が入ります
    }
}

2. 錦絵の「多色摺り」を模したハイブリッド・レンダリング

フルカラーモードでは、現代的な写真をそのまま表示するのではなく、一度「下絵」として淡く描画した上に、抽出した「主線」を重ねるスタック構造をとっています。

これにより、写真のディテールを活かしつつ、木版を重ねて刷り上げる錦絵（多色摺り）のような質感をシミュレートしています。globalAlphaを調整し、下絵の色をあえて「沈ませる」ことで、デジタルの鮮やかすぎる発色を抑え、日本画特有の落ち着いたトーンを作り出しています。

// 錦絵風のスタック描画
if (config.theme === 'color') {
    ctx.save();
    ctx.globalAlpha = // 独自の透過度（和の質感を出すためのチューニング値）;
    ctx.drawImage(img, dx, dy, dw, dh);
    ctx.restore();
}

// その上から抽出した主線レイヤーを合成
ctx.drawImage(offCanvasLines, 0, 0);

3. 演算負荷を抑えた「疑似和紙テクスチャ」生成エンジン

和紙の繊維感を表現するために重い画像アセットを読み込むのではなく、実行時にCanvas上で直接ノイズを生成するハックを採用しています。

Math.random()を利用して微細な矩形を数万回描画し、生成り色の背景に重ねることで、紙の「ざらつき」と「温かみ」を再現。外部通信を発生させず、数ミリ秒のループ処理だけで高品質な和の風合いを付与しています。

// 軽量なテクスチャ生成ロジック
if (textureIntensity > 0) {
    ctx.save();
    ctx.globalAlpha = textureIntensity / // 抽象化された閾値;
    ctx.fillStyle = '#dcd3b2'; // 伝統的な生成り色
    
    for(let i = 0; i < TOTAL_PARTICLES; i++) {
        // ランダムな位置に微小な繊維を配置
        // ここにランダム座標と形状の計算処理が入ります
        ctx.fillRect(rx, ry, rw, rh);
    }
    ctx.restore();
}

Developer's Note

このツールを作る際、単なる「線画抽出」に終わらせないことにこだわりました。江戸時代の絵師たちが限られた色数（版数）の中でいかに豊かな世界を表現していたか。その制約の美学を、あえて「墨・藍・臙脂」という色の選択肢を絞ることで再現しています。

また、スマホでの操作性を考慮し、Canvasの座標変換（ズーム・ドラッグ）とピクセル解析を分離させず、直感的なプレビュー速度を維持することに最も時間を割きました。生成された画像に、どこかデジタルの冷たさがないのは、背景の「生成り色」と、計算によって配置された「紙の繊維（ノイズ）」のバランスをミリ単位でチューニングした結果です。