diff --git a/voicevox-remotion-template/public/image/zundamon-standee-base.png b/voicevox-remotion-template/public/image/zundamon-standee-base.png new file mode 100644 index 0000000..9e7d6c7 --- /dev/null +++ b/voicevox-remotion-template/public/image/zundamon-standee-base.png Binary files differ diff --git a/voicevox-remotion-template/src/data/script.ts b/voicevox-remotion-template/src/data/script.ts index 473cc59..36e846c 100644 --- a/voicevox-remotion-template/src/data/script.ts +++ b/voicevox-remotion-template/src/data/script.ts @@ -11,6 +11,7 @@ width?: number; maxHeight?: number; translateY?: number; + flipX?: boolean; }>; nameplatePosition?: "top" | "bottom"; }>; @@ -31,6 +32,14 @@ avatar: { kind: "zundamon", accentColor: "#79d36f", + imagePath: "image/zundamon-standee-base.png", + imageLayout: { + width: 560, + maxHeight: 760, + translateY: -87, + flipX: true, + }, + nameplatePosition: "top", }, }, sayo: { diff --git a/voicevox-remotion-template/src/yukkuri-composition.tsx b/voicevox-remotion-template/src/yukkuri-composition.tsx index e76c06e..a6ba7d5 100644 --- a/voicevox-remotion-template/src/yukkuri-composition.tsx +++ b/voicevox-remotion-template/src/yukkuri-composition.tsx @@ -386,10 +386,12 @@ > = ({characterId, focused, hasMultipleCharacters, bounce}) => { const character = characters[characterId]; const {avatar}: {avatar: AvatarDefinition} = character; - const scale = focused ? 1.05 : hasMultipleCharacters ? 0.88 : 1; + const scale = hasMultipleCharacters ? 0.88 : focused ? 1.05 : 1; const opacity = focused || !hasMultipleCharacters ? 1 : 0.72; const translateY = focused ? bounce : bounce * 0.35; const imageTranslateY = avatar.imageLayout?.translateY ?? 0; + const imageScaleX = avatar.imageLayout?.flipX ? -1 : 1; + const imageTransform = `translateY(${imageTranslateY}px) scaleX(${imageScaleX})`; const nameplatePosition = avatar.nameplatePosition ?? "bottom"; const nameplate = ( @@ -429,15 +431,15 @@ maxHeight: avatar.imageLayout?.maxHeight ?? 360, objectFit: "contain", filter: "drop-shadow(0 18px 40px rgba(31, 42, 68, 0.22))", - transform: `translateY(${imageTranslateY}px)`, + transform: imageTransform, }} /> ) : avatar.kind === "sayo" ? ( -