refactor: Figma 디자인에 맞춰 애니메이션 및 캐릭터 배치 업데이트 (#124)

- ResultGeneratingIllustration 젓가락 애니메이션을 대칭으로 수정
- PeopleGroup의 1~10명 캐릭터 위치를 Figma 디자인과 동일하게 업데이트
- 불규칙하고 자연스러운 배치로 개선

Co-authored-by: Claude Sonnet 4.5 <noreply@anthropic.com>

Author: RookieAND

src/components/illustrations/ResultGeneratingIllustration.tsx

@@ -46,9 +46,9 @@ export const ResultGeneratingIllustration = () => {
 
 				{/* Left Chopstick */}
 				<motion.g
-					style={{ originX: "162px", originY: "186px" }}
+					style={{ originX: "162px", originY: "137px" }}
 					animate={{
-						rotate: [0, -18, 0],
+						rotate: [0, -3.52, 0],
 					}}
 					transition={{
 						duration: 0.4,
@@ -68,9 +68,9 @@ export const ResultGeneratingIllustration = () => {
 
 				{/* Right Chopstick */}
 				<motion.g
-					style={{ originX: "219px", originY: "202px" }}
+					style={{ originX: "211px", originY: "158px" }}
 					animate={{
-						rotate: [0, 18, 0],
+						rotate: [0, 3.52, 0],
 					}}
 					transition={{
 						duration: 0.4,

src/pageComponents/gathering/create/PeopleGroup.tsx

@@ -16,88 +16,89 @@ export interface Position {
 }
 
 // NOTE: 유효 범위 고려 - x: 42~333, y: 45~135 (캐릭터 중심 기준)
+// Figma 디자인 기준으로 업데이트됨 (top: 421px 기준, 상대 좌표로 변환)
 export const PEOPLE_POSITIONS: Record<number, Position[]> = {
-	1: [{ x: 187.5, y: 70 }],
+	1: [{ x: 187.5, y: 90 }],
 
 	2: [
-		{ x: 145, y: 70 },
-		{ x: 230, y: 70 },
+		{ x: 127.5, y: 90 },
+		{ x: 247.5, y: 90 },
 	],
 
 	3: [
-		{ x: 145, y: 55 },
-		{ x: 230, y: 55 },
-		{ x: 187.5, y: 85 },
+		{ x: 102.5, y: 70 },
+		{ x: 187.5, y: 70 },
+		{ x: 272.5, y: 70 },
 	],
 
 	4: [
-		{ x: 152.5, y: 55 },
-		{ x: 222.5, y: 55 },
-		{ x: 112.5, y: 85 },
-		{ x: 262.5, y: 85 },
+		{ x: 256, y: 54 },
+		{ x: 114, y: 63 },
+		{ x: 225, y: 117 },
+		{ x: 151, y: 118 },
 	],
 
 	5: [
-		{ x: 145, y: 50 },
-		{ x: 230, y: 50 },
-		{ x: 115, y: 80 },
-		{ x: 187.5, y: 80 },
-		{ x: 260, y: 80 },
+		{ x: 192, y: 48 },
+		{ x: 252, y: 56 },
+		{ x: 114, y: 63 },
+		{ x: 225, y: 119 },
+		{ x: 151, y: 119 },
 	],
 
 	6: [
-		{ x: 127.5, y: 50 },
-		{ x: 187.5, y: 50 },
-		{ x: 247.5, y: 50 },
-		{ x: 97.5, y: 85 },
-		{ x: 187.5, y: 85 },
-		{ x: 277.5, y: 85 },
+		{ x: 108, y: 28 },
+		{ x: 180, y: 52 },
+		{ x: 265, y: 22 },
+		{ x: 78, y: 98 },
+		{ x: 195, y: 118 },
+		{ x: 285, y: 95 },
 	],
 
 	7: [
-		{ x: 122.5, y: 50 },
-		{ x: 187.5, y: 50 },
-		{ x: 252.5, y: 50 },
-		{ x: 67.5, y: 85 },
-		{ x: 147.5, y: 85 },
-		{ x: 227.5, y: 85 },
-		{ x: 307.5, y: 85 },
+		{ x: 187.5, y: 25 },
+		{ x: 275, y: 40 },
+		{ x: 100, y: 33 },
+		{ x: 125, y: 110 },
+		{ x: 200, y: 75 },
+		{ x: 245, y: 115 },
+		{ x: 210, y: 135 },
 	],
 
 	8: [
-		{ x: 95, y: 50 },
-		{ x: 160, y: 50 },
-		{ x: 215, y: 50 },
-		{ x: 280, y: 50 },
-		{ x: 55, y: 85 },
-		{ x: 150, y: 85 },
-		{ x: 225, y: 85 },
-		{ x: 320, y: 85 },
+		{ x: 85, y: 48 },
+		{ x: 165, y: 25 },
+		{ x: 245, y: 68 },
+		{ x: 305, y: 35 },
+		{ x: 50, y: 105 },
+		{ x: 135, y: 120 },
+		{ x: 215, y: 88 },
+		{ x: 285, y: 110 },
 	],
 
 	9: [
-		{ x: 122.5, y: 48 },
-		{ x: 187.5, y: 48 },
-		{ x: 252.5, y: 48 },
-		{ x: 90, y: 73 },
-		{ x: 187.5, y: 73 },
-		{ x: 285, y: 73 },
-		{ x: 42, y: 98 },
-		{ x: 187.5, y: 98 },
-		{ x: 333, y: 98 },
+		{ x: 160, y: 35 },
+		{ x: 240, y: 52 },
+		{ x: 300, y: 50 },
+		{ x: 105, y: 45 },
+		{ x: 50, y: 110 },
+		{ x: 180, y: 130 },
+		{ x: 100, y: 145 },
+		{ x: 230, y: 142 },
+		{ x: 310, y: 132 },
 	],
 
 	10: [
-		{ x: 132.5, y: 45 },
-		{ x: 187.5, y: 45 },
-		{ x: 242.5, y: 45 },
-		{ x: 105, y: 70 },
-		{ x: 187.5, y: 70 },
-		{ x: 270, y: 70 },
-		{ x: 42, y: 95 },
-		{ x: 139, y: 95 },
-		{ x: 236, y: 95 },
-		{ x: 333, y: 95 },
+		{ x: 160, y: 35 },
+		{ x: 245, y: 55 },
+		{ x: 65, y: 25 },
+		{ x: 310, y: 30 },
+		{ x: 120, y: 95 },
+		{ x: 210, y: 130 },
+		{ x: 55, y: 80 },
+		{ x: 145, y: 145 },
+		{ x: 290, y: 105 },
+		{ x: 240, y: 150 },
 	],
 };