Wickedness/heros_web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Replace sixth battle map with hand-painted asset

Browse Source
This commit is contained in:
Wickedness
2026-07-09 14:53:32 +09:00
parent 06daab628e
commit 1f7399ca4d
7 changed files with 15 additions and 88 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
docs/battle-map-terrain-atlas-pipeline.md
View File

@@ -2,7 +2,7 @@
## Scope
The first five campaign battles now use the same hand-painted tactical map pipeline. The renderer still reads the original scenario tile coordinates and battle logic; only the map texture asset changes from flat/vector map art to low-contrast raster terrain.
The first six campaign battles now use the same hand-painted tactical map pipeline. The renderer still reads the original scenario tile coordinates and battle logic; only the map texture asset changes from flat/vector map art to low-contrast raster terrain.
## Art Direction
@@ -22,6 +22,7 @@ python scripts/generate-handpaint-map-sample.py --map second --webp-quality 90
python scripts/generate-handpaint-map-sample.py --map third --webp-quality 90
python scripts/generate-handpaint-map-sample.py --map fourth --webp-quality 90
python scripts/generate-handpaint-map-sample.py --map fifth --webp-quality 90
python scripts/generate-handpaint-map-sample.py --map sixth --webp-quality 90
```
## Current Assets
@@ -31,6 +32,7 @@ python scripts/generate-handpaint-map-sample.py --map fifth --webp-quality 90
- `src/assets/images/battle/third-battle-map.webp`
- `src/assets/images/battle/fourth-battle-map.webp`
- `src/assets/images/battle/fifth-battle-map.webp`
- `src/assets/images/battle/sixth-battle-map.webp`
## QA Outputs
@@ -42,5 +44,7 @@ python scripts/generate-handpaint-map-sample.py --map fifth --webp-quality 90
- `docs/fourth-battle-map-handpaint-preview.png`
- `docs/fifth-battle-map-handpaint-before-after.png`
- `docs/fifth-battle-map-handpaint-preview.png`
- `docs/sixth-battle-map-handpaint-before-after.png`
- `docs/sixth-battle-map-handpaint-preview.png`
Browser screenshots are saved per verification run after build/deploy.

BIN
docs/sixth-battle-map-handpaint-before-after.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.5 MiB

BIN
docs/sixth-battle-map-handpaint-preview.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.3 MiB

9
scripts/generate-handpaint-map-sample.py
View File

@@ -64,6 +64,15 @@ MAP_CONFIGS = {
"before": BATTLE_IMAGE_DIR / "fifth-battle-map.svg",
"seed": 240744,
},
"sixth": {
"slug": "sixth-battle-map",
"terrain_export": "sixthBattleMap",
"units_export": "sixthBattleUnits",
"ally_positions_export": "sixthBattleAllyPositions",
"out": BATTLE_IMAGE_DIR / "sixth-battle-map.webp",
"before": BATTLE_IMAGE_DIR / "sixth-battle-map.svg",
"seed": 240754,
},
}

86
src/assets/images/battle/sixth-battle-map.svg
View File

@@ -1,86 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2400 2000" width="2400" height="2000">
<defs>
<filter id="grain">
<feTurbulence type="fractalNoise" baseFrequency="0.016" numOctaves="4" seed="112" />
<feColorMatrix type="saturate" values="0.52" />
<feBlend mode="multiply" in2="SourceGraphic" />
</filter>
<pattern id="grass" width="76" height="76" patternUnits="userSpaceOnUse">
<rect width="76" height="76" fill="#60754f" />
<path d="M10 23h22M43 51h20M22 64l14-11M56 17l12 9" stroke="#a5b476" stroke-width="3" opacity="0.25" />
<path d="M8 54l13-19M35 27l11-15M62 69l7-21" stroke="#344d32" stroke-width="2" opacity="0.34" />
</pattern>
<pattern id="earth" width="86" height="86" patternUnits="userSpaceOnUse">
<rect width="86" height="86" fill="#947247" />
<path d="M4 22c30-15 54 9 80-6M0 58c32-17 60 13 84-4" stroke="#c69b62" stroke-width="6" opacity="0.25" />
<path d="M20 74l12-20M52 36l20-13M66 70l11-7" stroke="#57462f" stroke-width="3" opacity="0.34" />
</pattern>
<pattern id="forest" width="108" height="94" patternUnits="userSpaceOnUse">
<rect width="108" height="94" fill="#30462d" />
<circle cx="22" cy="34" r="26" fill="#213923" />
<circle cx="53" cy="26" r="30" fill="#526f3f" />
<circle cx="82" cy="42" r="27" fill="#2b4229" />
<circle cx="46" cy="69" r="24" fill="#657f49" />
<path d="M12 52c26 15 62 14 90-5M32 23c19 16 47 14 64-5" stroke="#142515" stroke-width="5" opacity="0.36" />
</pattern>
<linearGradient id="river" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#4a839f" />
<stop offset="0.55" stop-color="#25536f" />
<stop offset="1" stop-color="#18384f" />
</linearGradient>
<linearGradient id="wall" x1="0" y1="0" x2="0" y2="1">
<stop offset="0" stop-color="#81705a" />
<stop offset="1" stop-color="#46382a" />
</linearGradient>
<linearGradient id="roof" x1="0" y1="0" x2="0" y2="1">
<stop offset="0" stop-color="#c88c38" />
<stop offset="1" stop-color="#7b5120" />
</linearGradient>
</defs>
<rect width="2400" height="2000" fill="url(#grass)" />
<g filter="url(#grain)">
<path d="M-110 1690C214 1452 450 1295 650 1082C826 895 994 764 1218 632C1412 518 1588 356 1780 92" fill="none" stroke="#a78455" stroke-width="244" stroke-linecap="round" opacity="0.98" />
<path d="M-110 1690C214 1452 450 1295 650 1082C826 895 994 764 1218 632C1412 518 1588 356 1780 92" fill="none" stroke="url(#earth)" stroke-width="166" stroke-linecap="round" opacity="0.92" />
<path d="M-80 980C240 914 474 840 690 690C912 536 1068 434 1300 422C1500 412 1668 326 1840 150" fill="none" stroke="#9e784b" stroke-width="174" stroke-linecap="round" opacity="0.9" />
<path d="M-80 980C240 914 474 840 690 690C912 536 1068 434 1300 422C1500 412 1668 326 1840 150" fill="none" stroke="url(#earth)" stroke-width="112" stroke-linecap="round" opacity="0.86" />
<path d="M1248 10c-44 220-4 396 126 532c154 162 186 334 130 534c-42 152-12 290 112 424c104 112 132 242 82 388" fill="none" stroke="#173c52" stroke-width="256" stroke-linecap="round" opacity="0.95" />
<path d="M1248 10c-44 220-4 396 126 532c154 162 186 334 130 534c-42 152-12 290 112 424c104 112 132 242 82 388" fill="none" stroke="url(#river)" stroke-width="172" stroke-linecap="round" opacity="0.98" />
<path d="M1310 146c38 116 56 220 10 332M1480 755c84 100 104 220 50 360M1648 1510c55 92 72 174 44 276" fill="none" stroke="#a9dce4" stroke-width="13" opacity="0.34" />
<path d="M-30 48c248-82 496-52 720 98c34 144-46 278-238 386c-218-8-384-82-500-222Z" fill="url(#forest)" opacity="0.88" />
<path d="M610 214c252-100 488-68 704 96c6 146-96 254-300 322c-238-34-366-152-404-418Z" fill="url(#forest)" opacity="0.82" />
<path d="M42 600c318-118 600-64 838 158c-86 222-340 344-760 354C-6 964-28 792 42 600Z" fill="url(#forest)" opacity="0.86" />
<path d="M1730 430c268-90 478-52 670 110v410c-248 72-486 8-702-190c-36-130-25-238 32-330Z" fill="url(#forest)" opacity="0.84" />
<path d="M650 1542c330-124 622-72 866 136c-62 220-304 330-724 322c-158-112-206-260-142-458Z" fill="url(#forest)" opacity="0.84" />
<g transform="translate(1570 70)">
<rect x="-30" y="-12" width="500" height="292" rx="18" fill="#2d261d" opacity="0.55" />
<rect x="0" y="0" width="438" height="250" rx="15" fill="url(#wall)" />
<rect x="38" y="48" width="362" height="162" fill="#756044" stroke="#241d15" stroke-width="12" />
<path d="M38 48h362M38 210h362M38 48v162M400 48v162" stroke="#35291e" stroke-width="10" />
<rect x="76" y="98" width="78" height="82" fill="#98714a" />
<rect x="190" y="72" width="88" height="108" fill="#9d7650" />
<rect x="318" y="98" width="56" height="82" fill="#8c6846" />
<path d="M58 98l58-45l60 45M176 72l58-50l68 50M304 98l42-36l52 36" fill="url(#roof)" stroke="#302316" stroke-width="9" />
<path d="M212 180v-58h44v58" fill="#1f1712" />
</g>
<g transform="translate(1720 560)">
<rect x="0" y="0" width="220" height="158" rx="12" fill="#5f4b36" />
<rect x="34" y="46" width="66" height="82" fill="#98714d" />
<rect x="124" y="36" width="70" height="92" fill="#96704a" />
<path d="M18 46l50-40l54 40M112 36l48-38l58 38" fill="url(#roof)" stroke="#322317" stroke-width="9" />
</g>
<g transform="translate(86 1422)">
<path d="M0 88c88-70 190-92 306-64c82 76 96 166 40 268c-122 22-234-4-332-78c-34-48-38-90-14-126Z" fill="#4f6264" opacity="0.48" />
<rect x="76" y="104" width="184" height="138" rx="10" fill="#604b36" />
<rect x="116" y="148" width="54" height="72" fill="#98724a" />
<rect x="190" y="136" width="46" height="84" fill="#96704a" />
<path d="M94 148l48-36l50 36M180 136l36-28l44 28" fill="url(#roof)" stroke="#2f2218" stroke-width="8" />
</g>
</g>
<rect width="2400" height="2000" fill="#0b0d12" opacity="0.07" />
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 5.9 KiB

BIN
src/assets/images/battle/sixth-battle-map.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 653 KiB

2
src/game/data/battleMapAssets.ts
View File

@@ -39,7 +39,7 @@ import secondBattleMapUrl from '../../assets/images/battle/second-battle-map.web
import seventhBattleMapUrl from '../../assets/images/battle/seventh-battle-map.svg';
import seventeenthBattleMapUrl from '../../assets/images/battle/seventeenth-battle-map.svg';
import sixteenthBattleMapUrl from '../../assets/images/battle/sixteenth-battle-map.svg';
import sixthBattleMapUrl from '../../assets/images/battle/sixth-battle-map.svg';
import sixthBattleMapUrl from '../../assets/images/battle/sixth-battle-map.webp';
import tenthBattleMapUrl from '../../assets/images/battle/tenth-battle-map.svg';
import thirteenthBattleMapUrl from '../../assets/images/battle/thirteenth-battle-map.svg';
import thirtiethBattleMapUrl from '../../assets/images/battle/thirtieth-battle-map.svg';