SamProject/sam-manage
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat:튜토리얼 영상 멀티스텝 개선 (8초 → 30초~2분)

Browse Source 
- ScreenAnalysisService: Gemini 프롬프트를 멀티스텝(3~5 steps) 출력으로 변경 + 하위 호환 fallback
- SlideAnnotationService: 스포트라이트 효과(annotateSlideWithSpotlight), 인트로/아웃트로 슬라이드 생성
- TutorialVideoJob: screen→steps 중첩 루프 + 인트로/아웃트로 씬 추가
- index.blade.php: 단계별 나레이션 편집 UI + 예상 시간 표시

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
김보곤
2026-02-15 16:36:56 +09:00
parent 973ab6c95b
commit 46f1577d65
4 changed files with 516 additions and 76 deletions
Download Patch File Download Diff File Expand all files Collapse all files

293
app/Services/Video/SlideAnnotationService.php
View File

@@ -227,6 +227,299 @@ private function drawStepBadge(\GdImage $canvas, int $stepNumber): void
}
}
/**
* 스포트라이트 효과가 적용된 슬라이드 생성
*
* 원본 이미지를 dim 처리한 후, focused_element 영역만 밝게 복원
*/
public function annotateSlideWithSpotlight(
string $imagePath,
?array $focusedElement,
int $stepNumber,
int $totalSteps,
string $caption,
string $outputPath
): ?string {
if (! file_exists($imagePath)) {
Log::error("SlideAnnotation: 원본 이미지 없음 - {$imagePath}");
return null;
}
try {
$dir = dirname($outputPath);
if (! is_dir($dir)) {
mkdir($dir, 0755, true);
}
$source = $this->loadImage($imagePath);
if (! $source) {
return null;
}
$srcW = imagesx($source);
$srcH = imagesy($source);
// 16:9 캔버스 생성
$canvas = imagecreatetruecolor(self::TARGET_WIDTH, self::TARGET_HEIGHT);
$black = imagecolorallocate($canvas, 0, 0, 0);
imagefill($canvas, 0, 0, $black);
// 캡션 영역 제외한 영역에 이미지 배치
$availH = self::TARGET_HEIGHT - self::CAPTION_HEIGHT;
$scale = min(self::TARGET_WIDTH / $srcW, $availH / $srcH);
$newW = (int) ($srcW * $scale);
$newH = (int) ($srcH * $scale);
$offsetX = (int) ((self::TARGET_WIDTH - $newW) / 2);
$offsetY = (int) (($availH - $newH) / 2);
// 원본 이미지 배치
imagecopyresampled($canvas, $source, $offsetX, $offsetY, 0, 0, $newW, $newH, $srcW, $srcH);
// 강한 dim 오버레이 (alpha 60 → 상당히 어둡게)
$dimOverlay = imagecolorallocatealpha($canvas, 0, 0, 0, 60);
imagefilledrectangle($canvas, $offsetX, $offsetY, $offsetX + $newW, $offsetY + $newH, $dimOverlay);
// 스포트라이트: focused_element 영역만 원본 밝기로 복원
if ($focusedElement) {
$fx = $focusedElement['x'] ?? 0.5;
$fy = $focusedElement['y'] ?? 0.5;
$fw = $focusedElement['w'] ?? 0.2;
$fh = $focusedElement['h'] ?? 0.15;
// 비율 → 원본 이미지 좌표
$srcFx = (int) ($fx * $srcW);
$srcFy = (int) ($fy * $srcH);
$srcFw = (int) ($fw * $srcW);
$srcFh = (int) ($fh * $srcH);
// 비율 → 캔버스 좌표
$canvasFx = $offsetX + (int) ($fx * $newW);
$canvasFy = $offsetY + (int) ($fy * $newH);
$canvasFw = (int) ($fw * $newW);
$canvasFh = (int) ($fh * $newH);
// 경계 보정
$canvasFw = min($canvasFw, self::TARGET_WIDTH - $canvasFx);
$canvasFh = min($canvasFh, $availH - $canvasFy + $offsetY);
// 원본 이미지에서 해당 영역을 다시 복사 (dim 위에 덮어씌움)
if ($canvasFw > 0 && $canvasFh > 0) {
imagecopyresampled(
$canvas, $source,
$canvasFx, $canvasFy,
$srcFx, $srcFy,
$canvasFw, $canvasFh,
$srcFw, $srcFh
);
// 빨간 테두리
$red = imagecolorallocate($canvas, 239, 68, 68);
$borderW = 3;
for ($b = 0; $b < $borderW; $b++) {
imagerectangle(
$canvas,
$canvasFx - $b, $canvasFy - $b,
$canvasFx + $canvasFw + $b, $canvasFy + $canvasFh + $b,
$red
);
}
// 번호 마커 (좌상단)
$this->drawNumberMarker($canvas, $stepNumber, $canvasFx - 5, $canvasFy - 5);
}
}
imagedestroy($source);
// 하단 캡션 바
$this->drawCaptionBar($canvas, $caption, $stepNumber);
// 상단 STEP 배지 (진행 표시)
$this->drawStepProgressBadge($canvas, $stepNumber, $totalSteps);
// PNG로 저장
imagepng($canvas, $outputPath, 6);
imagedestroy($canvas);
Log::info("SlideAnnotation: 스포트라이트 슬라이드 생성 완료", ['output' => $outputPath]);
return $outputPath;
} catch (\Exception $e) {
Log::error("SlideAnnotation: 스포트라이트 예외 발생", ['error' => $e->getMessage()]);
return null;
}
}
/**
* 인트로 슬라이드 생성
*/
public function createIntroSlide(string $title, string $outputPath): ?string
{
try {
$dir = dirname($outputPath);
if (! is_dir($dir)) {
mkdir($dir, 0755, true);
}
$canvas = imagecreatetruecolor(self::TARGET_WIDTH, self::TARGET_HEIGHT);
// 인디고 그라데이션 배경
$topColor = [49, 46, 129]; // indigo-900
$bottomColor = [79, 70, 229]; // indigo-600
for ($y = 0; $y < self::TARGET_HEIGHT; $y++) {
$ratio = $y / self::TARGET_HEIGHT;
$r = (int) ($topColor[0] + ($bottomColor[0] - $topColor[0]) * $ratio);
$g = (int) ($topColor[1] + ($bottomColor[1] - $topColor[1]) * $ratio);
$b = (int) ($topColor[2] + ($bottomColor[2] - $topColor[2]) * $ratio);
$color = imagecolorallocate($canvas, $r, $g, $b);
imageline($canvas, 0, $y, self::TARGET_WIDTH, $y, $color);
}
$white = imagecolorallocate($canvas, 255, 255, 255);
$lightWhite = imagecolorallocate($canvas, 200, 200, 220);
if (file_exists($this->fontPath)) {
// 타이틀
$titleSize = 42;
$bbox = imagettfbbox($titleSize, 0, $this->fontPath, $title);
$tw = $bbox[2] - $bbox[0];
$tx = (int) ((self::TARGET_WIDTH - $tw) / 2);
imagettftext($canvas, $titleSize, 0, $tx, 460, $white, $this->fontPath, $title);
// 서브타이틀
$sub = 'SAM 사용법을 안내합니다.';
$subSize = 24;
$bbox2 = imagettfbbox($subSize, 0, $this->fontPath, $sub);
$tw2 = $bbox2[2] - $bbox2[0];
$tx2 = (int) ((self::TARGET_WIDTH - $tw2) / 2);
imagettftext($canvas, $subSize, 0, $tx2, 530, $lightWhite, $this->fontPath, $sub);
// 구분선
$lineColor = imagecolorallocatealpha($canvas, 255, 255, 255, 80);
imagefilledrectangle($canvas, (self::TARGET_WIDTH / 2) - 60, 560, (self::TARGET_WIDTH / 2) + 60, 563, $lineColor);
} else {
imagestring($canvas, 5, self::TARGET_WIDTH / 2 - 100, 450, $title, $white);
}
imagepng($canvas, $outputPath, 6);
imagedestroy($canvas);
return $outputPath;
} catch (\Exception $e) {
Log::error("SlideAnnotation: 인트로 슬라이드 생성 실패", ['error' => $e->getMessage()]);
return null;
}
}
/**
* 아웃트로 슬라이드 생성
*/
public function createOutroSlide(string $title, string $outputPath): ?string
{
try {
$dir = dirname($outputPath);
if (! is_dir($dir)) {
mkdir($dir, 0755, true);
}
$canvas = imagecreatetruecolor(self::TARGET_WIDTH, self::TARGET_HEIGHT);
// 진한 그라데이션 배경
$topColor = [30, 27, 75]; // indigo-950
$bottomColor = [49, 46, 129]; // indigo-900
for ($y = 0; $y < self::TARGET_HEIGHT; $y++) {
$ratio = $y / self::TARGET_HEIGHT;
$r = (int) ($topColor[0] + ($bottomColor[0] - $topColor[0]) * $ratio);
$g = (int) ($topColor[1] + ($bottomColor[1] - $topColor[1]) * $ratio);
$b = (int) ($topColor[2] + ($bottomColor[2] - $topColor[2]) * $ratio);
$color = imagecolorallocate($canvas, $r, $g, $b);
imageline($canvas, 0, $y, self::TARGET_WIDTH, $y, $color);
}
$white = imagecolorallocate($canvas, 255, 255, 255);
$lightWhite = imagecolorallocate($canvas, 180, 180, 200);
if (file_exists($this->fontPath)) {
$mainText = '이상으로 안내를 마칩니다.';
$mainSize = 36;
$bbox = imagettfbbox($mainSize, 0, $this->fontPath, $mainText);
$tw = $bbox[2] - $bbox[0];
$tx = (int) ((self::TARGET_WIDTH - $tw) / 2);
imagettftext($canvas, $mainSize, 0, $tx, 470, $white, $this->fontPath, $mainText);
$subText = '감사합니다.';
$subSize = 24;
$bbox2 = imagettfbbox($subSize, 0, $this->fontPath, $subText);
$tw2 = $bbox2[2] - $bbox2[0];
$tx2 = (int) ((self::TARGET_WIDTH - $tw2) / 2);
imagettftext($canvas, $subSize, 0, $tx2, 530, $lightWhite, $this->fontPath, $subText);
} else {
imagestring($canvas, 5, self::TARGET_WIDTH / 2 - 100, 470, 'Thank you', $white);
}
imagepng($canvas, $outputPath, 6);
imagedestroy($canvas);
return $outputPath;
} catch (\Exception $e) {
Log::error("SlideAnnotation: 아웃트로 슬라이드 생성 실패", ['error' => $e->getMessage()]);
return null;
}
}
/**
* 번호 마커 그리기 (스포트라이트용)
*/
private function drawNumberMarker(\GdImage $canvas, int $number, int $cx, int $cy): void
{
$red = imagecolorallocate($canvas, 239, 68, 68);
$white = imagecolorallocate($canvas, 255, 255, 255);
$r = self::MARKER_RADIUS;
imagefilledellipse($canvas, $cx, $cy, $r * 2, $r * 2, $red);
imageellipse($canvas, $cx, $cy, $r * 2, $r * 2, $white);
$num = (string) $number;
$fontSize = 14;
if (file_exists($this->fontPath)) {
$bbox = imagettfbbox($fontSize, 0, $this->fontPath, $num);
$tw = $bbox[2] - $bbox[0];
$th = $bbox[1] - $bbox[7];
imagettftext($canvas, $fontSize, 0, $cx - (int) ($tw / 2), $cy + (int) ($th / 2), $white, $this->fontPath, $num);
} else {
imagestring($canvas, 5, $cx - 4, $cy - 7, $num, $white);
}
}
/**
* 상단 STEP 진행 배지 (STEP 1/5 형식)
*/
private function drawStepProgressBadge(\GdImage $canvas, int $stepNumber, int $totalSteps): void
{
$badgeBg = imagecolorallocate($canvas, 79, 70, 229);
$white = imagecolorallocate($canvas, 255, 255, 255);
$bx = 30;
$by = 20;
$bw = 170;
$bh = 44;
imagefilledrectangle($canvas, $bx, $by, $bx + $bw, $by + $bh, $badgeBg);
$text = "STEP {$stepNumber}/{$totalSteps}";
if (file_exists($this->fontPath)) {
$fontSize = 18;
$bbox = imagettfbbox($fontSize, 0, $this->fontPath, $text);
$tw = $bbox[2] - $bbox[0];
$tx = $bx + (int) (($bw - $tw) / 2);
imagettftext($canvas, $fontSize, 0, $tx, $by + 32, $white, $this->fontPath, $text);
} else {
imagestring($canvas, 5, $bx + 20, $by + 12, $text, $white);
}
}
/**
* 이미지 로드 (형식 자동 감지)
*/