feat: immerse the portfolio in a chromatic synthwave night
Carry rose, violet, coral, electric blue and cyan through the interface, road, terrain, signs and atmosphere. Add a Blender-authored paint edition and matching runtime fallback captures. Interpolate atmospheric color on a small sky lattice and enrich existing speed effects without another rendering pass. Preserve approved copy, project media, metadata, navigation contracts and adaptive audio. Verified with typecheck, client/SSR builds, validated prerendering, artifact and transfer checks, responsive Chrome interaction, fallback checks and Intel-backed performance sampling.
This commit is contained in:
@@ -113,8 +113,8 @@ export function createSign(
|
||||
const housingMaterial = resources.own(
|
||||
'material',
|
||||
new THREE.MeshStandardMaterial({
|
||||
color: 0x334956,
|
||||
emissive: 0x23404e,
|
||||
color: 0x654169,
|
||||
emissive: 0x512547,
|
||||
emissiveIntensity: 0.6,
|
||||
roughness: 0.28,
|
||||
metalness: 0.7,
|
||||
@@ -126,7 +126,7 @@ export function createSign(
|
||||
const backplateMaterial = resources.own(
|
||||
'material',
|
||||
new THREE.MeshStandardMaterial({
|
||||
color: 0x172e3c,
|
||||
color: 0x301f47,
|
||||
roughness: 0.72,
|
||||
metalness: 0.38,
|
||||
transparent: true,
|
||||
@@ -137,7 +137,7 @@ export function createSign(
|
||||
const facePanelMaterial = resources.own(
|
||||
'material',
|
||||
new THREE.MeshStandardMaterial({
|
||||
color: 0x061018,
|
||||
color: 0x11091d,
|
||||
roughness: 0.9,
|
||||
metalness: 0.12,
|
||||
transparent: true,
|
||||
@@ -148,8 +148,8 @@ export function createSign(
|
||||
const supportMaterial = resources.own(
|
||||
'material',
|
||||
new THREE.MeshStandardMaterial({
|
||||
color: 0x21343e,
|
||||
emissive: 0x163845,
|
||||
color: 0x3c2752,
|
||||
emissive: 0x38204e,
|
||||
emissiveIntensity: 0.4,
|
||||
roughness: 0.56,
|
||||
metalness: 0.68,
|
||||
@@ -161,8 +161,8 @@ export function createSign(
|
||||
const edgeMaterial = resources.own(
|
||||
'material',
|
||||
new THREE.MeshStandardMaterial({
|
||||
color: 0x39747a,
|
||||
emissive: 0x55b9c0,
|
||||
color: 0xa3488d,
|
||||
emissive: 0xff79c0,
|
||||
emissiveIntensity: 1.1,
|
||||
roughness: 0.42,
|
||||
metalness: 0.5,
|
||||
@@ -174,8 +174,8 @@ export function createSign(
|
||||
const routeMaterial = resources.own(
|
||||
'material',
|
||||
new THREE.MeshStandardMaterial({
|
||||
color: 0x8e6446,
|
||||
emissive: 0xb9723f,
|
||||
color: 0xbc744d,
|
||||
emissive: 0xffae6b,
|
||||
emissiveIntensity: 0.8,
|
||||
roughness: 0.48,
|
||||
metalness: 0.42,
|
||||
@@ -706,7 +706,7 @@ function drawLabel(
|
||||
context.imageSmoothingQuality = 'high';
|
||||
|
||||
context.globalAlpha = 0.16;
|
||||
context.fillStyle = '#8aa1a6';
|
||||
context.fillStyle = '#cfabcd';
|
||||
for (const [x, y, scratchWidth] of [
|
||||
[312, 84, 142],
|
||||
[742, 424, 96],
|
||||
@@ -717,25 +717,25 @@ function drawLabel(
|
||||
}
|
||||
|
||||
context.globalAlpha = 1;
|
||||
context.fillStyle = '#52bbc2';
|
||||
context.fillStyle = '#ff95cd';
|
||||
context.fillRect(82, 72, 10, 368);
|
||||
context.fillStyle = '#91a6a9';
|
||||
context.fillStyle = '#bbaae0';
|
||||
context.font = SIGN_MARKER_FONT;
|
||||
context.textAlign = 'left';
|
||||
context.textBaseline = 'middle';
|
||||
context.fillText(`ROUTE ${route.marker} / NEXT`, 142, 120);
|
||||
|
||||
context.globalAlpha = 0.6;
|
||||
context.fillStyle = '#2f4650';
|
||||
context.fillStyle = '#61416d';
|
||||
context.fillRect(142, 174, 1_610, 2);
|
||||
|
||||
context.globalAlpha = 1;
|
||||
context.fillStyle = '#e2f7f4';
|
||||
context.fillStyle = '#fff2df';
|
||||
const labelSize = fittedLabelSize(context, route.label, 1_520);
|
||||
context.font = `650 ${labelSize}px "Geist Variable", sans-serif`;
|
||||
context.fillText(route.label, 142, 326);
|
||||
|
||||
context.strokeStyle = '#cb9160';
|
||||
context.strokeStyle = '#ffb879';
|
||||
context.lineWidth = 10;
|
||||
context.lineCap = 'square';
|
||||
context.lineJoin = 'miter';
|
||||
|
||||
Reference in New Issue
Block a user