mingle/mingle-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add: 다국어(i18n) 시스템 구축 (ko/en/zh/ja)

Browse Source 
- i18n 엔진 구현 (js/i18n.js): 언어 감지, JSON 로드, DOM 번역, 한국어 복원 지원
- 번역 JSON 파일 생성 (i18n/ko.json, en.json, zh.json, ja.json) - 517키 동기화
- 전체 HTML 페이지 data-i18n 태깅 (8개 페이지 + header/footer 컴포넌트)
- 언어 스위처 UI 및 CSS 추가 (header + common.css)
- JS 동적 문자열 번역 적용 (common/contact/gallery/main/portfolio.js)
- 한국어 복원 버그 수정: 원본 텍스트를 data-i18n-ko 속성에 저장하여 복원
- 일본어 브랜드명 통일: ミングルスタジオ → Mingle Studio

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
68893236+KINDNICK@users.noreply.github.com 2026-03-01 12:35:24 +09:00
parent 841c0a1992
commit c2c2376fc5
21 changed files with 3949 additions and 562 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
404.html
View File

@ -204,35 +204,36 @@
<div class="error-container">
<div class="error-code">404</div>
<h1 class="error-title">페이지를 찾을 수 없습니다</h1>
<p class="error-description">
<h1 class="error-title" data-i18n="error404.title">페이지를 찾을 수 없습니다</h1>
<p class="error-description" data-i18n-html="error404.desc">
죄송합니다. 요청하신 페이지가 존재하지 않거나 이동되었을 수 있습니다.<br>
아래 링크를 통해 원하시는 정보를 찾아보세요.
</p>
<div class="error-actions">
<a href="index.html" class="btn btn-primary btn-lg"><i class="fa-solid fa-house" aria-hidden="true"></i> 홈으로 돌아가기</a>
<a href="contact.html" class="btn btn-outline btn-lg"><i class="fa-solid fa-phone" aria-hidden="true"></i> 문의하기</a>
<a href="index.html" class="btn btn-primary btn-lg"><i class="fa-solid fa-house" aria-hidden="true"></i> <span data-i18n="error404.btnHome">홈으로 돌아가기</span></a>
<a href="contact.html" class="btn btn-outline btn-lg"><i class="fa-solid fa-phone" aria-hidden="true"></i> <span data-i18n="error404.btnContact">문의하기</span></a>
</div>
<div class="search-container">
<label for="errorSearch" class="sr-only">검색</label>
<input type="text" class="search-input" placeholder="원하는 내용을 검색해보세요..." id="errorSearch">
<input type="text" class="search-input" placeholder="원하는 내용을 검색해보세요..." id="errorSearch" data-i18n-placeholder="error404.searchPlaceholder">
</div>
<div class="helpful-links">
<h3>도움이 될 수 있는 페이지</h3>
<h3 data-i18n="error404.helpfulLinks">도움이 될 수 있는 페이지</h3>
<ul>
<li><a href="about.html"><i class="fa-solid fa-building" aria-hidden="true"></i> 회사 소개</a></li>
<li><a href="services.html"><i class="fa-solid fa-clapperboard" aria-hidden="true"></i> 서비스 안내</a></li>
<li><a href="portfolio.html"><i class="fa-solid fa-bullseye" aria-hidden="true"></i> 포트폴리오</a></li>
<li><a href="gallery.html"><i class="fa-solid fa-images" aria-hidden="true"></i> 스튜디오 갤러리</a></li>
<li><a href="qna.html"><i class="fa-solid fa-circle-question" aria-hidden="true"></i> 자주하는 질문</a></li>
<li><a href="contact.html"><i class="fa-solid fa-envelope" aria-hidden="true"></i> 연락처 및 위치</a></li>
<li><a href="about.html"><i class="fa-solid fa-building" aria-hidden="true"></i> <span data-i18n="error404.linkAbout">회사 소개</span></a></li>
<li><a href="services.html"><i class="fa-solid fa-clapperboard" aria-hidden="true"></i> <span data-i18n="error404.linkServices">서비스 안내</span></a></li>
<li><a href="portfolio.html"><i class="fa-solid fa-bullseye" aria-hidden="true"></i> <span data-i18n="error404.linkPortfolio">포트폴리오</span></a></li>
<li><a href="gallery.html"><i class="fa-solid fa-images" aria-hidden="true"></i> <span data-i18n="error404.linkGallery">스튜디오 갤러리</span></a></li>
<li><a href="qna.html"><i class="fa-solid fa-circle-question" aria-hidden="true"></i> <span data-i18n="error404.linkQna">자주하는 질문</span></a></li>
<li><a href="contact.html"><i class="fa-solid fa-envelope" aria-hidden="true"></i> <span data-i18n="error404.linkContact">연락처 및 위치</span></a></li>
</ul>
</div>
</div>
<script src="js/i18n.js"></script>
<script src="js/common.js"></script>
<script>
// 검색 기능

101
about.html
View File

@ -70,7 +70,7 @@
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-PPTNN6WD"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
<a href="#main-content" class="skip-to-content">본문 바로가기</a>
<a href="#main-content" class="skip-to-content" data-i18n="common.skipToContent">본문 바로가기</a>
<!-- 헤더 -->
<div id="header-placeholder"></div>
@ -82,8 +82,8 @@
<img src="/images/studio/넓은 모션 캡쳐 공간 002.webp" alt="" loading="eager">
</div>
<div class="container">
<h1>About Us</h1>
<p>기술과 창의력, 열정이 한데 섞여 새로운 가치가 만들어지는 공간</p>
<h1 data-i18n="about.pageHeader.title">About Us</h1>
<p data-i18n="about.pageHeader.desc">기술과 창의력, 열정이 한데 섞여 새로운 가치가 만들어지는 공간</p>
</div>
</section>
@ -93,60 +93,60 @@
<div class="company-info">
<div class="info-grid reveal">
<div class="info-item">
<h3>회사명</h3>
<p>밍글 스튜디오 (Mingle Studio)</p>
<h3 data-i18n="about.info.companyName">회사명</h3>
<p data-i18n="about.info.companyNameValue">밍글 스튜디오 (Mingle Studio)</p>
</div>
<div class="info-item">
<h3>설립일</h3>
<p>2025년 7월 15일</p>
<h3 data-i18n="about.info.foundingDate">설립일</h3>
<p data-i18n="about.info.foundingDateValue">2025년 7월 15일</p>
</div>
<div class="info-item">
<h3>슬로건</h3>
<p>"모두가 어우러진 즐거운 창작공간"</p>
<h3 data-i18n="about.info.slogan">슬로건</h3>
<p data-i18n="about.info.sloganValue">"모두가 어우러진 즐거운 창작공간"</p>
</div>
<div class="info-item full-width">
<h3>의미</h3>
<p>Mingle Studio는 기술자와 크리에이터 그리고 시청자가 함께 어우러지는 버추얼 콘텐츠 제작 공간입니다. 최첨단 광학식 모션캡처 기술로 버추얼 캐릭터의 살아 숨쉬는 감정과 움직임을 담아 새로운 세대의 디지털 퍼포먼스를 실현합니다.</p>
<h3 data-i18n="about.info.meaning">의미</h3>
<p data-i18n="about.info.meaningValue">Mingle Studio는 기술자와 크리에이터 그리고 시청자가 함께 어우러지는 버추얼 콘텐츠 제작 공간입니다. 최첨단 광학식 모션캡처 기술로 버추얼 캐릭터의 살아 숨쉬는 감정과 움직임을 담아 새로운 세대의 디지털 퍼포먼스를 실현합니다.</p>
</div>
</div>
</div>
<div class="about-content stagger-children">
<div class="card card--flat reveal" data-reveal="fade">
<h2>회사 소개</h2>
<p>밍글 스튜디오는 창작자와 기술, 사람과 사람 사이의 '어우러짐'을 통해 새로운 콘텐츠를 만들어가는 모션 캡쳐 기반의 창작 공간입니다.</p>
<p>설립 이후, 누구나 편하게 사용 가능한 스튜디오 대관 서비스를 중심으로 버추얼 콘텐츠 제작 환경을 제공합니다.</p>
<h2 data-i18n="about.companyIntro.title">회사 소개</h2>
<p data-i18n="about.companyIntro.desc1">밍글 스튜디오는 창작자와 기술, 사람과 사람 사이의 '어우러짐'을 통해 새로운 콘텐츠를 만들어가는 모션 캡쳐 기반의 창작 공간입니다.</p>
<p data-i18n="about.companyIntro.desc2">설립 이후, 누구나 편하게 사용 가능한 스튜디오 대관 서비스를 중심으로 버추얼 콘텐츠 제작 환경을 제공합니다.</p>
</div>
<div class="card card--flat reveal" data-reveal="fade">
<h2>비전 & 미션</h2>
<h2 data-i18n="about.visionMission.title">비전 & 미션</h2>
<div class="vision-mission">
<div class="vm-item">
<h3><i class="fa-solid fa-bullseye" aria-hidden="true"></i> 비전</h3>
<p>모든 창작자가 기술적 제약 없이 상상을 현실로 만들 수 있는 창작 생태계 구축</p>
<h3><i class="fa-solid fa-bullseye" aria-hidden="true"></i> <span data-i18n="about.visionMission.visionTitle">비전</span></h3>
<p data-i18n="about.visionMission.visionDesc">모든 창작자가 기술적 제약 없이 상상을 현실로 만들 수 있는 창작 생태계 구축</p>
</div>
<div class="vm-item">
<h3><i class="fa-solid fa-rocket" aria-hidden="true"></i> 미션</h3>
<p>최첨단 모션캡쳐 기술을 통해 창작자들의 아이디어를 생생한 콘텐츠로 변환하고, 새로운 디지털 경험을 제공</p>
<h3><i class="fa-solid fa-rocket" aria-hidden="true"></i> <span data-i18n="about.visionMission.missionTitle">미션</span></h3>
<p data-i18n="about.visionMission.missionDesc">최첨단 모션캡쳐 기술을 통해 창작자들의 아이디어를 생생한 콘텐츠로 변환하고, 새로운 디지털 경험을 제공</p>
</div>
</div>
</div>
<div class="card card--flat reveal" data-reveal="fade">
<h2>연혁</h2>
<h2 data-i18n="about.history.title">연혁</h2>
<div class="timeline">
<div class="timeline-item">
<div class="timeline-date">2025년 7월 15일</div>
<div class="timeline-date" data-i18n="about.history.date1">2025년 7월 15일</div>
<div class="timeline-content">
<h4>밍글 스튜디오 설립</h4>
<p>밍글 스튜디오 회사 설립</p>
<h4 data-i18n="about.history.event1Title">밍글 스튜디오 설립</h4>
<p data-i18n="about.history.event1Desc">밍글 스튜디오 회사 설립</p>
</div>
</div>
<div class="timeline-item">
<div class="timeline-date">2025년 8월 1일</div>
<div class="timeline-date" data-i18n="about.history.date2">2025년 8월 1일</div>
<div class="timeline-content">
<h4>스튜디오 오픈</h4>
<p>OptiTrack 시스템 구축 완료 및 대관 서비스 시작</p>
<h4 data-i18n="about.history.event2Title">스튜디오 오픈</h4>
<p data-i18n="about.history.event2Desc">OptiTrack 시스템 구축 완료 및 대관 서비스 시작</p>
</div>
</div>
</div>
@ -159,8 +159,8 @@
<section class="team-section section bg-light">
<div class="container">
<div class="section-header">
<h2>Our Team</h2>
<p>각 분야의 전문가들이 함께 협업하며 콘텐츠 제작을 지원합니다</p>
<h2 data-i18n="about.team.title">Our Team</h2>
<p data-i18n="about.team.desc">각 분야의 전문가들이 함께 협업하며 콘텐츠 제작을 지원합니다</p>
</div>
<div class="team-grid stagger-children">
@ -168,30 +168,30 @@
<div class="team-avatar">
<img src="/images/profile/제이제이.png" alt="김희진 프로필">
</div>
<h3>김희진</h3>
<h3 data-i18n="about.team.member1Name">김희진</h3>
<p class="team-nickname">JAYJAY</p>
<p class="team-role">대표 / 3D 아티스트</p>
<p class="team-desc">배경/리소스 제작, 인사 및 프로젝트 관리</p>
<p class="team-role" data-i18n="about.team.member1Role">대표 / 3D 아티스트</p>
<p class="team-desc" data-i18n="about.team.member1Desc">배경/리소스 제작, 인사 및 프로젝트 관리</p>
</div>
<div class="team-card reveal" data-reveal="zoom">
<div class="team-avatar">
<img src="/images/profile/카닉.png" alt="김광진 프로필">
</div>
<h3>김광진</h3>
<h3 data-i18n="about.team.member2Name">김광진</h3>
<p class="team-nickname">KINDNICK</p>
<p class="team-role">CTO / 테크니컬 디렉터</p>
<p class="team-desc">스튜디오 전체 기술 운영, 모션캡쳐 장비 관리, 음향 시스템, 엔진 프로그래밍</p>
<p class="team-role" data-i18n="about.team.member2Role">CTO / 테크니컬 디렉터</p>
<p class="team-desc" data-i18n="about.team.member2Desc">스튜디오 전체 기술 운영, 모션캡쳐 장비 관리, 음향 시스템, 엔진 프로그래밍</p>
</div>
<div class="team-card reveal" data-reveal="zoom">
<div class="team-avatar">
<img src="/images/profile/야모.png" alt="이승민 프로필">
</div>
<h3>이승민</h3>
<h3 data-i18n="about.team.member3Name">이승민</h3>
<p class="team-nickname">YAMO</p>
<p class="team-role">CCO / 콘텐츠 디렉터</p>
<p class="team-desc">캡쳐 디렉팅, 배우 모션 클린업, 카메라 무빙, 퍼포먼스 연출</p>
<p class="team-role" data-i18n="about.team.member3Role">CCO / 콘텐츠 디렉터</p>
<p class="team-desc" data-i18n="about.team.member3Desc">캡쳐 디렉팅, 배우 모션 클린업, 카메라 무빙, 퍼포먼스 연출</p>
</div>
</div>
</div>
@ -201,8 +201,8 @@
<section class="partner-streamer-section section">
<div class="container">
<div class="section-header">
<h2>Partner Streamer</h2>
<p>밍글 스튜디오와 함께 콘텐츠를 만드는 크리에이터</p>
<h2 data-i18n="about.partner.title">Partner Streamer</h2>
<p data-i18n="about.partner.desc">밍글 스튜디오와 함께 콘텐츠를 만드는 크리에이터</p>
</div>
<div class="streamer-grid stagger-children">
@ -212,7 +212,7 @@
</div>
<h3>구슬요</h3>
<p class="streamer-handle">@beadyo97</p>
<p class="streamer-desc">소통, 노래, 게임, VRChat 등 다채로운 콘텐츠를 선보이는 버츄얼 스트리머. SOOP을 중심으로 활발하게 활동하며 밍글 스튜디오의 모션캡처 기술과 함께 새로운 버츄얼 콘텐츠를 만들어갑니다.</p>
<p class="streamer-desc" data-i18n="about.partner.streamer1Desc">소통, 노래, 게임, VRChat 등 다채로운 콘텐츠를 선보이는 버츄얼 스트리머. SOOP을 중심으로 활발하게 활동하며 밍글 스튜디오의 모션캡처 기술과 함께 새로운 버츄얼 콘텐츠를 만들어갑니다.</p>
<div class="streamer-tags">
<span class="streamer-tag">VTuber</span>
<span class="streamer-tag">노래</span>
@ -235,30 +235,30 @@
<section class="values-section section">
<div class="container">
<div class="section-header">
<h2>Core Values</h2>
<p>밍글 스튜디오가 추구하는 핵심 가치</p>
<h2 data-i18n="about.values.title">Core Values</h2>
<p data-i18n="about.values.desc">밍글 스튜디오가 추구하는 핵심 가치</p>
</div>
<div class="values-grid stagger-children">
<div class="value-item reveal" data-reveal="up">
<div class="value-icon"><i class="fa-solid fa-handshake" aria-hidden="true"></i></div>
<h3>협업</h3>
<p>기술자와 창작자가 함께 만드는 시너지</p>
<h3 data-i18n="about.values.collaboration">협업</h3>
<p data-i18n="about.values.collaborationDesc">기술자와 창작자가 함께 만드는 시너지</p>
</div>
<div class="value-item reveal" data-reveal="up">
<div class="value-icon"><i class="fa-solid fa-lightbulb" aria-hidden="true"></i></div>
<h3>혁신</h3>
<p>최신 기술로 새로운 창작의 가능성 제시</p>
<h3 data-i18n="about.values.innovation">혁신</h3>
<p data-i18n="about.values.innovationDesc">최신 기술로 새로운 창작의 가능성 제시</p>
</div>
<div class="value-item reveal" data-reveal="up">
<div class="value-icon"><i class="fa-solid fa-palette" aria-hidden="true"></i></div>
<h3>창의성</h3>
<p>상상을 현실로 만드는 창의적 솔루션</p>
<h3 data-i18n="about.values.creativity">창의성</h3>
<p data-i18n="about.values.creativityDesc">상상을 현실로 만드는 창의적 솔루션</p>
</div>
<div class="value-item reveal" data-reveal="up">
<div class="value-icon"><i class="fa-solid fa-star" aria-hidden="true"></i></div>
<h3>품질</h3>
<p>최고 수준의 모션캡쳐 퀄리티 추구</p>
<h3 data-i18n="about.values.quality">품질</h3>
<p data-i18n="about.values.qualityDesc">최고 수준의 모션캡쳐 퀄리티 추구</p>
</div>
</div>
</div>
@ -304,6 +304,7 @@
</footer>
<!-- JavaScript -->
<script src="js/i18n.js"></script>
<script src="js/common.js"></script>
</body>
</html>

22
components/footer.html
View File

@ -3,31 +3,31 @@
<div class="container">
<div class="footer-grid">
<div class="footer-section">
<h3 class="footer-heading">회사 정보</h3>
<h3 class="footer-heading" data-i18n="footer.companyInfo">회사 정보</h3>
<ul class="footer-list">
<li><strong>밍글 스튜디오</strong></li>
<li>대표: 김희진</li>
<li>사업자등록번호: 208-12-73755</li>
<li><strong data-i18n="footer.companyName">밍글 스튜디오</strong></li>
<li data-i18n="footer.ceo">대표: 김희진</li>
<li data-i18n="footer.businessNumber">사업자등록번호: 208-12-73755</li>
</ul>
</div>
<div class="footer-section">
<h3 class="footer-heading">연락처</h3>
<h3 class="footer-heading" data-i18n="footer.contact">연락처</h3>
<ul class="footer-list">
<li><a href="tel:+82-10-9288-9190"><i class="fa-solid fa-phone" aria-hidden="true"></i> 010-9288-9190</a></li>
<li><a href="mailto:minglestudio@minglestudio.co.kr"><i class="fa-solid fa-briefcase" aria-hidden="true"></i> 비즈니스 문의</a></li>
<li><a href="mailto:help@minglestudio.co.kr"><i class="fa-solid fa-envelope" aria-hidden="true"></i> 예약 문의</a></li>
<li><a href="mailto:minglestudio@minglestudio.co.kr"><i class="fa-solid fa-briefcase" aria-hidden="true"></i> <span data-i18n="footer.businessInquiry">비즈니스 문의</span></a></li>
<li><a href="mailto:help@minglestudio.co.kr"><i class="fa-solid fa-envelope" aria-hidden="true"></i> <span data-i18n="footer.reservationInquiry">예약 문의</span></a></li>
</ul>
</div>
<div class="footer-section">
<h3 class="footer-heading">오시는 길</h3>
<h3 class="footer-heading" data-i18n="footer.directions">오시는 길</h3>
<ul class="footer-list">
<li><i class="fa-solid fa-location-dot" aria-hidden="true"></i> 인천광역시 부평구 주부토로 236</li>
<li>인천테크노밸리 U1센터 A동 B105호</li>
<li><i class="fa-solid fa-location-dot" aria-hidden="true"></i> <span data-i18n="footer.address">인천광역시 부평구 주부토로 236</span></li>
<li data-i18n="footer.addressDetail">인천테크노밸리 U1센터 A동 B105호</li>
</ul>
</div>
</div>
<div class="footer-bottom">
<p>&copy; 2025 밍글 스튜디오. All rights reserved.</p>
<p data-i18n="footer.copyright">&copy; 2025 밍글 스튜디오. All rights reserved.</p>
</div>
</div>
</footer>

64
components/header.html
View File

@ -4,36 +4,52 @@
<div class="nav-logo">
<a href="/">
<img src="/images/logo/mingle-logo.webp" alt="밍글 스튜디오 로고">
<span>밍글 스튜디오</span>
<span data-i18n="header.studioName">밍글 스튜디오</span>
</a>
</div>
<ul id="nav-menu" class="nav-menu">
<li><a href="/about" class="nav-link">About</a></li>
<li><a href="/services" class="nav-link">Services</a></li>
<li><a href="/portfolio" class="nav-link">Portfolio</a></li>
<li><a href="/gallery" class="nav-link">Gallery</a></li>
<li><a href="/about" class="nav-link" data-i18n="header.nav.about">About</a></li>
<li><a href="/services" class="nav-link" data-i18n="header.nav.services">Services</a></li>
<li><a href="/portfolio" class="nav-link" data-i18n="header.nav.portfolio">Portfolio</a></li>
<li><a href="/gallery" class="nav-link" data-i18n="header.nav.gallery">Gallery</a></li>
<li><a href="/contact" class="nav-link">Contact</a></li>
<li><a href="/qna" class="nav-link">Q&A</a></li>
<li><a href="/contact" class="nav-link" data-i18n="header.nav.contact">Contact</a></li>
<li><a href="/qna" class="nav-link" data-i18n="header.nav.qna">Q&A</a></li>
</ul>
<button class="theme-toggle" id="themeToggle" aria-label="다크 모드 전환" title="다크/라이트 모드 전환">
<div class="theme-toggle-thumb">
<svg class="theme-toggle-icon theme-toggle-icon--sun" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<circle cx="12" cy="12" r="5"></circle>
<line x1="12" y1="1" x2="12" y2="3"></line>
<line x1="12" y1="21" x2="12" y2="23"></line>
<line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line>
<line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line>
<line x1="1" y1="12" x2="3" y2="12"></line>
<line x1="21" y1="12" x2="23" y2="12"></line>
<line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line>
<line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line>
</svg>
<svg class="theme-toggle-icon theme-toggle-icon--moon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path>
</svg>
<div class="nav-actions">
<div class="lang-switcher">
<button class="lang-btn" aria-label="언어 선택" data-i18n-aria="header.langSelect">
<span class="lang-current">KO</span>
<svg class="lang-chevron" viewBox="0 0 10 6" width="10" height="6" aria-hidden="true">
<path d="M1 1l4 4 4-4" stroke="currentColor" stroke-width="1.5" fill="none" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</button>
<ul class="lang-dropdown">
<li><button data-lang="ko">🇰🇷 한국어</button></li>
<li><button data-lang="en">🇺🇸 English</button></li>
<li><button data-lang="zh">🇨🇳 中文</button></li>
<li><button data-lang="ja">🇯🇵 日本語</button></li>
</ul>
</div>
</button>
<button class="theme-toggle" id="themeToggle" aria-label="다크 모드 전환" title="다크/라이트 모드 전환">
<div class="theme-toggle-thumb">
<svg class="theme-toggle-icon theme-toggle-icon--sun" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<circle cx="12" cy="12" r="5"></circle>
<line x1="12" y1="1" x2="12" y2="3"></line>
<line x1="12" y1="21" x2="12" y2="23"></line>
<line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line>
<line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line>
<line x1="1" y1="12" x2="3" y2="12"></line>
<line x1="21" y1="12" x2="23" y2="12"></line>
<line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line>
<line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line>
</svg>
<svg class="theme-toggle-icon theme-toggle-icon--moon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path>
</svg>
</div>
</button>
</div>
<button class="hamburger" aria-label="메뉴 열기" aria-expanded="false" aria-controls="nav-menu">
<span></span>
<span></span>

63
contact.html
View File

@ -70,7 +70,7 @@
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-PPTNN6WD"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
<a href="#main-content" class="skip-to-content">본문 바로가기</a>
<a href="#main-content" class="skip-to-content" data-i18n="common.skipToContent">본문 바로가기</a>
<!-- 헤더 -->
<div id="header-placeholder"></div>
@ -79,8 +79,8 @@
<!-- 페이지 헤더 -->
<section class="page-header">
<div class="container">
<h1>Contact Us</h1>
<p>밍글 스튜디오와 함께 특별한 프로젝트를 시작하세요</p>
<h1 data-i18n="contact.pageHeader.title">Contact Us</h1>
<p data-i18n="contact.pageHeader.desc">밍글 스튜디오와 함께 특별한 프로젝트를 시작하세요</p>
</div>
</section>
@ -90,30 +90,30 @@
<div class="contact-info-grid stagger-children">
<div class="contact-card reveal" data-reveal="up">
<div class="contact-icon"><i class="fa-solid fa-phone" aria-hidden="true"></i></div>
<h3>전화 문의</h3>
<p>24시간 가능</p>
<h3 data-i18n="contact.phone.title">전화 문의</h3>
<p data-i18n="contact.phone.desc">24시간 가능</p>
<a href="tel:+82-10-9288-9190" class="contact-link">010-9288-9190</a>
</div>
<div class="contact-card reveal" data-reveal="up">
<div class="contact-icon"><i class="fa-solid fa-briefcase" aria-hidden="true"></i></div>
<h3>비즈니스 문의</h3>
<p>제휴 및 협력 문의</p>
<h3 data-i18n="contact.business.title">비즈니스 문의</h3>
<p data-i18n="contact.business.desc">제휴 및 협력 문의</p>
<a href="mailto:minglestudio@minglestudio.co.kr" class="contact-link">minglestudio@minglestudio.co.kr</a>
</div>
<div class="contact-card reveal" data-reveal="up">
<div class="contact-icon"><i class="fa-solid fa-envelope" aria-hidden="true"></i></div>
<h3>예약 및 문의</h3>
<p>24시간 접수 가능</p>
<h3 data-i18n="contact.reservation.title">예약 및 문의</h3>
<p data-i18n="contact.reservation.desc">24시간 접수 가능</p>
<a href="mailto:help@minglestudio.co.kr" class="contact-link">help@minglestudio.co.kr</a>
</div>
<div class="contact-card reveal" data-reveal="up">
<div class="contact-icon"><i class="fa-solid fa-location-dot" aria-hidden="true"></i></div>
<h3>스튜디오 방문</h3>
<p>사전 예약 필수</p>
<a href="#location" class="contact-link">위치 보기</a>
<h3 data-i18n="contact.visit.title">스튜디오 방문</h3>
<p data-i18n="contact.visit.desc">사전 예약 필수</p>
<a href="#location" class="contact-link" data-i18n="contact.visit.link">위치 보기</a>
</div>
</div>
</div>
@ -124,34 +124,34 @@
<section id="location" class="section">
<div class="container">
<div class="section-header">
<h2>스튜디오 위치</h2>
<h2 data-i18n="contact.location.title">스튜디오 위치</h2>
</div>
<div class="location-wrapper">
<div class="location-info">
<div class="location-details">
<h3><i class="fa-solid fa-location-dot" aria-hidden="true"></i> 주소</h3>
<p>(21330) 인천광역시 부평구 주부토로 236<br>
<h3><i class="fa-solid fa-location-dot" aria-hidden="true"></i> <span data-i18n="contact.location.address">주소</span></h3>
<p data-i18n-html="contact.location.addressValue">(21330) 인천광역시 부평구 주부토로 236<br>
인천테크노밸리 U1센터 A동 B105호</p>
<h3><i class="fa-solid fa-train-subway" aria-hidden="true"></i> 지하철</h3>
<h3><i class="fa-solid fa-train-subway" aria-hidden="true"></i> <span data-i18n="contact.location.subway">지하철</span></h3>
<ul>
<li>인천 7호선 갈산역 하차 → 도보 약 7분</li>
<li data-i18n="contact.location.subwayDesc">인천 7호선 갈산역 하차 → 도보 약 7분</li>
</ul>
<h3><i class="fa-solid fa-bus" aria-hidden="true"></i> 버스</h3>
<h3><i class="fa-solid fa-bus" aria-hidden="true"></i> <span data-i18n="contact.location.bus">버스</span></h3>
<ul>
<li>갈산시장·갈산도서관 정류장 이용</li>
<li>4번, 526번, 555번 버스</li>
<li data-i18n="contact.location.busStop">갈산시장·갈산도서관 정류장 이용</li>
<li data-i18n="contact.location.busRoutes">4번, 526번, 555번 버스</li>
</ul>
<h3><i class="fa-solid fa-car" aria-hidden="true"></i> 주차</h3>
<p>기본 2시간 무료, 건물 내 시설 이용시 최대 4시간 무료</p>
<h3><i class="fa-solid fa-car" aria-hidden="true"></i> <span data-i18n="contact.location.parking">주차</span></h3>
<p data-i18n="contact.location.parkingDesc">기본 2시간 무료, 건물 내 시설 이용시 최대 4시간 무료</p>
<h3><i class="fa-solid fa-clock" aria-hidden="true"></i> 운영시간</h3>
<h3><i class="fa-solid fa-clock" aria-hidden="true"></i> <span data-i18n="contact.location.hours">운영시간</span></h3>
<ul>
<li>24시간 영업</li>
<li>연중무휴</li>
<li data-i18n="contact.location.hours24">24시간 영업</li>
<li data-i18n="contact.location.hoursAllYear">연중무휴</li>
</ul>
</div>
@ -170,8 +170,8 @@
</div>
<div class="map-buttons">
<a href="https://map.naver.com/p/search/밍글스튜디오" target="_blank" class="btn btn-outline">네이버 지도</a>
<a href="https://maps.app.goo.gl/ioGQR4ZEsuGToRnb9" target="_blank" class="btn btn-outline">구글 맵</a>
<a href="https://map.naver.com/p/search/밍글스튜디오" target="_blank" class="btn btn-outline" data-i18n="contact.location.naverMap">네이버 지도</a>
<a href="https://maps.app.goo.gl/ioGQR4ZEsuGToRnb9" target="_blank" class="btn btn-outline" data-i18n="contact.location.googleMap">구글 맵</a>
</div>
</div>
</div>
@ -182,11 +182,11 @@
<!-- 예약 및 FAQ -->
<section class="section bg-gradient">
<div class="container text-center">
<h2>예약 및 문의</h2>
<p>간편한 온라인 예약 또는 자주 묻는 질문을 확인해보세요</p>
<h2 data-i18n="contact.cta.title">예약 및 문의</h2>
<p data-i18n="contact.cta.desc">간편한 온라인 예약 또는 자주 묻는 질문을 확인해보세요</p>
<div class="cta-buttons">
<a href="https://m.booking.naver.com/booking/10/bizes/1468174/items/6949481" target="_blank" class="btn btn-primary btn-lg">네이버 예약</a>
<a href="qna.html" class="btn btn-outline btn-lg">FAQ 보기</a>
<a href="https://m.booking.naver.com/booking/10/bizes/1468174/items/6949481" target="_blank" class="btn btn-primary btn-lg" data-i18n="contact.cta.btnNaver">네이버 예약</a>
<a href="qna.html" class="btn btn-outline btn-lg" data-i18n="contact.cta.btnFaq">FAQ 보기</a>
</div>
</div>
</section>
@ -232,6 +232,7 @@
</footer>
<!-- JavaScript -->
<script src="js/i18n.js"></script>
<script src="js/common.js"></script>
<script src="js/contact.js"></script>
</body>

161
css/common.css
View File

@ -366,6 +366,151 @@ body {
transform: rotate(-45deg) translate(5px, -5px);
}
/* ========================================
Nav Actions (언어 스위처 + 다크모드 토글 컨테이너)
======================================== */
.nav-actions {
display: flex;
align-items: center;
gap: 0.5rem;
}
/* ========================================
언어 스위처
======================================== */
.lang-switcher {
position: relative;
}
.lang-btn {
display: flex;
align-items: center;
gap: 4px;
padding: 6px 10px;
border: 1px solid var(--border-color);
border-radius: 8px;
background: transparent;
cursor: pointer;
font-size: 0.8rem;
font-weight: 700;
color: var(--text-primary);
transition: background 0.2s ease, border-color 0.2s ease;
}
.lang-btn:hover {
background: rgba(0, 0, 0, 0.04);
border-color: var(--primary-color);
}
.lang-btn.open {
border-color: var(--primary-color);
background: rgba(255, 136, 0, 0.06);
}
.lang-chevron {
transition: transform 0.2s ease;
opacity: 0.6;
}
.lang-btn.open .lang-chevron {
transform: rotate(180deg);
}
.lang-dropdown {
display: none;
position: absolute;
top: calc(100% + 6px);
right: 0;
min-width: 140px;
background: var(--bg-white);
border: 1px solid var(--border-color);
border-radius: 10px;
box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);
padding: 6px;
list-style: none;
z-index: 1000;
animation: langDropIn 0.15s ease;
}
.lang-dropdown.open {
display: block;
}
@keyframes langDropIn {
from {
opacity: 0;
transform: translateY(-6px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.lang-dropdown li {
list-style: none;
}
.lang-dropdown button {
display: block;
width: 100%;
padding: 8px 12px;
border: none;
background: transparent;
cursor: pointer;
font-size: 0.85rem;
font-weight: 500;
color: var(--text-primary);
border-radius: 6px;
text-align: left;
transition: background 0.15s ease;
}
.lang-dropdown button:hover {
background: rgba(255, 136, 0, 0.08);
}
.lang-dropdown button.active {
background: rgba(255, 136, 0, 0.12);
color: var(--primary-color);
font-weight: 700;
}
/* 다크 모드 - 언어 스위처 */
[data-theme="dark"] .lang-btn {
border-color: rgba(255, 255, 255, 0.12);
color: rgba(255, 255, 255, 0.9);
}
[data-theme="dark"] .lang-btn:hover {
background: rgba(255, 255, 255, 0.06);
border-color: var(--primary-color);
}
[data-theme="dark"] .lang-btn.open {
border-color: var(--primary-color);
background: rgba(255, 136, 0, 0.1);
}
[data-theme="dark"] .lang-dropdown {
background: #1a1a2e;
border-color: rgba(255, 255, 255, 0.1);
box-shadow: 0 8px 30px rgba(0, 0, 0, 0.4);
}
[data-theme="dark"] .lang-dropdown button {
color: rgba(255, 255, 255, 0.85);
}
[data-theme="dark"] .lang-dropdown button:hover {
background: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .lang-dropdown button.active {
background: rgba(255, 136, 0, 0.15);
color: var(--primary-color);
}
/* ========================================
푸터
======================================== */
@ -842,6 +987,22 @@ body {
display: flex;
}
/* 모바일 nav-actions */
.nav-actions {
gap: 0.25rem;
}
/* 모바일 언어 스위처 */
.lang-btn {
padding: 5px 8px;
font-size: 0.75rem;
}
.lang-dropdown {
right: -40px;
min-width: 130px;
}
/* 모바일 다크모드 토글 - 컴팩트 원형 아이콘 버튼 */
.theme-toggle {
width: 36px;

41
gallery.html
View File

@ -71,15 +71,15 @@
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-PPTNN6WD"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
<a href="#main-content" class="skip-to-content">본문 바로가기</a>
<a href="#main-content" class="skip-to-content" data-i18n="common.skipToContent">본문 바로가기</a>
<div id="header-placeholder"></div>
<main id="main-content">
<section class="page-header">
<div class="container">
<h1>Studio Gallery</h1>
<p>밍글 스튜디오의 실제 공간을 사진으로 확인해보세요</p>
<h1 data-i18n="gallery.pageHeader.title">Studio Gallery</h1>
<p data-i18n="gallery.pageHeader.desc">밍글 스튜디오의 실제 공간을 사진으로 확인해보세요</p>
</div>
</section>
@ -88,47 +88,47 @@
<div class="gallery-grid">
<div class="gallery-item">
<img src="/images/studio/넓은 모션 캡쳐 공간 002.webp" alt="밍글 스튜디오 메인 모션캡쳐 공간 - OptiTrack 카메라 30대와 넓은 8x7m 캡쳐 공간" class="gallery-img" loading="lazy">
<div class="gallery-caption">외부전경 커튼 열림</div>
<div class="gallery-caption" data-i18n="gallery.captions.exterior_open">외부전경 커튼 열림</div>
</div>
<div class="gallery-item">
<img src="/images/studio/커튼을 친 외부 전경.webp" alt="밍글 스튜디오 모션캡쳐 공간 커튼 닫은 모습 - 프라이버시 보호" class="gallery-img" loading="lazy">
<div class="gallery-caption">외부 전경 닫힘</div>
<div class="gallery-caption" data-i18n="gallery.captions.exterior_closed">외부 전경 닫힘</div>
</div>
<div class="gallery-item">
<img src="/images/studio/오퍼레이팅 공간 강조.webp" alt="밍글 스튜디오 오퍼레이팅 컨트롤룸 - 전문 장비와 대형 모니터로 실시간 모니터링" class="gallery-img" loading="lazy">
<div class="gallery-caption">오퍼레이팅/컨트롤룸</div>
<div class="gallery-caption" data-i18n="gallery.captions.control_room">오퍼레이팅/컨트롤룸</div>
</div>
<div class="gallery-item">
<img src="/images/studio/스튜디오와 연결된 파우더룸.webp" alt="밍글 스튜디오 파우더룸 - 스튜디오와 직접 연결된 메이크업 및 준비 공간" class="gallery-img" loading="lazy">
<div class="gallery-caption">파우더룸(스튜디오 연결)</div>
<div class="gallery-caption" data-i18n="gallery.captions.powder_room">파우더룸(스튜디오 연결)</div>
</div>
<div class="gallery-item">
<img src="/images/studio/탈의실 내부 공간.webp" alt="밍글 스튜디오 탈의실 내부 - 편리한 의상 보관 및 착용 공간" class="gallery-img" loading="lazy">
<div class="gallery-caption">탈의실(내부)</div>
<div class="gallery-caption" data-i18n="gallery.captions.changing_room_in">탈의실(내부)</div>
</div>
<div class="gallery-item">
<img src="/images/studio/탈의실 외부 공간.webp" alt="밍글 스튜디오 탈의실 대기 공간 - 탈의실 전 준비 및 대기 공간" class="gallery-img" loading="lazy">
<div class="gallery-caption">탈의실(외부)</div>
<div class="gallery-caption" data-i18n="gallery.captions.changing_room_out">탈의실(외부)</div>
</div>
<div class="gallery-item">
<img src="/images/studio/고품질 녹음을 위한 음향 시스템.webp" alt="밍글 스튜디오 고품질 녹음 음향 시스템 - 전문적인 오디오 녹음 장비" class="gallery-img" loading="lazy">
<div class="gallery-caption">고품질 음향 시스템</div>
<div class="gallery-caption" data-i18n="gallery.captions.audio_system">고품질 음향 시스템</div>
</div>
<div class="gallery-item">
<img src="/images/studio/모션캡쳐 공간 001.webp" alt="밍글 스튜디오 모션캡쳐 공간 전체 전경 001 - OptiTrack 카메라와 넓은 캡쳐 에리어" class="gallery-img" loading="lazy">
<div class="gallery-caption">모션캡쳐 공간 001</div>
<div class="gallery-caption" data-i18n="gallery.captions.mocap_space_1">모션캡쳐 공간 001</div>
</div>
<div class="gallery-item">
<img src="/images/studio/모션캡쳐 공간 002.webp" alt="밍글 스튜디오 모션캡쳐 공간 전체 전경 002 - 다양한 각도에서 본 캡쳐 공간" class="gallery-img" loading="lazy">
<div class="gallery-caption">모션캡쳐 공간 002</div>
<div class="gallery-caption" data-i18n="gallery.captions.mocap_space_2">모션캡쳐 공간 002</div>
</div>
<div class="gallery-item">
<img src="/images/studio/모션캡쳐 공간 003.webp" alt="밍글 스튜디오 모션캡쳐 공간 전체 전경 003 - 조명과 카메라 시스템 배치" class="gallery-img" loading="lazy">
<div class="gallery-caption">모션캡쳐 공간 003</div>
<div class="gallery-caption" data-i18n="gallery.captions.mocap_space_3">모션캡쳐 공간 003</div>
</div>
<div class="gallery-item">
<img src="/images/studio/모션캡쳐 공간 004.webp" alt="밍글 스튜디오 모션캡쳐 공간 전체 전경 004 - 완성된 모션캡쳐 스튜디오 전경" class="gallery-img" loading="lazy">
<div class="gallery-caption">모션캡쳐 공간 004</div>
<div class="gallery-caption" data-i18n="gallery.captions.mocap_space_4">모션캡쳐 공간 004</div>
</div>
</div>
</div>
@ -137,8 +137,8 @@
<!-- 360도 이미지 섹션 -->
<section class="panorama-section">
<div class="container">
<h2>360° Studio View</h2>
<p class="section-subtitle">드래그하여 스튜디오를 360도로 둘러보세요</p>
<h2 data-i18n="gallery.panorama.title">360° Studio View</h2>
<p class="section-subtitle" data-i18n="gallery.panorama.desc">드래그하여 스튜디오를 360도로 둘러보세요</p>
<div class="panorama-grid">
<div class="panorama-viewer" data-panorama="curtain-open">
@ -149,14 +149,14 @@
alt="밍글 스튜디오 360도 전경 - 커튼을 걷은 모습"
class="panorama-preview-image"
loading="lazy">
<div class="panorama-help">클릭하여 360° VR로 체험하기</div>
<div class="panorama-help" data-i18n="gallery.panorama.clickToView">클릭하여 360° VR로 체험하기</div>
<div class="panorama-indicator">360° VR</div>
<div class="panorama-play-button" role="button" tabindex="0" aria-label="360도 VR 체험하기">
<i class="fas fa-play"></i>
</div>
</div>
<div class="panorama-controls">
<div class="panorama-title">스튜디오 전경 (커튼 열림)</div>
<div class="panorama-title" data-i18n="gallery.panorama.curtainOpen">스튜디오 전경 (커튼 열림)</div>
</div>
</div>
@ -168,14 +168,14 @@
alt="밍글 스튜디오 360도 전경 - 커튼을 친 모습"
class="panorama-preview-image"
loading="lazy">
<div class="panorama-help">클릭하여 360° VR로 체험하기</div>
<div class="panorama-help" data-i18n="gallery.panorama.clickToView">클릭하여 360° VR로 체험하기</div>
<div class="panorama-indicator">360° VR</div>
<div class="panorama-play-button" role="button" tabindex="0" aria-label="360도 VR 체험하기">
<i class="fas fa-play"></i>
</div>
</div>
<div class="panorama-controls">
<div class="panorama-title">스튜디오 전경 (커튼 닫힘)</div>
<div class="panorama-title" data-i18n="gallery.panorama.curtainClosed">스튜디오 전경 (커튼 닫힘)</div>
</div>
</div>
</div>
@ -220,6 +220,7 @@
</div>
</footer>
<script src="js/i18n.js"></script>
<script src="js/common.js"></script>
<script src="js/gallery.js"></script>
</body>

710
i18n/en.json Normal file
View File

@ -0,0 +1,710 @@
{
"header": {
"studioName": "Mingle Studio",
"nav": {
"about": "About",
"services": "Services",
"portfolio": "Portfolio",
"gallery": "Gallery",
"contact": "Contact",
"qna": "Q&A"
},
"menuOpen": "Open menu",
"menuClose": "Close menu",
"darkMode": "Switch to dark mode",
"lightMode": "Switch to light mode",
"langSelect": "Select language"
},
"footer": {
"companyInfo": "Company Info",
"companyName": "Mingle Studio",
"ceo": "CEO: 김희진",
"businessNumber": "Business Registration No.: 208-12-73755",
"contact": "Contact",
"businessInquiry": "Business Inquiry",
"reservationInquiry": "Reservation Inquiry",
"directions": "Directions",
"address": "236, Jubuto-ro, Bupyeong-gu, Incheon",
"addressDetail": "Incheon Techno Valley U1 Center, Bldg. A, Room B105",
"copyright": "© 2025 Mingle Studio. All rights reserved."
},
"common": {
"loading": "Loading page...",
"componentLoading": "Loading...",
"skipToContent": "Skip to content",
"videoLoading": "Loading video...",
"videoError": "Unable to load video",
"imageError": "Unable to load image"
},
"index": {
"meta": {
"title": "Mingle Studio - Motion Capture Creative Studio",
"description": "A professional motion capture studio equipped with cutting-edge OptiTrack systems and specialized equipment. Experience new possibilities in virtual content creation at Incheon Techno Valley.",
"ogTitle": "Mingle Studio - Motion Capture Creative Studio",
"ogDescription": "A professional motion capture studio equipped with cutting-edge OptiTrack systems and specialized equipment"
},
"hero": {
"title": "Mingle Studio",
"subtitle": "MINGLE STUDIO",
"description": "A space where technology, creativity, and passion blend together<br>to create something new",
"btnAbout": "About Us",
"btnContact": "Book Now",
"specCamera": "OptiTrack Cameras",
"specCameraUnit": "units",
"specSpace": "Capture Space",
"specPrice": "Hourly Rental",
"specPriceUnit": "KRW"
},
"showcase": {
"step1": {
"label": "Equipment",
"title": "Cutting-Edge Motion Capture System",
"desc": "From OptiTrack optical cameras and Rokoko gloves to ARKit facial capture — we precisely track full-body movement, fingertips, and facial expressions.",
"feature1Title": "30 OptiTrack Cameras",
"feature1Desc": "Sub-millimeter optical motion tracking",
"feature2Title": "5 Rokoko Gloves",
"feature2Desc": "Precise hand capture down to individual finger joints",
"feature3Title": "ARKit Facial Capture (5 iPhones)",
"feature3Desc": "iPhone-based high-precision facial capture"
},
"step2": {
"label": "Space",
"title": "Spacious, Optimized Capture Area",
"desc": "Our dedicated 8m x 7m x 2.6m capture volume allows for unrestricted movement.",
"feature1Title": "8m × 7m × 2.6m",
"feature1Desc": "Spacious dedicated capture volume",
"feature2Title": "Live Streaming",
"feature2Desc": "Live broadcasting via Streamingle service"
},
"step3": {
"label": "Services",
"title": "Key Application Areas",
"desc": "Our professional operators support a wide range of creative projects.",
"virtual": "Virtual Content",
"virtualSub": "VTuber, Virtual Idols",
"game": "Game Development",
"gameSub": "Character Animation",
"video": "Video Production",
"videoSub": "VFX, Virtual Production",
"metaverse": "Metaverse",
"metaverseSub": "3D Avatar Content",
"btnServices": "View All Services"
},
"step4": {
"label": "Studio",
"title": "Studio Spaces",
"desc": "From the main capture area to the control room and private rooms, everything is fully equipped. We provide the optimal capture experience with professional technical support.",
"feature1Title": "Professional Tech Support",
"feature1Desc": "Real-time assistance from experienced operators",
"feature2Title": "Private Environment",
"feature2Desc": "Focused work in a dedicated private space",
"btnGallery": "View Gallery"
}
},
"portfolio": {
"title": "Portfolio",
"desc": "Motion capture content produced and collaborated on at Mingle Studio",
"tabCreator": "Individual Creators",
"tabCorporate": "Corporate Projects",
"tabShorts": "Shorts",
"btnMore": "View Full Portfolio →"
},
"partner": {
"title": "Partner Streamers",
"desc": "Creators making content with Mingle Studio",
"streamer1": {
"desc": "Guseulyo! A virtual streamer featuring diverse content including chatting, singing, gaming, VRChat, and more",
"tagSong": "Singing",
"tagGame": "Gaming"
}
},
"creatorSigns": {
"title": "Visiting Creators",
"desc": "Signatures from creators who visited Mingle Studio"
},
"clients": {
"title": "Clients",
"desc": "We create innovative motion capture content with companies across various industries"
},
"faqShortcut": {
"label": "FAQ",
"title": "New to Motion Capture?",
"desc": "No worries if it's your first time. We've organized frequently asked questions from booking to filming.",
"btnFaq": "View FAQ",
"btnContact": "1:1 Inquiry"
},
"cta": {
"label": "Get Started",
"title": "Your Ideas,<br>Brought to Life Through Motion",
"desc": "Experience new creative possibilities at our professional motion capture studio",
"btnReserve": "Book Now",
"btnNaver": "Naver Booking",
"infoReservation": "Reservations",
"infoBusiness": "Business",
"infoDirections": "Directions",
"infoAddress": "236 Jubuto-ro, Bupyeong-gu, Incheon Techno Valley"
},
"popup": {
"title": "Pricing Update Notice",
"subtitle": "Effective from March 2026",
"badge": "In Effect",
"mainChanges": "Key Changes",
"discountEnd": "Discount Event Ended",
"discountEndDesc": "The grand opening 20% discount event ended on <strong>February 28</strong>, and standard pricing is now in effect.",
"streaming4h": "New Streamingle 4-Hour Package",
"streaming4hDesc": "Enjoy the same benefits as the existing Streamingle service (6 hours) in a 4-hour package.",
"referral": "Referral Program Launched",
"referralDesc": "Refer a friend and both the referrer and the referred receive a <strong>20% discount coupon</strong>. (One-time use, cannot be combined with other offers)",
"notice": "※ Updated pricing has been reflected on the Services page",
"effectiveDate": "Effective Date",
"effectiveDateValue": "March 2026 ~",
"inquiryEmail": "Inquiry Email",
"ctaBtn": "View Current Pricing →",
"dontShowToday": "Don't show again today",
"close": "Close"
}
},
"about": {
"meta": {
"title": "About Us - Mingle Studio",
"description": "Mingle Studio is a motion capture creative space where technology and creativity come together. Founded in 2025, located in Incheon Techno Valley.",
"ogTitle": "About Us - Mingle Studio",
"ogDescription": "Incheon's only professional motion capture studio, founded in 2025. A virtual content creative space where technology and creativity converge."
},
"pageHeader": {
"title": "About Us",
"desc": "A space where technology, creativity, and passion blend to create new value"
},
"info": {
"companyName": "Company Name",
"companyNameValue": "Mingle Studio",
"foundingDate": "Founded",
"foundingDateValue": "July 15, 2025",
"slogan": "Slogan",
"sloganValue": "\"A joyful creative space where everyone comes together\"",
"meaning": "Meaning",
"meaningValue": "Mingle Studio is a virtual content production space where technicians, creators, and audiences come together. Using cutting-edge optical motion capture technology, we bring virtual characters to life with vivid emotions and movement, realizing a new generation of digital performance."
},
"companyIntro": {
"title": "Company Introduction",
"desc1": "Mingle Studio is a motion capture-based creative space that produces new content through the 'mingling' of creators, technology, and people.",
"desc2": "Since our founding, we have provided a virtual content production environment centered on an easy-to-use studio rental service that anyone can access."
},
"visionMission": {
"title": "Vision & Mission",
"visionTitle": "Vision",
"visionDesc": "Building a creative ecosystem where every creator can turn imagination into reality without technical limitations",
"missionTitle": "Mission",
"missionDesc": "Transforming creators' ideas into vivid content through cutting-edge motion capture technology, delivering new digital experiences"
},
"history": {
"title": "History",
"date1": "July 15, 2025",
"event1Title": "Mingle Studio Founded",
"event1Desc": "Company establishment",
"date2": "August 1, 2025",
"event2Title": "Studio Grand Opening",
"event2Desc": "OptiTrack system installation completed and studio rental service launched"
},
"team": {
"title": "Our Team",
"desc": "Experts from diverse fields collaborate to support content production",
"member1Name": "김희진",
"member1Role": "CEO / 3D Artist",
"member1Desc": "Environment/resource production, HR and project management",
"member2Name": "김광진",
"member2Role": "CTO / Technical Director",
"member2Desc": "Studio technical operations, motion capture equipment management, audio systems, engine programming",
"member3Name": "이승민",
"member3Role": "CCO / Content Director",
"member3Desc": "Capture directing, motion cleanup, camera movement, performance direction"
},
"partner": {
"title": "Partner Streamer",
"desc": "Creators who produce content with Mingle Studio",
"streamer1Desc": "A virtual streamer showcasing diverse content including chat streams, singing, gaming, and VRChat. Actively broadcasting on SOOP, they create new virtual content powered by Mingle Studio's motion capture technology."
},
"values": {
"title": "Core Values",
"desc": "The core values that Mingle Studio pursues",
"collaboration": "Collaboration",
"collaborationDesc": "Synergy created by technicians and creators working together",
"innovation": "Innovation",
"innovationDesc": "Pioneering new creative possibilities with the latest technology",
"creativity": "Creativity",
"creativityDesc": "Creative solutions that turn imagination into reality",
"quality": "Quality",
"qualityDesc": "Pursuing the highest standard of motion capture quality"
}
},
"services": {
"meta": {
"title": "Services - Mingle Studio",
"description": "Mingle Studio Services - OptiTrack motion capture studio rental from ₩200,000/hour for 2 people, full-body/facial capture, professional motion recording",
"ogTitle": "Services - Mingle Studio",
"ogDescription": "OptiTrack motion capture studio rental services. Full-body and facial capture specialists."
},
"pageHeader": {
"title": "Services",
"desc": "We provide cutting-edge motion capture facilities and professional services"
},
"packages": {
"title": "Service Packages",
"desc": "We offer optimal motion capture recording services tailored to your needs and scale",
"vatNotice": "※ All prices are exclusive of VAT"
},
"service1": {
"title": "Service 1: Motion Capture Recording",
"badge": "Standard",
"team": "2-Person Session",
"teamPopular": "Popular",
"teamPrice": "₩200,000",
"teamUnit": "/hour",
"teamFeature1": "Simultaneous 2-person motion recording",
"teamFeature2": "Character interaction capture",
"teamFeature3": "Team project collaboration",
"additional": "Additional Person",
"additionalPrice": "+₩100,000",
"additionalUnit": "/person/hour",
"additionalFeature1": "Up to 5 simultaneous performers",
"additionalFeature2": "Multi-person motion capture",
"additionalFeature3": "Group choreography & acting capture",
"minPerson": "Minimum participants: 2 people",
"minTime": "Minimum session: 2 hours",
"maxPerson": "Maximum simultaneous performers: 5",
"techTitle": "Included Technology & Services",
"tech1": "30 OptiTrack Cameras",
"tech2": "Real-time avatar recording",
"tech3": "Full-body/facial capture",
"tech4": "Real-time monitoring",
"tech5": "Professional operator",
"tech6": "Motion data delivery",
"note": "Avatar retargeting is not included by default. It can be arranged through a separate consultation for follow-up work."
},
"combo": {
"title": "Combo Packages",
"badge": "Specialized",
"mvTitle": "Music Video / Short-Form Real-Time Shooting",
"mvPrice": "Same rate as Motion Capture",
"mvReqTitle": "Additional Requirements",
"mvReq1": "Pre-production brief required",
"mvReq2": "Character/background/props must be discussed in advance",
"mvReq3": "Actor casting if needed: ₩100,000 (per person per hour)",
"mvPortfolio": "View Portfolio",
"remoteTitle": "Remote Shooting",
"remotePrice": "Same rate as Motion Capture",
"remoteServiceTitle": "Service Details",
"remoteService1": "Remote real-time shooting support",
"remoteService2": "Online direction available",
"remoteService3": "Real-time streaming output",
"remoteExtraTitle": "Additional Fees",
"remoteExtra1": "Actor casting fee: ₩100,000 (per person per hour)"
},
"service2": {
"title": "Service 2: Streamingle Service",
"badge": "Flagship",
"pkg4h": "4-Hour Package",
"pkg4hBadge": "NEW",
"pkg4hPrice": "₩1,400,000",
"pkg4hUnit": "/ 1–5 people",
"pkg4hFeature1": "4 hours total",
"pkg4hFeature2": "2 hours studio rental + 2 hours shoot prep",
"pkg4hFeature3": "Same benefits as the 6-hour package",
"pkg6h": "6-Hour Package",
"pkg6hPrice": "₩2,000,000",
"pkg6hUnit": "/ 1–5 people",
"pkg6hFeature1": "6 hours total",
"pkg6hFeature2": "4 hours studio rental + 2 hours shoot prep",
"pkg6hFeature3": "Ideal for large-scale projects",
"commonLabel": "The following benefits are included in both the 4-hour and 6-hour packages",
"benefitsTitle": "Included Benefits",
"benefit1": "1 character setup per person (free)",
"benefit2": "2 existing backgrounds setup (free)",
"benefit3": "Props setup (up to 6 new props free, unlimited existing props)",
"benefit4": "Motion capture recording service",
"benefit5": "Real-time video shooting",
"benefit6": "Live broadcasting service",
"featuresTitle": "Service Features",
"feature1": "Large-scale project support",
"feature2": "Comprehensive shooting environment",
"feature3": "Real-time streaming (Streamingle exclusive)",
"feature4": "Full professional staff service",
"feature5": "Flexible for 1–5 participants",
"livePortfolio": "View Live Broadcasting Portfolio"
},
"service3": {
"title": "Service 3: Music Video Production",
"badge": "Premium",
"intro": "We support the entire music video production process, from planning to final delivery.",
"priceRange": "Estimated total cost: ₩2,000,000 – ₩4,000,000",
"priceNote1": "※ The above cost is an approximate estimate and may vary depending on project scope and requirements.",
"priceNote2": "※ Pricing varies based on background production scope, storyboard artist fees, number of avatars/props, and production complexity.",
"processTitle": "Production Process (7 Steps)",
"step1Title": "Planning Consultation (Free)",
"step1Desc": "The first step of music video production — defining the concept and mood.",
"step1Note": "※ A clear direction is essential for smooth production.",
"step2Title": "Background Production",
"step2Desc": "Options available based on copyright ownership.",
"step2Opt1Type": "Use Existing Background",
"step2Opt1Price": "₩30,000/each",
"step2Opt1Note": "Copyright: Company-owned",
"step2Opt2Type": "New Production (Company-owned)",
"step2Opt2Price": "₩100,000/each",
"step2Opt2Note": "Copyright: Company-owned (large or specialized backgrounds may have limitations)",
"step2Opt3Type": "New Production (Client-owned)",
"step2Opt3Price": "₩200,000 – ₩1,000,000/each",
"step2Opt3Note": "Copyright: Client-owned (varies by scale and detail)",
"step2ProcessNote": "Delivered as a Unity build for camera angle verification",
"step3Title": "Storyboard Creation",
"step3Price": "From ₩100,000",
"step3Desc": "An external professional artist visualizes the music video flow.",
"step3Note": "※ Shared with the client for direction and camera cut confirmation",
"step4Title": "Avatar Setup & Props Production",
"step4AvatarLabel": "Avatar Setup:",
"step4AvatarPrice": "₩50,000/each",
"step4PropLabel": "Story Props:",
"step4PropPrice": "₩20,000/each",
"step4Desc": "Avatars are optimized for the music video environment.",
"step4Note": "※ Avatar modification and optimization available",
"step5Title": "Motion Capture",
"step5StudioLabel": "Motion Capture Studio Rental",
"step5Solo": "1 person:",
"step5SoloPrice": "₩150,000/hour",
"step5Duo": "2 people:",
"step5DuoPrice": "₩200,000/hour",
"step5Extra": "Additional person:",
"step5ExtraPrice": "+₩100,000/person/hour",
"step5ExtraNote": "(up to 5 people)",
"step5ActorLabel": "Actor Casting",
"step5Actor": "Actor casting:",
"step5ActorPrice": "₩100,000/person/hour",
"step5Desc": "Motion is recorded based on the storyboard.",
"step5Note1": "※ Shooting duration: 1–2 days",
"step5Note2": "※ Minimum session: 2 hours",
"step6Title": "Look Development & Direction",
"step6Price": "From ₩500,000",
"step6Desc": "Post-processing, artwork, and camera work are done in Unity.",
"step6Note": "※ Varies based on production complexity and quality level",
"step7Title": "Final Feedback & Delivery",
"step7Desc": "The finished video is revised based on client feedback and delivered.",
"step7Note": "※ Delivery formats: mp4/mov, etc.",
"processNote": "Planning Consultation (Free) → Full Quote → Production begins after quote approval (Steps 2–7 proceed sequentially)"
},
"options": {
"title": "Additional Option Pricing",
"desc": "Additional options applicable to all service packages",
"vatNote": "*Exclusive of VAT",
"charSetup": "Character Setup",
"charPrice": "From ₩50,000",
"charUnit": "/ per character",
"charDesc": "New character setup",
"bgSetup": "Background Setup",
"bgExisting": "Use Existing Background",
"bgExistingPrice": "From ₩30,000",
"bgExistingUnit": "/ each",
"bgExistingNote": "Setup fee only",
"bgNew": "New Background Production",
"bgNewPrice": "From ₩100,000",
"bgNewUnit": "/ each",
"bgNewNote": "Setup fee + production/purchase fee separate\nOwnership can be assigned to Mingle Studio or the client",
"propSetup": "Props Setup",
"propPrice": "₩20,000",
"propUnit": "/ each",
"propDesc": "Props setup\n(Streamingle Service: up to 6 new props free, unlimited existing props included)"
},
"usage": {
"title": "Usage Guidelines",
"hours": "Operating Hours",
"hoursDesc": "Standard hours: 10:00 AM – 10:00 PM\n1.5x rate applies for after-hours use",
"minTime": "Minimum Session Time",
"minTimeDesc": "All services require a minimum of 2 hours\n(except Streamingle Service)",
"preparation": "Pre-Session Requirements",
"preparationDesc": "For music video/short-form shoots,\na production brief and materials must be discussed in advance",
"followUp": "Follow-Up Services",
"followUpDesc": "Avatar retargeting is only available\nas a follow-up service (separate consultation)"
},
"guide": {
"title": "Service Booking Guide",
"processTitle": "Studio Rental Process",
"step1": "Email Inquiry",
"step1Desc": "Submit a reservation form",
"step2": "Confirmation & Consultation",
"step2Desc": "Finalize details",
"step3": "Full Payment",
"step3Desc": "Complete payment",
"step4": "Reservation Confirmed",
"step4Desc": "Booking finalized",
"btnEmail": "Send Email Inquiry",
"btnNaver": "Book via Naver",
"naverNote": "※ You can check real-time availability and book via Naver Place"
},
"policy": {
"reservationTitle": "Reservation Info",
"reservation1": "We recommend booking at least 2 weeks before your desired date.",
"reservation2": "Cancellation penalties apply based on the cancellation policy if a confirmed reservation is cancelled due to the customer's circumstances.",
"visitTitle": "Visit Info",
"visit1": "Please arrive at least 30 minutes before your scheduled shoot, as preparation time is needed for wearing motion capture suits and equipment. (Preparation time is not included in the rental hours.)",
"visit2": "Please refrain from wearing accessories made of reflective materials, such as glasses and earrings, during the shoot.",
"refundTitle": "Cancellation & Refund Policy",
"refundColTime": "Cancellation Timing",
"refundColRate": "Refund Rate",
"refund7days": "7 days before reservation",
"refund100": "100% Refund",
"refund3days": "3 days before reservation",
"refund70": "70% Refund",
"refund1day": "1 day before reservation",
"refund50": "50% Refund",
"refundSameDay": "Same-day cancellation",
"refundNone": "No Refund"
}
},
"portfolio": {
"meta": {
"title": "Portfolio - Mingle Studio",
"description": "Mingle Studio Portfolio - A collection of YouTube content, VTuber broadcasts, and Shorts videos created with motion capture technology",
"ogTitle": "Portfolio - Mingle Studio",
"ogDescription": "Music videos, short-form content, VTuber broadcasts, and more produced at our motion capture studio. High-quality motion capture services powered by OptiTrack."
},
"pageHeader": {
"title": "Portfolio",
"desc": "Motion capture content produced and collaborated on at Mingle Studio"
},
"channel": {
"title": "Mingle Studio Official Channel",
"desc": "Check out our latest motion capture content and production process on YouTube",
"btn": "Visit YouTube Channel"
},
"tabs": {
"individual": "Individual Creators",
"corporate": "Corporate Projects"
},
"longform": {
"title": "Long-Form Content",
"desc": "Motion capture projects by individual creators"
},
"shorts": {
"title": "Shorts Content",
"desc": "Short, impactful motion capture moments"
},
"broadcast": {
"title": "Live Broadcast Examples",
"desc": "Real-time motion capture broadcasts by VTubers and streamers",
"noticeTitle": "Live Motion Capture Broadcasting",
"noticeDesc": "Experience high-quality virtual content through live motion capture broadcasts at Mingle Studio"
},
"corporate": {
"title": "Corporate Projects",
"desc": "Corporate and commercial motion capture projects",
"ixiaDesc": "Motion capture production for virtual idol group",
"mvSection": "Music Video Production",
"shortsSection": "Short-Form Video Production",
"liveSection": "Live Broadcasting"
},
"cta": {
"title": "Your Content Could Be Here",
"desc": "Be the next featured creator with Mingle Studio",
"btnInquiry": "Inquire About Your Project",
"btnServices": "Explore Services"
},
"js": {
"checkNetwork": "Please check your network connection",
"shareTitle": "Mingle Studio Portfolio",
"linkCopied": "Video link copied to clipboard.",
"linkCopyFailed": "Failed to copy link."
}
},
"gallery": {
"meta": {
"title": "Studio Gallery - Mingle Studio",
"description": "Mingle Studio Gallery - See our motion capture studio facilities and spaces in photos",
"ogTitle": "Studio Gallery - Mingle Studio",
"ogDescription": "30 OptiTrack cameras and an 8×7m large capture space. See the actual facilities and equipment of Incheon's only motion capture studio."
},
"pageHeader": {
"title": "Studio Gallery",
"desc": "Take a look at Mingle Studio's actual spaces through photos"
},
"captions": {
"exterior_open": "Exterior View (Curtains Open)",
"exterior_closed": "Exterior View (Curtains Closed)",
"control_room": "Operating/Control Room",
"powder_room": "Powder Room (Studio Connected)",
"changing_room_in": "Changing Room (Interior)",
"changing_room_out": "Changing Room (Exterior)",
"audio_system": "High-Quality Audio System",
"mocap_space_1": "Motion Capture Space 001",
"mocap_space_2": "Motion Capture Space 002",
"mocap_space_3": "Motion Capture Space 003",
"mocap_space_4": "Motion Capture Space 004"
},
"panorama": {
"title": "360° Studio View",
"desc": "Drag to explore the studio in 360 degrees",
"clickToView": "Click to experience in 360° VR",
"curtainOpen": "Studio Panorama (Curtains Open)",
"curtainClosed": "Studio Panorama (Curtains Closed)"
},
"js": {
"lightboxLabel": "Image viewer",
"close": "Close",
"prevImage": "Previous image",
"nextImage": "Next image",
"panoramaLoading": "Loading 360° image...",
"reset": "Reset",
"autoRotate": "Auto rotate",
"stop": "Stop",
"zoomIn": "Zoom in",
"zoomOut": "Zoom out",
"help": "Help",
"helpTitle": "360° Controls Guide",
"helpDrag": "Drag with mouse to rotate the view",
"helpTouch": "On touch screens, drag with your finger",
"helpZoom": "Use mouse wheel or pinch to zoom in/out",
"helpAutoRotate": "Use the auto-rotate button to automatically look around",
"helpEsc": "Press ESC to close",
"checkImageFile": "Please check the image file"
}
},
"contact": {
"meta": {
"title": "Contact Us - Mingle Studio",
"description": "Contact Mingle Studio - Inquiries for motion capture studio rental, shooting, production, and consultation",
"ogTitle": "Contact Us - Mingle Studio",
"ogDescription": "Inquiries for motion capture studio rental, shooting, and production. OptiTrack professional studio located in Incheon Techno Valley."
},
"pageHeader": {
"title": "Contact Us",
"desc": "Start your next project with Mingle Studio"
},
"phone": {
"title": "Phone",
"desc": "Available 24 hours"
},
"business": {
"title": "Business Inquiry",
"desc": "Partnerships and collaboration"
},
"reservation": {
"title": "Reservations & Inquiries",
"desc": "Accepting inquiries 24 hours"
},
"visit": {
"title": "Visit the Studio",
"desc": "Reservation required",
"link": "View Location"
},
"location": {
"title": "Studio Location",
"address": "Address",
"addressValue": "(21330) 236, Jubuto-ro, Bupyeong-gu, Incheon<br>Incheon Techno Valley U1 Center, Bldg. A, Room B105",
"subway": "Subway",
"subwayDesc": "Incheon Line 7, Galsan Station → approx. 7 min walk",
"bus": "Bus",
"busStop": "Galsan Market/Galsan Library bus stop",
"busRoutes": "Bus No. 4, 526, 555",
"parking": "Parking",
"parkingDesc": "2 hours free, up to 4 hours free when using building facilities",
"hours": "Operating Hours",
"hours24": "Open 24 Hours",
"hoursAllYear": "Open Year-Round",
"naverMap": "Naver Map",
"googleMap": "Google Maps"
},
"cta": {
"title": "Reservations & Inquiries",
"desc": "Make an easy online reservation or check our frequently asked questions",
"btnNaver": "Book via Naver",
"btnFaq": "View FAQ"
},
"js": {
"checkInput": "Please check your input.",
"sending": "Sending...",
"sendSuccess": "Your inquiry has been sent successfully. We will contact you shortly.",
"sendError": "An error occurred while sending. Please try again.",
"resetConfirm": "All entered data will be deleted. Continue?",
"invalidEmail": "Please enter a valid email address.",
"invalidPhone": "Please enter a valid phone number.",
"required": "This field is required."
}
},
"qna": {
"meta": {
"title": "FAQ - Mingle Studio",
"description": "Mingle Studio FAQ - Frequently asked questions about motion capture studio rental, shooting, and production",
"ogTitle": "FAQ - Mingle Studio",
"ogDescription": "Frequently asked questions about motion capture studio rental, shooting, pricing, and reservations. OptiTrack system usage guide."
},
"pageHeader": {
"title": "Frequently Asked Questions",
"desc": "Find answers to common questions about using Mingle Studio"
},
"search": {
"placeholder": "Search for your question...",
"btnLabel": "Search"
},
"categories": {
"all": "All",
"booking": "Booking/Rental",
"equipment": "Equipment/Tech",
"pricing": "Pricing/Payment",
"production": "Production/Shooting",
"streaming": "Streaming",
"etc": "Other"
},
"faq": {
"q1": "How do I book a studio rental?",
"q2": "Is there a deposit and refund policy?",
"q3": "What is the minimum rental time?",
"q4": "How far in advance should I book?",
"q5": "Is on-site payment available?",
"q6": "Can you issue a tax invoice?",
"q7": "What motion capture equipment do you use?",
"q8": "Are motion capture suits provided?",
"q9": "How many people can be captured simultaneously?",
"q10": "What are the payment methods?",
"q11": "What should I prepare for a shoot?",
"q12": "In what format can I receive the data?",
"q13": "Is live streaming possible?",
"q14": "Is parking available?",
"q15": "Are facility tours or studio visits available?",
"a1": "<p>You can make a reservation through the following methods:</p>\n<ul>\n<li><strong><i class=\"fa-solid fa-envelope\" aria-hidden=\"true\"></i> Email:</strong> <a href=\"mailto:help@minglestudio.co.kr?subject=[Studio Reservation Inquiry] Mingle Studio&body=Hello. I would like to inquire about a studio rental reservation at Mingle Studio.%0A%0A■ Basic Information%0A- Preferred Date: (e.g., December 25, 2024)%0A- Preferred Time: (e.g., 2 PM ~ 4 PM, 2 hours)%0A- Number of Participants: %0A- Contact Number: %0A- Email: %0A%0A■ Shooting Information%0A- Purpose: (e.g., VTuber broadcast, game development, video content, etc.)%0A- Expected Content: %0A- Required Equipment: (full-body motion capture / facial capture / other)%0A%0A■ Additional Requests%0A- Special Requirements: %0A- Questions: %0A%0A■ Notes%0A- Minimum Rental: 2 hours (220,000 KRW, VAT included)%0A- Extension: 110,000 KRW per hour%0A- Payment: Bank transfer or cash (card payment not available)%0A- Cash receipts/tax invoices available%0A%0AWe will respond as soon as possible.%0AThank you.\">help@minglestudio.co.kr</a></li>\n<li><strong><i class=\"fa-solid fa-phone\" aria-hidden=\"true\"></i> Phone:</strong> 010-9288-9190</li>\n<li><strong><i class=\"fa-solid fa-calendar\" aria-hidden=\"true\"></i> Naver Booking:</strong> <a href=\"https://m.booking.naver.com/booking/10/bizes/1468174/items/6949481\" target=\"_blank\">Naver Place Real-Time Booking</a></li>\n</ul>\n<div style=\"margin-top: var(--spacing-md); text-align: center;\">\n<button id=\"showEmailFormFAQ\" class=\"btn btn-primary\" style=\"font-size: 0.9rem; padding: 0.5rem 1rem;\"><i class=\"fa-solid fa-envelope\" aria-hidden=\"true\"></i> Email Inquiry</button>\n</div>\n<div id=\"emailFormFAQ\" class=\"email-form\" style=\"display:none; margin-top: var(--spacing-lg); padding: var(--spacing-lg); border: 1px solid #ddd; border-radius: var(--border-radius); background: #f9f9f9;\">\n<h4>Email Inquiry Form</h4>\n<p>Please copy the form below and send it via email:</p>\n<div class=\"email-template\" style=\"background: white; padding: var(--spacing-md); border-radius: var(--border-radius); font-family: monospace; font-size: 0.9rem; line-height: 1.6;\">\n<div><strong>Subject:</strong> [Studio Rental Inquiry]</div>\n<div><strong>To:</strong> help@minglestudio.co.kr</div>\n<br>\n<div><strong>1. Name and Affiliation</strong></div>\n<div style=\"color: #666; font-size: 0.85rem;\">(For individuals, name only. For companies, please include your name and organization)</div>\n<div style=\"margin: 0.5rem 0; padding: 0.5rem; background: #f0f0f0; border-radius: 4px;\">[Please fill in here]</div>\n<div><strong>2. Contact Information</strong></div>\n<div style=\"color: #666; font-size: 0.85rem;\">(Choose one: phone number, email, or Discord)</div>\n<div style=\"margin: 0.5rem 0; padding: 0.5rem; background: #f0f0f0; border-radius: 4px;\">[Please fill in here]</div>\n<div><strong>3. Number of Participants</strong></div>\n<div style=\"color: #666; font-size: 0.85rem;\">(1-2 recommended, up to 5 people)</div>\n<div style=\"margin: 0.5rem 0; padding: 0.5rem; background: #f0f0f0; border-radius: 4px;\">\u25a1 1 \u25a1 2 \u25a1 3 \u25a1 4 \u25a1 5</div>\n<div><strong>4. Purpose of Studio Use</strong></div>\n<div style=\"margin: 0.5rem 0; padding: 0.5rem; background: #f0f0f0; border-radius: 4px;\">\u25a1 Recording \u25a1 Other: [Please fill in here]</div>\n<div><strong>5. Preferred Rental Date</strong></div>\n<div style=\"color: #666; font-size: 0.85rem;\">※ We recommend booking at least 2 weeks in advance</div>\n<div style=\"margin: 0.5rem 0; padding: 0.5rem; background: #f0f0f0; border-radius: 4px;\">[Please fill in here]</div>\n<div><strong>6. Preferred Time Slot</strong></div>\n<div style=\"color: #666; font-size: 0.85rem;\">※ Example: 10 AM ~ 3 PM (5 hours)</div>\n<div style=\"color: #666; font-size: 0.85rem;\">※ Late-night rentals (10 PM ~ 8 AM next day) are subject to special rates per internal policy</div>\n<div style=\"margin: 0.5rem 0; padding: 0.5rem; background: #f0f0f0; border-radius: 4px;\">[Please fill in here]</div>\n</div>\n<div style=\"margin-top: var(--spacing-md); text-align: center;\">\n<a href=\"mailto:help@minglestudio.co.kr?subject=[Studio Rental Inquiry]\" class=\"btn btn-primary\"><i class=\"fa-solid fa-envelope\" aria-hidden=\"true\"></i> Send Email Now</a>\n</div>\n</div>\n<p>Please contact us at least 2 weeks in advance for smooth preparation.</p>",
"a2": "<p>Here is our refund policy:</p>\n<div class=\"policy-table\">\n<div class=\"policy-row\">\n<span class=\"policy-time\">7 days before reservation</span>\n<span class=\"policy-desc\">100% refund</span>\n</div>\n<div class=\"policy-row\">\n<span class=\"policy-time\">3 days before reservation</span>\n<span class=\"policy-desc\">70% refund</span>\n</div>\n<div class=\"policy-row\">\n<span class=\"policy-time\">1 day before reservation</span>\n<span class=\"policy-desc\">50% refund</span>\n</div>\n<div class=\"policy-row\">\n<span class=\"policy-time\">Same-day cancellation</span>\n<span class=\"policy-desc\">No refund</span>\n</div>\n</div>",
"a3": "<p>The minimum rental is <strong>2 hours</strong>.</p>\n<p>Extensions are available in 1-hour increments.</p>",
"a4": "<p>Please contact us at least 2 weeks in advance for smooth preparation.</p>",
"a5": "<p>On-site payment is available via cash or bank transfer.</p>\n<p>Please note that card payment is not available on-site.</p>\n<p>Cash receipts and tax invoices can be issued.</p>",
"a6": "<p>Yes, tax invoice issuance is available.</p>",
"a7": "<p>Mingle Studio is equipped with the following professional equipment:</p>\n<ul>\n<li><strong>OptiTrack Cameras:</strong> 30 units</li>\n<li><strong>Hand Tracking:</strong> Rokoko Smart Gloves in use</li>\n</ul>",
"a8": "<p>Yes, professional motion capture suits and markers are provided free of charge.</p>\n<ul>\n<li>Various sizes available (S, M, L, XL)</li>\n<li>Hygienically maintained in clean condition</li>\n<li>You may also bring your own suit</li>\n<li>Gloves, headbands, and other accessories included</li>\n</ul>",
"a9": "<p>Up to <strong>5 people</strong> can be captured simultaneously.</p>\n<p>Details by number of participants:</p>\n<ul>\n<li><strong>1 person:</strong> Highest precision capture</li>\n<li><strong>2 people:</strong> Optimal for interaction scenes</li>\n<li><strong>3-5 people:</strong> Group performance possible</li>\n</ul>\n<p>The more participants, the more limitations on capture space and accuracy.</p>",
"a10": "<p>We support the following payment methods:</p>\n<ul>\n<li><strong>Bank Transfer:</strong> Within 24 hours after reservation confirmation</li>\n<li><strong>Cash Payment:</strong> On-site payment available</li>\n<li><strong>Card Payment:</strong> Not available on-site</li>\n<li><strong>Tax Invoice:</strong> Available for business customers</li>\n<li><strong>Cash Receipt:</strong> Available for individual customers</li>\n</ul>\n<p>A deposit (30%) is due upon reservation confirmation, and the remaining balance (70%) can be paid on the day of shooting.</p>",
"a11": "<p>You will need to prepare the following:</p>\n<ul>\n<li><strong>Footwear:</strong> Socks must be worn</li>\n<li><strong>Glasses:</strong> Glasses cannot be worn (contact lenses recommended)</li>\n<li><strong>Hair:</strong> Long hair should be tied back</li>\n<li><strong>Accessories:</strong> Remove watches, rings, etc.</li>\n<li><strong>Makeup:</strong> Please avoid heavy makeup</li>\n</ul>\n<p>Motion capture suits and markers are provided by the studio.</p>",
"a12": "<p>We provide data in the following formats:</p>\n<ul>\n<li><strong>FBX Files:</strong> Compatible with Unity, Unreal Engine</li>\n<li><strong>ANIM Files:</strong> Directly compatible with Unity Animator</li>\n<li><strong>MP4 Video:</strong> Reference footage</li>\n</ul>\n<p>We will provide detailed information upon inquiry, and data is delivered via cloud.</p>",
"a13": "<p><strong>Yes, live streaming is available through our Streamingle service.</strong></p>\n<p>Motion capture data can be broadcast in real-time for use in live streams.</p>\n<p>For more details, please refer to the Streamingle service section on the Services page.</p>",
"a14": "<p>Yes, parking is available:</p>\n<ul>\n<li><strong>Basic:</strong> 2 hours free</li>\n<li><strong>When using building facilities:</strong> Additional 2 hours, up to 4 hours free</li>\n<li><strong>Location:</strong> Incheon Techno Valley building parking lot</li>\n</ul>",
"a15": "<p>Facility tours and visits require advance inquiry to confirm availability:</p>\n<ul>\n<li><strong>Advance Inquiry:</strong> Required (may be declined depending on studio schedule)</li>\n<li><strong>Contact:</strong> help@minglestudio.co.kr</li>\n<li><strong>Tour Duration:</strong> Approx. 30 minutes (upon approval)</li>\n<li><strong>Cost:</strong> Free</li>\n</ul>\n<p>Please understand that tours may be restricted depending on studio operations.</p>"
},
"cta": {
"title": "Didn't find the answer you're looking for?",
"desc": "If you have any questions, feel free to contact us anytime",
"btnContact": "Contact Us",
"btnCall": "Call Us"
}
},
"error404": {
"meta": {
"title": "Page Not Found - Mingle Studio"
},
"title": "Page Not Found",
"desc": "Sorry, the page you requested does not exist or may have been moved.<br>Please use the links below to find what you're looking for.",
"btnHome": "Back to Home",
"btnContact": "Contact Us",
"searchPlaceholder": "Search for what you need...",
"helpfulLinks": "Helpful Pages",
"linkAbout": "About Us",
"linkServices": "Services",
"linkPortfolio": "Portfolio",
"linkGallery": "Studio Gallery",
"linkQna": "FAQ",
"linkContact": "Contact & Location"
}
}

710
i18n/ja.json Normal file
View File

@ -0,0 +1,710 @@
{
"header": {
"studioName": "Mingle Studio",
"nav": {
"about": "About",
"services": "Services",
"portfolio": "Portfolio",
"gallery": "Gallery",
"contact": "Contact",
"qna": "Q&A"
},
"menuOpen": "メニューを開く",
"menuClose": "メニューを閉じる",
"darkMode": "ダークモードに切替",
"lightMode": "ライトモードに切替",
"langSelect": "言語選択"
},
"footer": {
"companyInfo": "会社情報",
"companyName": "Mingle Studio",
"ceo": "代表: 김희진",
"businessNumber": "事業者登録番号: 208-12-73755",
"contact": "お問い合わせ",
"businessInquiry": "ビジネスお問い合わせ",
"reservationInquiry": "ご予約お問い合わせ",
"directions": "アクセス",
"address": "인천광역시 부평구 주부토로 236",
"addressDetail": "인천테크노밸리 U1센터 A동 B105호",
"copyright": "© 2025 Mingle Studio. All rights reserved."
},
"common": {
"loading": "ページを読み込み中...",
"componentLoading": "読み込み中...",
"skipToContent": "本文へスキップ",
"videoLoading": "動画を読み込み中...",
"videoError": "動画を読み込めません",
"imageError": "画像を読み込めません"
},
"index": {
"meta": {
"title": "Mingle Studio - モーションキャプチャー制作スタジオ",
"description": "最先端OptiTrackシステムと専門機材を備えたモーションキャプチャースタジオ。仁川テクノバレーでバーチャルコンテンツの新たな可能性を体験してください。",
"ogTitle": "Mingle Studio - モーションキャプチャー制作スタジオ",
"ogDescription": "最先端OptiTrackシステムと専門機材を備えたモーションキャプチャースタジオ"
},
"hero": {
"title": "Mingle Studio",
"subtitle": "MINGLE STUDIO",
"description": "技術と創造力、情熱が一つに混ざり合い<br>新しい価値が生まれる空間",
"btnAbout": "会社紹介を見る",
"btnContact": "ご予約・お問い合わせ",
"specCamera": "OptiTrack カメラ",
"specCameraUnit": "台",
"specSpace": "キャプチャー空間",
"specPrice": "1時間あたりレンタル料",
"specPriceUnit": "万ウォン"
},
"showcase": {
"step1": {
"label": "Equipment",
"title": "最先端モーションキャプチャーシステム",
"desc": "OptiTrack光学式カメラ、Rokokoグローブ、ARKitフェイシャルキャプチャーまで — 全身から指先、表情まで精密にトラッキングします。",
"feature1Title": "OptiTrack カメラ 30台",
"feature1Desc": "サブミリメートル精度の光学式モーショントラッキング",
"feature2Title": "Rokoko グローブ 5台",
"feature2Desc": "指の関節まで精密なハンドキャプチャー",
"feature3Title": "ARKit フェイシャルキャプチャー (iPhone 5台)",
"feature3Desc": "iPhone基盤の高精度表情キャプチャー"
},
"step2": {
"label": "Space",
"title": "広く最適化されたキャプチャー空間",
"desc": "8m x 7m x 2.6m規模の専用キャプチャーボリュームで自由な動きが可能です。",
"feature1Title": "8m × 7m × 2.6m",
"feature1Desc": "広々とした専用キャプチャーボリューム",
"feature2Title": "リアルタイムストリーミング",
"feature2Desc": "ストリーミングルサービスでライブ配信"
},
"step3": {
"label": "Services",
"title": "主な活用分野",
"desc": "多様なクリエイティブプロジェクトを専門オペレーターがサポートします。",
"virtual": "バーチャルコンテンツ",
"virtualSub": "VTuber、バーチャルアイドル",
"game": "ゲーム開発",
"gameSub": "キャラクターアニメーション",
"video": "映像制作",
"videoSub": "VFX、バーチャルプロダクション",
"metaverse": "メタバース",
"metaverseSub": "3Dアバターコンテンツ",
"btnServices": "全サービスを見る"
},
"step4": {
"label": "Studio",
"title": "スタジオ空間",
"desc": "メインキャプチャー空間からコントロールルーム、プライベートルームまで全ての環境が整っています。専門的な技術サポートと共に最適なキャプチャー体験を提供します。",
"feature1Title": "専門技術サポート",
"feature1Desc": "熟練オペレーターによるリアルタイムサポート",
"feature2Title": "プライベート環境",
"feature2Desc": "独立した空間で集中作業",
"btnGallery": "ギャラリーを見る"
}
},
"portfolio": {
"title": "ポートフォリオ",
"desc": "Mingle Studioで制作・協業したモーションキャプチャーコンテンツ",
"tabCreator": "個人クリエイター",
"tabCorporate": "企業プロジェクト",
"tabShorts": "Shorts",
"btnMore": "全ポートフォリオを見る →"
},
"partner": {
"title": "パートナーストリーマー",
"desc": "Mingle Studioと共にコンテンツを作るクリエイター",
"streamer1": {
"desc": "グスルヨ！おしゃべり、歌、ゲーム、VRChatなど多彩なコンテンツを配信するバーチャルストリーマー",
"tagSong": "歌",
"tagGame": "ゲーム"
}
},
"creatorSigns": {
"title": "来訪クリエイター",
"desc": "Mingle Studioを訪れたクリエイターたちのサイン"
},
"clients": {
"title": "クライアント",
"desc": "様々な分野の企業と共に革新的なモーションキャプチャーコンテンツを制作しています"
},
"faqShortcut": {
"label": "FAQ",
"title": "初めてで不安ですか？",
"desc": "モーションキャプチャーが初めてでも大丈夫です。予約から撮影までよくある質問をまとめました。",
"btnFaq": "よくある質問を見る",
"btnContact": "1:1お問い合わせ"
},
"cta": {
"label": "Get Started",
"title": "あなたのアイデアを、<br>動きで形にします",
"desc": "プロのモーションキャプチャースタジオで、クリエイティブの新たな可能性を体験してください",
"btnReserve": "ご予約・お問い合わせ",
"btnNaver": "Naver予約",
"infoReservation": "ご予約",
"infoBusiness": "ビジネス",
"infoDirections": "アクセス",
"infoAddress": "仁川市富平区主夫吐路236、仁川テクノバレー"
},
"popup": {
"title": "料金プラン変更のお知らせ",
"subtitle": "2026年3月より適用されました",
"badge": "施行中",
"mainChanges": "主な変更点",
"discountEnd": "割引イベント終了",
"discountEndDesc": "オープン記念20%割引イベントが<strong>2月28日</strong>をもって終了し、現在は通常料金が適用されています。",
"streaming4h": "ストリーミングル4時間サービス新設",
"streaming4hDesc": "既存のストリーミングルサービス（6時間）と同じ特典を4時間パッケージでご利用いただけます。",
"referral": "紹介制度オープン",
"referralDesc": "お友達をご紹介いただくと、紹介した方・紹介された方の両方に<strong>20%割引券</strong>を差し上げます。（1回限り、他割引との併用不可）",
"notice": "※ 変更された料金はサービスページに反映されています",
"effectiveDate": "適用時期",
"effectiveDateValue": "2026年3月〜",
"inquiryEmail": "お問い合わせメール",
"ctaBtn": "現在のサービス料金を見る →",
"dontShowToday": "今日は表示しない",
"close": "閉じる"
}
},
"about": {
"meta": {
"title": "会社紹介 - Mingle Studio",
"description": "Mingle Studioは技術と創造力が融合したモーションキャプチャー制作空間です。2025年設立、仁川テクノバレー所在。",
"ogTitle": "会社紹介 - Mingle Studio",
"ogDescription": "2025年設立の仁川唯一のモーションキャプチャー専門スタジオ。技術と創造力が融合したバーチャルコンテンツ制作空間です"
},
"pageHeader": {
"title": "About Us",
"desc": "技術と創造力、情熱が一つに混ざり合い新しい価値が生まれる空間"
},
"info": {
"companyName": "会社名",
"companyNameValue": "Mingle Studio (Mingle Studio)",
"foundingDate": "設立日",
"foundingDateValue": "2025年7月15日",
"slogan": "スローガン",
"sloganValue": "\"みんなが交わる楽しい創作空間\"",
"meaning": "意味",
"meaningValue": "Mingle Studioは技術者とクリエイター、そして視聴者が共に交わるバーチャルコンテンツ制作空間です。最先端光学式モーションキャプチャー技術でバーチャルキャラクターの生き生きとした感情と動きを捉え、新しい世代のデジタルパフォーマンスを実現します。"
},
"companyIntro": {
"title": "会社紹介",
"desc1": "Mingle Studioは、クリエイターと技術、人と人との「交わり」を通じて新しいコンテンツを作り上げるモーションキャプチャー基盤の創作空間です。",
"desc2": "設立以来、どなたでも気軽にご利用いただけるスタジオレンタルサービスを中心に、バーチャルコンテンツ制作環境を提供しています。"
},
"visionMission": {
"title": "ビジョン & ミッション",
"visionTitle": "ビジョン",
"visionDesc": "全てのクリエイターが技術的な制約なく想像を現実にできる創作エコシステムの構築",
"missionTitle": "ミッション",
"missionDesc": "最先端モーションキャプチャー技術を通じてクリエイターのアイデアを生き生きとしたコンテンツに変換し、新しいデジタル体験を提供"
},
"history": {
"title": "沿革",
"date1": "2025年7月15日",
"event1Title": "Mingle Studio設立",
"event1Desc": "Mingle Studio会社設立",
"date2": "2025年8月1日",
"event2Title": "スタジオオープン",
"event2Desc": "OptiTrackシステム構築完了およびスタジオレンタルサービス開始"
},
"team": {
"title": "Our Team",
"desc": "各分野の専門家が協力してコンテンツ制作をサポートします",
"member1Name": "김희진",
"member1Role": "代表 / 3Dアーティスト",
"member1Desc": "背景・リソース制作、人事およびプロジェクト管理",
"member2Name": "김광진",
"member2Role": "CTO / テクニカルディレクター",
"member2Desc": "スタジオ全体の技術運営、モーションキャプチャー機材管理、音響システム、エンジンプログラミング",
"member3Name": "이승민",
"member3Role": "CCO / コンテンツディレクター",
"member3Desc": "キャプチャーディレクション、アクターモーションクリーンアップ、カメラムービング、パフォーマンス演出"
},
"partner": {
"title": "Partner Streamer",
"desc": "Mingle Studioと共にコンテンツを制作するクリエイター",
"streamer1Desc": "コミュニケーション、歌、ゲーム、VRChatなど多彩なコンテンツを披露するバーチャルストリーマー。SOOPを中心に活発に活動し、Mingle Studioのモーションキャプチャー技術と共に新しいバーチャルコンテンツを制作しています。"
},
"values": {
"title": "Core Values",
"desc": "Mingle Studioが目指すコアバリュー",
"collaboration": "コラボレーション",
"collaborationDesc": "技術者とクリエイターが共に生み出すシナジー",
"innovation": "イノベーション",
"innovationDesc": "最新技術で新しい創作の可能性を提示",
"creativity": "クリエイティビティ",
"creativityDesc": "想像を現実にするクリエイティブソリューション",
"quality": "クオリティ",
"qualityDesc": "最高水準のモーションキャプチャー品質の追求"
}
},
"services": {
"meta": {
"title": "サービス紹介 - Mingle Studio",
"description": "Mingle Studioのサービス紹介 - OptiTrackモーションキャプチャースタジオレンタル、2名200,000ウォン〜/時間、全身/フェイシャルキャプチャー、モーション録画専門",
"ogTitle": "サービス紹介 - Mingle Studio",
"ogDescription": "OptiTrackモーションキャプチャースタジオレンタルサービス。全身/フェイシャルキャプチャー専門"
},
"pageHeader": {
"title": "Services",
"desc": "最先端モーションキャプチャー施設と専門サービスを提供します"
},
"packages": {
"title": "サービスパッケージ",
"desc": "用途と規模に合った最適なモーションキャプチャー録画サービスを提供します",
"vatNotice": "※ 全ての料金は消費税別です"
},
"service1": {
"title": "サービス1：モーションキャプチャー録画サービス",
"badge": "ベーシック",
"team": "2名利用",
"teamPopular": "人気",
"teamPrice": "200,000ウォン",
"teamUnit": "/時間",
"teamFeature1": "2名同時モーション録画",
"teamFeature2": "キャラクター間インタラクション収録",
"teamFeature3": "チームプロジェクト協業",
"additional": "追加人数",
"additionalPrice": "+100,000ウォン",
"additionalUnit": "/名/時間",
"additionalFeature1": "最大5名同時録画",
"additionalFeature2": "多人数モーションキャプチャー",
"additionalFeature3": "グループ振付・演技収録",
"minPerson": "最小利用人数：2名",
"minTime": "最小利用時間：2時間",
"maxPerson": "最大同時利用：5名",
"techTitle": "提供技術およびサービス",
"tech1": "OptiTrack 30台カメラ",
"tech2": "リアルタイムアバター録画",
"tech3": "全身/フェイシャルキャプチャー",
"tech4": "リアルタイムモニタリング",
"tech5": "専門オペレーター",
"tech6": "モーションデータ提供",
"note": "アバターリターゲティングサービスは基本提供に含まれておらず、後続作業連携時に別途ご相談にて提供いたします。"
},
"combo": {
"title": "セットプラン",
"badge": "特化サービス",
"mvTitle": "ミュージックビデオ/ショートフォーム映像リアルタイム撮影",
"mvPrice": "モーションキャプチャーと同一料金",
"mvReqTitle": "追加要件",
"mvReq1": "企画書の事前協議必須",
"mvReq2": "キャラクター/背景/プロップの事前協議",
"mvReq3": "アクター手配が必要な場合：100,000ウォン（1名あたり1時間あたり）",
"mvPortfolio": "ポートフォリオを見る",
"remoteTitle": "リモート撮影",
"remotePrice": "モーションキャプチャーと同一料金",
"remoteServiceTitle": "サービス内容",
"remoteService1": "リモートリアルタイム撮影対応",
"remoteService2": "オンラインディレクション可能",
"remoteService3": "リアルタイムストリーミング配信",
"remoteExtraTitle": "追加料金",
"remoteExtra1": "アクター手配費：100,000ウォン（1名あたり1時間あたり）"
},
"service2": {
"title": "サービス2：ストリーミングルサービス",
"badge": "代表サービス",
"pkg4h": "4時間パッケージ",
"pkg4hBadge": "NEW",
"pkg4hPrice": "1,400,000ウォン",
"pkg4hUnit": "/ 1〜5名利用",
"pkg4hFeature1": "合計4時間利用",
"pkg4hFeature2": "レンタル2時間 + 撮影準備2時間",
"pkg4hFeature3": "6時間パッケージと同じ特典",
"pkg6h": "6時間パッケージ",
"pkg6hPrice": "2,000,000ウォン",
"pkg6hUnit": "/ 1〜5名利用",
"pkg6hFeature1": "合計6時間利用",
"pkg6hFeature2": "レンタル4時間 + 撮影準備2時間",
"pkg6hFeature3": "大規模プロジェクトに最適",
"commonLabel": "以下の特典は4時間・6時間パッケージ共通です",
"benefitsTitle": "共通特典",
"benefit1": "1名につきキャラクター1体の無料セッティング",
"benefit2": "既存保有背景から2つ無料セッティング",
"benefit3": "プロップ無料セッティング（新規プロップ最大6個、保有プロップ無制限）",
"benefit4": "モーションキャプチャー録画サービス",
"benefit5": "リアルタイム映像撮影",
"benefit6": "ライブ配信サービス",
"featuresTitle": "サービスの特徴",
"feature1": "大規模プロジェクト対応",
"feature2": "複合的な撮影環境の提供",
"feature3": "リアルタイムストリーミング（ストリーミングル専用）",
"feature4": "専門スタッフフルサービス",
"feature5": "1〜5名自由に選択可能",
"livePortfolio": "ライブ配信ポートフォリオを見る"
},
"service3": {
"title": "サービス3：ミュージックビデオ制作サービス",
"badge": "プレミアム",
"intro": "企画から納品まで、プロフェッショナルなミュージックビデオ制作の全工程をサポートします。",
"priceRange": "総予想費用：2,000,000ウォン〜4,000,000ウォン",
"priceNote1": "※ 上記費用は概算であり、プロジェクトの規模や要件により見積もりが変更される場合があります。",
"priceNote2": "※ 背景制作の範囲、ストーリーボード作家費用、アバター/プロップの数、演出の難易度により変動します。",
"processTitle": "制作プロセス（7ステップ）",
"step1Title": "企画相談（無料）",
"step1Desc": "ミュージックビデオ制作の開始段階として、コンセプトと雰囲気を整理します。",
"step1Note": "※ 方向性が明確であるほど、その後の制作がスムーズに進みます。",
"step2Title": "背景制作",
"step2Desc": "著作権の帰属先に応じてオプションを選択できます。",
"step2Opt1Type": "保有背景の使用",
"step2Opt1Price": "30,000ウォン/個",
"step2Opt1Note": "著作権：会社帰属",
"step2Opt2Type": "新規制作（会社帰属）",
"step2Opt2Price": "100,000ウォン/個",
"step2Opt2Note": "著作権：会社帰属（大型または特殊背景は制限される場合があります）",
"step2Opt3Type": "新規制作（クライアント帰属）",
"step2Opt3Price": "200,000ウォン〜1,000,000ウォン/個",
"step2Opt3Note": "著作権：クライアント所有（規模とディテールにより変動）",
"step2ProcessNote": "Unityビルドで納品され、カメラ視点の確認が可能",
"step3Title": "ストーリーボード作成",
"step3Price": "100,000ウォン〜",
"step3Desc": "外部の専門ライターがミュージックビデオの流れを具体化します。",
"step3Note": "※ お客様と共有し、演出やカメラカットを事前に確認・承認",
"step4Title": "アバターセッティング及びプロップ制作",
"step4AvatarLabel": "アバターセッティング：",
"step4AvatarPrice": "50,000ウォン/個",
"step4PropLabel": "ストーリー進行用プロップ：",
"step4PropPrice": "20,000ウォン/個",
"step4Desc": "アバターをミュージックビデオ環境に合わせて最適化します。",
"step4Note": "※ アバターの修正および最適化作業が可能",
"step5Title": "モーションキャプチャー",
"step5StudioLabel": "モーションキャプチャースタジオレンタル費用",
"step5Solo": "1名利用：",
"step5SoloPrice": "150,000ウォン/時間",
"step5Duo": "2名利用：",
"step5DuoPrice": "200,000ウォン/時間",
"step5Extra": "追加人数：",
"step5ExtraPrice": "+100,000ウォン/名/時間",
"step5ExtraNote": "（最大5名まで）",
"step5ActorLabel": "アクター手配費用",
"step5Actor": "アクター手配：",
"step5ActorPrice": "100,000ウォン/名/時間",
"step5Desc": "ストーリーボードを基にモーションを録画します。",
"step5Note1": "※ 撮影期間：1〜2日所要",
"step5Note2": "※ 最小利用：2時間",
"step6Title": "ルック開発 & 演出",
"step6Price": "500,000ウォン〜",
"step6Desc": "Unityでポストプロセシング、アートワーク、カメラワーキングなどを行います。",
"step6Note": "※ 演出の複雑さとクオリティにより変動",
"step7Title": "最終フィードバック & 納品",
"step7Desc": "完成した映像をお客様のフィードバックを反映し修正して最終納品します。",
"step7Note": "※ 納品形式：mp4/mov等",
"processNote": "企画相談（無料）→ 全体見積もり提示 → 見積もり承認後に制作開始（ステップ2〜7を順次進行）"
},
"options": {
"title": "追加オプション料金",
"desc": "全てのサービスパッケージに共通で適用される追加オプションです",
"vatNote": "*消費税別",
"charSetup": "キャラクターセッティング",
"charPrice": "50,000ウォン〜",
"charUnit": "/ 1名1体",
"charDesc": "新規キャラクターセッティング作業",
"bgSetup": "背景セッティング",
"bgExisting": "既存保有背景の使用",
"bgExistingPrice": "30,000ウォン〜",
"bgExistingUnit": "/ 1個",
"bgExistingNote": "セッティング費のみ",
"bgNew": "新規背景制作",
"bgNewPrice": "100,000ウォン〜",
"bgNewUnit": "/ 1個",
"bgNewNote": "セッティング費 + 制作費/購入費別途\nMingle Studioまたは依頼者帰属を選択可能です",
"propSetup": "プロップセッティング",
"propPrice": "20,000ウォン",
"propUnit": "/ 1個",
"propDesc": "プロップセッティング作業\n（ストリーミングルサービス：新規プロップ最大6個、保有プロップ無制限無料提供）"
},
"usage": {
"title": "ご利用案内",
"hours": "営業時間",
"hoursDesc": "基本営業時間：10:00〜22:00\n夜間利用時は料金1.5倍適用",
"minTime": "最小利用時間",
"minTimeDesc": "全サービス最低2時間\n（ストリーミングルサービスを除く）",
"preparation": "事前準備事項",
"preparationDesc": "ミュージックビデオ/ショートフォーム撮影時\n企画書および準備物の事前協議必須",
"followUp": "後続サービス",
"followUpDesc": "アバターリターゲティングは後続作業連携時にのみ\n提供されます（別途ご相談）"
},
"guide": {
"title": "サービスご利用案内",
"processTitle": "スタジオレンタル手続き",
"step1": "メールお問い合わせ",
"step1Desc": "予約フォームを記入してお問い合わせ",
"step2": "担当者確認および協議",
"step2Desc": "詳細事項の調整",
"step3": "全額お支払い",
"step3Desc": "お支払い完了",
"step4": "予約確定",
"step4Desc": "最終予約完了",
"btnEmail": "メールでお問い合わせ",
"btnNaver": "Naver予約へ",
"naverNote": "※ Naverプレイスでリアルタイムのスケジュール確認および予約が可能です"
},
"policy": {
"reservationTitle": "予約案内",
"reservation1": "スタジオの予約はご利用希望日の少なくとも2週間前までにお申し込みいただくことをお勧めします。",
"reservation2": "予約確定後、お客様のご都合による予約キャンセルの場合、規定に基づくキャンセル料が発生します。",
"visitTitle": "ご来場案内",
"visit1": "撮影前にモーションキャプチャースーツの着用等の準備が必要なため、撮影予定時刻の最低30分前にお越しください。（準備時間は利用時間に含まれません。）",
"visit2": "撮影時はメガネやイヤリングなど反射しやすい素材のアクセサリーの着用はできるだけお控えください。",
"refundTitle": "キャンセル・返金規定",
"refundColTime": "キャンセル時期",
"refundColRate": "返金率",
"refund7days": "予約日の7日前",
"refund100": "100%返金",
"refund3days": "予約日の3日前",
"refund70": "70%返金",
"refund1day": "予約日の1日前",
"refund50": "50%返金",
"refundSameDay": "当日キャンセル",
"refundNone": "返金不可"
}
},
"portfolio": {
"meta": {
"title": "ポートフォリオ - Mingle Studio",
"description": "Mingle Studioのポートフォリオ - モーションキャプチャーで制作されたYouTubeコンテンツ、VTuber配信、ショート映像コレクション",
"ogTitle": "ポートフォリオ - Mingle Studio",
"ogDescription": "モーションキャプチャースタジオで制作されたミュージックビデオ、ショートフォーム、VTuber配信など多彩な映像コンテンツ。OptiTrackで高品質モーションキャプチャーサービスを提供"
},
"pageHeader": {
"title": "Portfolio",
"desc": "Mingle Studioで制作・協業したモーションキャプチャーコンテンツ"
},
"channel": {
"title": "Mingle Studio公式チャンネル",
"desc": "最新のモーションキャプチャーコンテンツと制作過程をYouTubeでご確認ください",
"btn": "YouTubeチャンネルを訪問する"
},
"tabs": {
"individual": "個人クリエイター",
"corporate": "企業プロジェクト"
},
"longform": {
"title": "ロングフォームコンテンツ",
"desc": "個人クリエイターのモーションキャプチャープロジェクト"
},
"shorts": {
"title": "ショートコンテンツ",
"desc": "短くインパクトのあるモーションキャプチャーの瞬間"
},
"broadcast": {
"title": "リアルタイム配信事例",
"desc": "VTuberとストリーマーによるリアルタイムモーションキャプチャー配信",
"noticeTitle": "リアルタイムモーションキャプチャー配信",
"noticeDesc": "Mingle Studioで行われるリアルタイムモーションキャプチャー配信を通じて、高品質バーチャルコンテンツを体験してください"
},
"corporate": {
"title": "企業プロジェクト",
"desc": "企業および商業モーションキャプチャープロジェクト",
"ixiaDesc": "バーチャルアイドルグループのモーションキャプチャー制作",
"mvSection": "ミュージックビデオ制作",
"shortsSection": "ショートフォームビデオ制作",
"liveSection": "ライブ配信"
},
"cta": {
"title": "あなたのコンテンツもここに",
"desc": "Mingle Studioと共に次のポートフォリオの主人公になりましょう",
"btnInquiry": "プロジェクトのお問い合わせ",
"btnServices": "サービスを見る"
},
"js": {
"checkNetwork": "ネットワーク接続をご確認ください",
"shareTitle": "Mingle Studio ポートフォリオ",
"linkCopied": "動画リンクがクリップボードにコピーされました。",
"linkCopyFailed": "リンクのコピーに失敗しました。"
}
},
"gallery": {
"meta": {
"title": "スタジオギャラリー - Mingle Studio",
"description": "Mingle Studioギャラリー - モーションキャプチャースタジオの実際の空間と施設を写真でご確認ください",
"ogTitle": "スタジオギャラリー - Mingle Studio",
"ogDescription": "30台のOptiTrackカメラシステムと8×7m大型撮影空間。仁川唯一のモーションキャプチャースタジオの実際の施設と機材をご覧ください"
},
"pageHeader": {
"title": "Studio Gallery",
"desc": "Mingle Studioの実際の空間を写真でご覧ください"
},
"captions": {
"exterior_open": "外観 カーテン開放",
"exterior_closed": "外観 カーテン閉鎖",
"control_room": "オペレーティング/コントロールルーム",
"powder_room": "パウダールーム（スタジオ連結）",
"changing_room_in": "更衣室（内部）",
"changing_room_out": "更衣室（外部）",
"audio_system": "高品質オーディオシステム",
"mocap_space_1": "モーションキャプチャー空間 001",
"mocap_space_2": "モーションキャプチャー空間 002",
"mocap_space_3": "モーションキャプチャー空間 003",
"mocap_space_4": "モーションキャプチャー空間 004"
},
"panorama": {
"title": "360° Studio View",
"desc": "ドラッグしてスタジオを360度見渡してください",
"clickToView": "クリックして360° VRで体験する",
"curtainOpen": "スタジオ全景（カーテン開放）",
"curtainClosed": "スタジオ全景（カーテン閉鎖）"
},
"js": {
"lightboxLabel": "画像ビューアー",
"close": "閉じる",
"prevImage": "前の画像",
"nextImage": "次の画像",
"panoramaLoading": "360°画像を読み込み中...",
"reset": "リセット",
"autoRotate": "自動回転",
"stop": "停止",
"zoomIn": "拡大",
"zoomOut": "縮小",
"help": "ヘルプ",
"helpTitle": "360° 操作ガイド",
"helpDrag": "マウスドラッグで画面を回転できます",
"helpTouch": "タッチスクリーンでは指でドラッグしてください",
"helpZoom": "マウスホイールやピンチで拡大/縮小できます",
"helpAutoRotate": "自動回転ボタンで自動的に見回すことができます",
"helpEsc": "ESCキーで閉じることができます",
"checkImageFile": "画像ファイルをご確認ください"
}
},
"contact": {
"meta": {
"title": "お問い合わせ - Mingle Studio",
"description": "Mingle Studioへのお問い合わせ - モーションキャプチャースタジオレンタル、撮影、制作に関するお問い合わせとご相談",
"ogTitle": "お問い合わせ - Mingle Studio",
"ogDescription": "モーションキャプチャースタジオレンタル、撮影、制作に関するお問い合わせとご相談。仁川テクノバレー所在のOptiTrack専門スタジオ"
},
"pageHeader": {
"title": "Contact Us",
"desc": "Mingle Studioと一緒に特別なプロジェクトを始めましょう"
},
"phone": {
"title": "お電話でのお問い合わせ",
"desc": "24時間対応可能"
},
"business": {
"title": "ビジネスお問い合わせ",
"desc": "提携・協力に関するお問い合わせ"
},
"reservation": {
"title": "ご予約・お問い合わせ",
"desc": "24時間受付可能"
},
"visit": {
"title": "スタジオご訪問",
"desc": "事前予約必須",
"link": "所在地を見る"
},
"location": {
"title": "スタジオ所在地",
"address": "住所",
"addressValue": "(21330) 인천광역시 부평구 주부토로 236<br>인천테크노밸리 U1센터 A동 B105호",
"subway": "地下鉄",
"subwayDesc": "仁川7号線 カルサン駅下車 → 徒歩約7分",
"bus": "バス",
"busStop": "カルサン市場・カルサン図書館バス停をご利用ください",
"busRoutes": "4番、526番、555番バス",
"parking": "駐車場",
"parkingDesc": "基本2時間無料、建物内施設利用時最大4時間無料",
"hours": "営業時間",
"hours24": "24時間営業",
"hoursAllYear": "年中無休",
"naverMap": "Naver地図",
"googleMap": "Google マップ"
},
"cta": {
"title": "ご予約・お問い合わせ",
"desc": "簡単なオンライン予約またはよくある質問をご確認ください",
"btnNaver": "Naver予約",
"btnFaq": "FAQを見る"
},
"js": {
"checkInput": "入力情報をご確認ください。",
"sending": "送信中...",
"sendSuccess": "お問い合わせが正常に送信されました。まもなくご連絡いたします。",
"sendError": "送信中にエラーが発生しました。もう一度お試しください。",
"resetConfirm": "入力内容がすべて削除されます。続行しますか？",
"invalidEmail": "正しいメールアドレスを入力してください。",
"invalidPhone": "正しい電話番号を入力してください。",
"required": "必須入力項目です。"
}
},
"qna": {
"meta": {
"title": "よくある質問 - Mingle Studio",
"description": "Mingle StudioFAQ - モーションキャプチャースタジオレンタル、撮影、制作に関するよくある質問と回答",
"ogTitle": "よくある質問 - Mingle Studio",
"ogDescription": "モーションキャプチャースタジオレンタル、撮影、料金、予約に関するよくある質問と回答。OptiTrackシステム利用ガイド"
},
"pageHeader": {
"title": "よくある質問",
"desc": "Mingle Studioのご利用に関するよくある質問をご確認ください"
},
"search": {
"placeholder": "気になる内容を検索してください...",
"btnLabel": "検索"
},
"categories": {
"all": "全て",
"booking": "予約/レンタル",
"equipment": "機材/技術",
"pricing": "料金/お支払い",
"production": "制作/撮影",
"streaming": "ストリーミング",
"etc": "その他"
},
"faq": {
"q1": "スタジオレンタルはどのように予約しますか？",
"q2": "予約金制度と返金規定はありますか？",
"q3": "最小レンタル時間はどのくらいですか？",
"q4": "レンタルはどのくらい前に予約する必要がありますか？",
"q5": "現地でのお支払いは可能ですか？",
"q6": "税金計算書の発行は可能ですか？",
"q7": "どのようなモーションキャプチャー機材を使用していますか？",
"q8": "モーションキャプチャースーツは提供されますか？",
"q9": "何名まで同時にモーションキャプチャーが可能ですか？",
"q10": "お支払い方法はどうなっていますか？",
"q11": "撮影の準備物は何が必要ですか？",
"q12": "データはどのような形式で受け取れますか？",
"q13": "リアルタイムストリーミングは可能ですか？",
"q14": "駐車場はありますか？",
"q15": "見学や施設ツアーは可能ですか？",
"a1": "<p>以下の方法でご予約いただけます：</p>\n<ul>\n<li><strong><i class=\"fa-solid fa-envelope\" aria-hidden=\"true\"></i> メール：</strong> <a href=\"mailto:help@minglestudio.co.kr?subject=[スタジオ予約お問い合わせ] Mingle Studio&body=こんにちは。Mingle Studioのレンタル予約についてお問い合わせいたします。%0A%0A■ 基本情報%0A- ご利用予定日：（例：2024年12月25日）%0A- ご利用時間：（例：午後2時〜4時、2時間）%0A- 参加人数：名%0A- ご連絡先：%0A- メール：%0A%0A■ 撮影情報%0A- 撮影目的：（例：VTuber配信、ゲーム制作、映像コンテンツなど）%0A- 撮影予定内容：%0A- 必要な機材：（全身モーションキャプチャー/フェイシャルキャプチャー/その他）%0A%0A■ 追加リクエスト%0A- 特別なご要望：%0A- ご質問：%0A%0A■ 参考情報%0A- 最小レンタル：2時間（220,000ウォン、VAT込み）%0A- 延長：1時間あたり110,000ウォン%0A- お支払い方法：銀行振込または現金（カード決済不可）%0A- 現金領収書/税金計算書発行可能%0A%0A早急にご返答いたします。%0Aよろしくお願いいたします。\">help@minglestudio.co.kr</a></li>\n<li><strong><i class=\"fa-solid fa-phone\" aria-hidden=\"true\"></i> お電話：</strong> 010-9288-9190</li>\n<li><strong><i class=\"fa-solid fa-calendar\" aria-hidden=\"true\"></i> Naver予約：</strong> <a href=\"https://m.booking.naver.com/booking/10/bizes/1468174/items/6949481\" target=\"_blank\">Naverプレイス リアルタイム予約</a></li>\n</ul>\n<div style=\"margin-top: var(--spacing-md); text-align: center;\">\n<button id=\"showEmailFormFAQ\" class=\"btn btn-primary\" style=\"font-size: 0.9rem; padding: 0.5rem 1rem;\"><i class=\"fa-solid fa-envelope\" aria-hidden=\"true\"></i> メールでお問い合わせ</button>\n</div>\n<div id=\"emailFormFAQ\" class=\"email-form\" style=\"display:none; margin-top: var(--spacing-lg); padding: var(--spacing-lg); border: 1px solid #ddd; border-radius: var(--border-radius); background: #f9f9f9;\">\n<h4>メールお問い合わせフォーム</h4>\n<p>以下のフォームをコピーしてメールでお問い合わせください：</p>\n<div class=\"email-template\" style=\"background: white; padding: var(--spacing-md); border-radius: var(--border-radius); font-family: monospace; font-size: 0.9rem; line-height: 1.6;\">\n<div><strong>件名：</strong> [スタジオレンタルお問い合わせ]</div>\n<div><strong>宛先：</strong> help@minglestudio.co.kr</div>\n<br>\n<div><strong>1. お名前と所属</strong></div>\n<div style=\"color: #666; font-size: 0.85rem;\">（個人の場合はお名前のみ、企業の場合はご利用者のお名前と所属をご記入ください）</div>\n<div style=\"margin: 0.5rem 0; padding: 0.5rem; background: #f0f0f0; border-radius: 4px;\">[こちらにご記入ください]</div>\n<div><strong>2. ご連絡先</strong></div>\n<div style=\"color: #666; font-size: 0.85rem;\">（電話番号、メール、Discordのいずれか）</div>\n<div style=\"margin: 0.5rem 0; padding: 0.5rem; background: #f0f0f0; border-radius: 4px;\">[こちらにご記入ください]</div>\n<div><strong>3. ご利用人数</strong></div>\n<div style=\"color: #666; font-size: 0.85rem;\">（1〜2名推奨、最大5名まで可能）</div>\n<div style=\"margin: 0.5rem 0; padding: 0.5rem; background: #f0f0f0; border-radius: 4px;\">\u25a1 1名 \u25a1 2名 \u25a1 3名 \u25a1 4名 \u25a1 5名</div>\n<div><strong>4. スタジオ使用目的</strong></div>\n<div style=\"margin: 0.5rem 0; padding: 0.5rem; background: #f0f0f0; border-radius: 4px;\">\u25a1 録画 \u25a1 その他：[こちらにご記入ください]</div>\n<div><strong>5. ご希望レンタル日</strong></div>\n<div style=\"color: #666; font-size: 0.85rem;\">※ 最低2週間前のご予約を推奨します</div>\n<div style=\"margin: 0.5rem 0; padding: 0.5rem; background: #f0f0f0; border-radius: 4px;\">[こちらにご記入ください]</div>\n<div><strong>6. ご希望利用時間</strong></div>\n<div style=\"color: #666; font-size: 0.85rem;\">※ 回答例）午前10時〜午後3時（5時間）</div>\n<div style=\"color: #666; font-size: 0.85rem;\">※ 深夜レンタル（夜10時〜翌朝8時）は内部規定による特別料金が適用されます</div>\n<div style=\"margin: 0.5rem 0; padding: 0.5rem; background: #f0f0f0; border-radius: 4px;\">[こちらにご記入ください]</div>\n</div>\n<div style=\"margin-top: var(--spacing-md); text-align: center;\">\n<a href=\"mailto:help@minglestudio.co.kr?subject=[スタジオレンタルお問い合わせ]\" class=\"btn btn-primary\"><i class=\"fa-solid fa-envelope\" aria-hidden=\"true\"></i> メールを送る</a>\n</div>\n</div>\n<p>最低2週間前にご連絡いただければスムーズに準備が可能です。</p>",
"a2": "<p>以下が返金規定です：</p>\n<div class=\"policy-table\">\n<div class=\"policy-row\">\n<span class=\"policy-time\">予約日の7日前</span>\n<span class=\"policy-desc\">100% 返金</span>\n</div>\n<div class=\"policy-row\">\n<span class=\"policy-time\">予約日の3日前</span>\n<span class=\"policy-desc\">70% 返金</span>\n</div>\n<div class=\"policy-row\">\n<span class=\"policy-time\">予約日の1日前</span>\n<span class=\"policy-desc\">50% 返金</span>\n</div>\n<div class=\"policy-row\">\n<span class=\"policy-time\">当日キャンセル</span>\n<span class=\"policy-desc\">返金不可</span>\n</div>\n</div>",
"a3": "<p>最小レンタルは<strong>2時間</strong>からとなります。</p>\n<p>延長は1時間単位で可能です。</p>",
"a4": "<p>最低2週間前にご連絡いただければスムーズに準備が可能です。</p>",
"a5": "<p>現地では現金またはお振込みでのお支払いが可能です。</p>\n<p>カード決済は現地ではご利用いただけませんのでご了承ください。</p>\n<p>現金領収書および税金計算書の発行が可能です。</p>",
"a6": "<p>はい、発行可能です。</p>",
"a7": "<p>Mingle Studioは以下の専門機材を保有しています：</p>\n<ul>\n<li><strong>OptiTrack カメラ：</strong> 30台</li>\n<li><strong>ハンドトラッキング：</strong> Rokokoスマートグローブ使用中</li>\n</ul>",
"a8": "<p>はい、専門のモーションキャプチャースーツとマーカーを無料で提供しています。</p>\n<ul>\n<li>各種サイズ（S、M、L、XL）を用意</li>\n<li>衛生的な管理で清潔な状態を維持</li>\n<li>個人のスーツの持ち込みも可能</li>\n<li>グローブ、ヘッドバンドなどの付属品を含む</li>\n</ul>",
"a9": "<p>最大<strong>5名</strong>まで同時にモーションキャプチャーが可能です。</p>\n<p>人数別の詳細情報：</p>\n<ul>\n<li><strong>1名：</strong> 最高精度でのキャプチャー</li>\n<li><strong>2名：</strong> インタラクションシーンに最適</li>\n<li><strong>3-5名：</strong> グループパフォーマンス可能</li>\n</ul>\n<p>人数が多いほどキャプチャー空間と精度に制約が生じる場合があります。</p>",
"a10": "<p>以下のお支払い方法をご利用いただけます：</p>\n<ul>\n<li><strong>お振込み：</strong> ご予約確定後24時間以内</li>\n<li><strong>現金決済：</strong> 現地でのお支払い可能</li>\n<li><strong>カード決済：</strong> 現地ではご利用不可</li>\n<li><strong>税金計算書：</strong> 法人のお客様向けに発行可能</li>\n<li><strong>現金領収書：</strong> 個人のお客様向けに発行可能</li>\n</ul>\n<p>予約金（30%）はご予約確定時、残金（70%）は撮影当日にお支払いいただけます。</p>",
"a11": "<p>基本的に以下の準備が必要です：</p>\n<ul>\n<li><strong>靴：</strong> 靴下の着用必須</li>\n<li><strong>メガネ：</strong> メガネ着用不可（コンタクトレンズ推奨）</li>\n<li><strong>髪：</strong> 長い髪はまとめてください</li>\n<li><strong>アクセサリー：</strong> 時計、指輪などは外してください</li>\n<li><strong>メイク：</strong> 濃いメイクはお控えください</li>\n</ul>\n<p>モーションキャプチャースーツとマーカーはスタジオで提供いたします。</p>",
"a12": "<p>以下の形式でデータを提供いたします：</p>\n<ul>\n<li><strong>FBXファイル：</strong> Unity、Unreal Engine対応</li>\n<li><strong>ANIMファイル：</strong> Unity Animatorに直接対応</li>\n<li><strong>MP4映像：</strong> 参考用映像</li>\n</ul>\n<p>お問い合わせ時に詳細をご案内いたします。データはクラウドを通じてお届けします。</p>",
"a13": "<p><strong>はい、ストリーミングルサービスを通じてリアルタイムストリーミングが可能です。</strong></p>\n<p>モーションキャプチャーデータをリアルタイムで配信し、ライブ配信にご活用いただけます。</p>\n<p>詳細はServicesページのストリーミングルサービスの項目をご参照ください。</p>",
"a14": "<p>はい、駐車が可能です：</p>\n<ul>\n<li><strong>基本：</strong> 2時間無料</li>\n<li><strong>建物内施設ご利用時：</strong> 追加2時間、最大4時間無料</li>\n<li><strong>場所：</strong> 仁川テクノバレービル駐車場</li>\n</ul>",
"a15": "<p>見学やツアーは事前のお問い合わせにより可否をご確認いただく必要があります：</p>\n<ul>\n<li><strong>事前お問い合わせ：</strong> 必須（スタジオの事情によりお断りする場合があります）</li>\n<li><strong>お問い合わせ先：</strong> help@minglestudio.co.kr</li>\n<li><strong>見学時間：</strong> 承認時に協議（約30分）</li>\n<li><strong>費用：</strong> 無料</li>\n</ul>\n<p>スタジオの運営状況により見学が制限される場合がありますのでご了承ください。</p>"
},
"cta": {
"title": "お探しの回答が見つかりませんでしたか？",
"desc": "ご不明な点がございましたら、いつでもお問い合わせください",
"btnContact": "お問い合わせ",
"btnCall": "電話相談"
}
},
"error404": {
"meta": {
"title": "ページが見つかりません - Mingle Studio"
},
"title": "ページが見つかりません",
"desc": "申し訳ございません。お探しのページが存在しないか、移動された可能性があります。<br>以下のリンクからお探しの情報を見つけてください。",
"btnHome": "ホームに戻る",
"btnContact": "お問い合わせ",
"searchPlaceholder": "お探しの内容を検索してください...",
"helpfulLinks": "お役に立てるページ",
"linkAbout": "会社紹介",
"linkServices": "サービス案内",
"linkPortfolio": "ポートフォリオ",
"linkGallery": "スタジオギャラリー",
"linkQna": "よくある質問",
"linkContact": "連絡先・所在地"
}
}

710
i18n/ko.json Normal file
View File

@ -0,0 +1,710 @@
{
"header": {
"studioName": "밍글 스튜디오",
"nav": {
"about": "About",
"services": "Services",
"portfolio": "Portfolio",
"gallery": "Gallery",
"contact": "Contact",
"qna": "Q&A"
},
"menuOpen": "메뉴 열기",
"menuClose": "메뉴 닫기",
"darkMode": "다크 모드 전환",
"lightMode": "라이트 모드로 전환",
"langSelect": "언어 선택"
},
"footer": {
"companyInfo": "회사 정보",
"companyName": "밍글 스튜디오",
"ceo": "대표: 김희진",
"businessNumber": "사업자등록번호: 208-12-73755",
"contact": "연락처",
"businessInquiry": "비즈니스 문의",
"reservationInquiry": "예약 문의",
"directions": "오시는 길",
"address": "인천광역시 부평구 주부토로 236",
"addressDetail": "인천테크노밸리 U1센터 A동 B105호",
"copyright": "© 2025 밍글 스튜디오. All rights reserved."
},
"common": {
"loading": "페이지를 불러오는 중...",
"componentLoading": "로딩 중...",
"skipToContent": "본문 바로가기",
"videoLoading": "비디오 로딩 중...",
"videoError": "비디오를 로드할 수 없습니다",
"imageError": "이미지를 불러올 수 없습니다"
},
"index": {
"meta": {
"title": "밍글 스튜디오 - 모션캡쳐 창작 스튜디오",
"description": "최첨단 OptiTrack 시스템과 전문 장비를 갖춘 모션캡쳐 스튜디오. 인천 테크노밸리에서 버추얼 콘텐츠의 새로운 가능성을 경험하세요.",
"ogTitle": "밍글 스튜디오 - 모션캡쳐 창작 스튜디오",
"ogDescription": "최첨단 OptiTrack 시스템과 전문 장비를 갖춘 모션캡쳐 스튜디오"
},
"hero": {
"title": "밍글스튜디오",
"subtitle": "MINGLE STUDIO",
"description": "기술과 창의력 열정이 한데 섞여<br>새로운 가치가 만들어지는 공간",
"btnAbout": "회사 소개 보기",
"btnContact": "예약 문의하기",
"specCamera": "OptiTrack 카메라",
"specCameraUnit": "대",
"specSpace": "캡쳐 공간",
"specPrice": "시간당 대관료",
"specPriceUnit": "만원"
},
"showcase": {
"step1": {
"label": "Equipment",
"title": "최첨단 모션캡쳐 시스템",
"desc": "OptiTrack 광학식 카메라, Rokoko 글러브, ARKit 페이셜 캡쳐까지 — 전신부터 손끝, 표정까지 정밀하게 트래킹합니다.",
"feature1Title": "OptiTrack 카메라 30대",
"feature1Desc": "서브밀리미터 수준 광학식 모션 트래킹",
"feature2Title": "Rokoko 글러브 5대",
"feature2Desc": "손가락 관절까지 정밀한 핸드 캡쳐",
"feature3Title": "ARKit 페이셜 캡쳐 (iPhone 5대)",
"feature3Desc": "iPhone 기반 고정밀 표정 캡쳐"
},
"step2": {
"label": "Space",
"title": "넓고 최적화된 캡쳐 공간",
"desc": "8m x 7m x 2.6m 규모의 전용 캡쳐 볼륨으로 자유로운 움직임이 가능합니다.",
"feature1Title": "8m × 7m × 2.6m",
"feature1Desc": "넓은 전용 캡쳐 볼륨",
"feature2Title": "실시간 스트리밍",
"feature2Desc": "스트리밍글 서비스로 라이브 방송"
},
"step3": {
"label": "Services",
"title": "주요 활용 분야",
"desc": "다양한 크리에이티브 프로젝트를 전문 오퍼레이터가 지원합니다.",
"virtual": "버추얼 콘텐츠",
"virtualSub": "VTuber, 버추얼 아이돌",
"game": "게임 개발",
"gameSub": "캐릭터 애니메이션",
"video": "영상 제작",
"videoSub": "VFX, 버추얼 프로덕션",
"metaverse": "메타버스",
"metaverseSub": "3D 아바타 콘텐츠",
"btnServices": "전체 서비스 보기"
},
"step4": {
"label": "Studio",
"title": "스튜디오 공간",
"desc": "메인 캡쳐 공간부터 컨트롤룸, 프라이빗 룸까지 모든 환경이 갖춰져 있습니다. 전문 기술 지원과 함께 최적의 캡쳐 경험을 제공합니다.",
"feature1Title": "전문 기술 지원",
"feature1Desc": "숙련된 오퍼레이터의 실시간 서포트",
"feature2Title": "프라이빗 환경",
"feature2Desc": "독립된 공간에서 집중 작업",
"btnGallery": "갤러리 보기"
}
},
"portfolio": {
"title": "포트폴리오",
"desc": "밍글 스튜디오에서 제작하고 협업한 모션캡쳐 콘텐츠",
"tabCreator": "개인 크리에이터",
"tabCorporate": "기업 프로젝트",
"tabShorts": "Shorts",
"btnMore": "전체 포트폴리오 보기 →"
},
"partner": {
"title": "파트너 스트리머",
"desc": "밍글 스튜디오와 함께 콘텐츠를 만드는 크리에이터",
"streamer1": {
"desc": "떼굴떼굴 구슬요! 소통, 노래, 게임, VRChat 등 다양한 콘텐츠를 선보이는 버츄얼 스트리머",
"tagSong": "노래",
"tagGame": "게임"
}
},
"creatorSigns": {
"title": "방문 크리에이터",
"desc": "밍글 스튜디오를 방문한 크리에이터들의 사인"
},
"clients": {
"title": "클라이언트",
"desc": "다양한 분야의 기업들과 함께 혁신적인 모션캡쳐 콘텐츠를 제작합니다"
},
"faqShortcut": {
"label": "FAQ",
"title": "처음이라 막막하신가요?",
"desc": "모션캡쳐가 처음이어도 괜찮습니다. 예약부터 촬영까지 자주 묻는 질문을 정리했어요.",
"btnFaq": "자주 묻는 질문 보기",
"btnContact": "1:1 문의하기"
},
"cta": {
"label": "Get Started",
"title": "당신의 아이디어,<br>움직임으로 만들어 드립니다",
"desc": "전문 모션캡쳐 스튜디오에서 크리에이티브의 새로운 가능성을 경험하세요",
"btnReserve": "예약 문의하기",
"btnNaver": "네이버 예약",
"infoReservation": "예약 문의",
"infoBusiness": "비즈니스",
"infoDirections": "오시는 길",
"infoAddress": "인천 부평구 주부토로 236, 인천테크노밸리"
},
"popup": {
"title": "요금제 변경 안내",
"subtitle": "2026년 3월부터 적용되었습니다",
"badge": "시행 중",
"mainChanges": "주요 변경사항",
"discountEnd": "할인 이벤트 종료",
"discountEndDesc": "오픈 기념 20% 할인 이벤트가 <strong>2월 28일</strong>부로 종료되었으며, 현재 정상가가 적용되고 있습니다.",
"streaming4h": "스트리밍글 4시간 서비스 신설",
"streaming4hDesc": "기존 스트리밍글 서비스(6시간)와 동일한 혜택을 4시간 패키지로 이용할 수 있습니다.",
"referral": "추천인 제도 오픈",
"referralDesc": "친구를 소개하면 소개한 분, 소개받은 분 모두에게 <strong>20% 할인권</strong>을 드립니다. (1회 사용, 중복 적용 불가)",
"notice": "※ 변경된 요금이 서비스 페이지에 반영되었습니다",
"effectiveDate": "적용 시기",
"effectiveDateValue": "2026년 3월~",
"inquiryEmail": "문의 메일",
"ctaBtn": "현재 서비스 요금 보기 →",
"dontShowToday": "하루동안 보지 않기",
"close": "닫기"
}
},
"about": {
"meta": {
"title": "회사소개 - 밍글 스튜디오",
"description": "밍글 스튜디오는 기술과 창의력이 어우러진 모션캡쳐 창작 공간입니다. 2025년 설립, 인천 테크노밸리 위치.",
"ogTitle": "회사소개 - 밍글 스튜디오",
"ogDescription": "2025년 설립된 인천 유일의 모션캡처 전문 스튜디오. 기술과 창의력이 어우러진 버추얼 콘텐츠 창작 공간입니다"
},
"pageHeader": {
"title": "About Us",
"desc": "기술과 창의력, 열정이 한데 섞여 새로운 가치가 만들어지는 공간"
},
"info": {
"companyName": "회사명",
"companyNameValue": "밍글 스튜디오 (Mingle Studio)",
"foundingDate": "설립일",
"foundingDateValue": "2025년 7월 15일",
"slogan": "슬로건",
"sloganValue": "\"모두가 어우러진 즐거운 창작공간\"",
"meaning": "의미",
"meaningValue": "Mingle Studio는 기술자와 크리에이터 그리고 시청자가 함께 어우러지는 버추얼 콘텐츠 제작 공간입니다. 최첨단 광학식 모션캡처 기술로 버추얼 캐릭터의 살아 숨쉬는 감정과 움직임을 담아 새로운 세대의 디지털 퍼포먼스를 실현합니다."
},
"companyIntro": {
"title": "회사 소개",
"desc1": "밍글 스튜디오는 창작자와 기술, 사람과 사람 사이의 '어우러짐'을 통해 새로운 콘텐츠를 만들어가는 모션 캡쳐 기반의 창작 공간입니다.",
"desc2": "설립 이후, 누구나 편하게 사용 가능한 스튜디오 대관 서비스를 중심으로 버추얼 콘텐츠 제작 환경을 제공합니다."
},
"visionMission": {
"title": "비전 & 미션",
"visionTitle": "비전",
"visionDesc": "모든 창작자가 기술적 제약 없이 상상을 현실로 만들 수 있는 창작 생태계 구축",
"missionTitle": "미션",
"missionDesc": "최첨단 모션캡쳐 기술을 통해 창작자들의 아이디어를 생생한 콘텐츠로 변환하고, 새로운 디지털 경험을 제공"
},
"history": {
"title": "연혁",
"date1": "2025년 7월 15일",
"event1Title": "밍글 스튜디오 설립",
"event1Desc": "밍글 스튜디오 회사 설립",
"date2": "2025년 8월 1일",
"event2Title": "스튜디오 오픈",
"event2Desc": "OptiTrack 시스템 구축 완료 및 대관 서비스 시작"
},
"team": {
"title": "Our Team",
"desc": "각 분야의 전문가들이 함께 협업하며 콘텐츠 제작을 지원합니다",
"member1Name": "김희진",
"member1Role": "대표 / 3D 아티스트",
"member1Desc": "배경/리소스 제작, 인사 및 프로젝트 관리",
"member2Name": "김광진",
"member2Role": "CTO / 테크니컬 디렉터",
"member2Desc": "스튜디오 전체 기술 운영, 모션캡쳐 장비 관리, 음향 시스템, 엔진 프로그래밍",
"member3Name": "이승민",
"member3Role": "CCO / 콘텐츠 디렉터",
"member3Desc": "캡쳐 디렉팅, 배우 모션 클린업, 카메라 무빙, 퍼포먼스 연출"
},
"partner": {
"title": "Partner Streamer",
"desc": "밍글 스튜디오와 함께 콘텐츠를 만드는 크리에이터",
"streamer1Desc": "소통, 노래, 게임, VRChat 등 다채로운 콘텐츠를 선보이는 버츄얼 스트리머. SOOP을 중심으로 활발하게 활동하며 밍글 스튜디오의 모션캡처 기술과 함께 새로운 버츄얼 콘텐츠를 만들어갑니다."
},
"values": {
"title": "Core Values",
"desc": "밍글 스튜디오가 추구하는 핵심 가치",
"collaboration": "협업",
"collaborationDesc": "기술자와 창작자가 함께 만드는 시너지",
"innovation": "혁신",
"innovationDesc": "최신 기술로 새로운 창작의 가능성 제시",
"creativity": "창의성",
"creativityDesc": "상상을 현실로 만드는 창의적 솔루션",
"quality": "품질",
"qualityDesc": "최고 수준의 모션캡쳐 퀄리티 추구"
}
},
"services": {
"meta": {
"title": "서비스 소개 - 밍글 스튜디오",
"description": "밍글 스튜디오 서비스 소개 - OptiTrack 모션캡쳐 스튜디오 대관, 2인 200,000원~/시간, 전신/페이셜 캡쳐, 모션 녹화 전문",
"ogTitle": "서비스 소개 - 밍글 스튜디오",
"ogDescription": "OptiTrack 모션캡쳐 스튜디오 대관 서비스. 전신/페이셜 캡쳐 전문"
},
"pageHeader": {
"title": "Services",
"desc": "최첨단 모션캡쳐 시설과 전문 서비스를 제공합니다"
},
"packages": {
"title": "서비스 패키지",
"desc": "용도와 규모에 맞는 최적의 모션캡처 녹화 서비스를 제공합니다",
"vatNotice": "※ 모든 가격은 부가세 별도입니다"
},
"service1": {
"title": "서비스 1: 모션캡처 녹화 서비스",
"badge": "기본형",
"team": "2인 이용",
"teamPopular": "인기",
"teamPrice": "200,000원",
"teamUnit": "/시간",
"teamFeature1": "2인 동시 모션 녹화",
"teamFeature2": "캐릭터 간 인터랙션 수록",
"teamFeature3": "팀 프로젝트 협업",
"additional": "추가 인원",
"additionalPrice": "+100,000원",
"additionalUnit": "/명/시간",
"additionalFeature1": "최대 5인 동시 녹화",
"additionalFeature2": "다인원 모션 캡쳐",
"additionalFeature3": "그룹 안무·연기 수록",
"minPerson": "최소 이용 인원: 2인",
"minTime": "최소 이용시간: 2시간",
"maxPerson": "최대 동시 이용: 5인",
"techTitle": "제공 기술 및 서비스",
"tech1": "OptiTrack 30대 카메라",
"tech2": "실시간 아바타 녹화",
"tech3": "전신/페이셜 캡처",
"tech4": "실시간 모니터링",
"tech5": "전문 오퍼레이터",
"tech6": "모션 데이터 제공",
"note": "아바타 리타게팅 서비스는 기본 제공되지 않으며, 후속 작업 연계 시 별도 상담을 통해 제공합니다."
},
"combo": {
"title": "결합상품",
"badge": "특화서비스",
"mvTitle": "뮤직비디오/숏폼 영상 실시간 촬영",
"mvPrice": "모션캡처와 동일 요금",
"mvReqTitle": "추가 요구사항",
"mvReq1": "기획서 사전 협의 필수",
"mvReq2": "캐릭터/배경/프랍 사전 협의",
"mvReq3": "액터 섭외 필요 시: 100,000원 (1명당 시간당)",
"mvPortfolio": "포트폴리오 보기",
"remoteTitle": "원격 촬영",
"remotePrice": "모션캡처와 동일 요금",
"remoteServiceTitle": "서비스 내용",
"remoteService1": "원격 실시간 촬영 지원",
"remoteService2": "온라인 디렉션 가능",
"remoteService3": "실시간 스트리밍 송출",
"remoteExtraTitle": "추가 요금",
"remoteExtra1": "액터 섭외비: 100,000원 (1명당 시간당)"
},
"service2": {
"title": "서비스 2: 스트리밍글 서비스",
"badge": "대표상품",
"pkg4h": "4시간 패키지",
"pkg4hBadge": "NEW",
"pkg4hPrice": "1,400,000원",
"pkg4hUnit": "/ 1~5인 사용",
"pkg4hFeature1": "총 4시간 이용",
"pkg4hFeature2": "대관 2시간 + 촬영 준비 2시간",
"pkg4hFeature3": "6시간 패키지와 동일한 혜택",
"pkg6h": "6시간 패키지",
"pkg6hPrice": "2,000,000원",
"pkg6hUnit": "/ 1~5인 사용",
"pkg6hFeature1": "총 6시간 이용",
"pkg6hFeature2": "대관 4시간 + 촬영 준비 2시간",
"pkg6hFeature3": "대규모 프로젝트에 적합",
"commonLabel": "아래 혜택은 4시간·6시간 패키지 모두에 포함됩니다",
"benefitsTitle": "공통 포함 혜택",
"benefit1": "1인당 1벌 캐릭터 무료 세팅",
"benefit2": "기존 보유 배경 중 2개 무료 세팅",
"benefit3": "프랍 무료 세팅 (신규 프랍 최대 6개, 보유 프랍 무제한)",
"benefit4": "모션캡처 녹화 서비스",
"benefit5": "실시간 영상 촬영",
"benefit6": "라이브 방송 서비스",
"featuresTitle": "서비스 특징",
"feature1": "대규모 프로젝트 지원",
"feature2": "복합적 촬영 환경 제공",
"feature3": "실시간 스트리밍 (스트리밍글 전용)",
"feature4": "전문 스태프 풀 서비스",
"feature5": "1~5인 자유롭게 선택 가능",
"livePortfolio": "라이브 방송 포트폴리오 보기"
},
"service3": {
"title": "서비스 3: 뮤직비디오 제작 서비스",
"badge": "프리미엄",
"intro": "기획부터 납품까지, 전문적인 뮤직비디오 제작의 전 과정을 지원합니다.",
"priceRange": "총 예상 비용: 2,000,000원 ~ 4,000,000원",
"priceNote1": "※ 위 비용은 대략적인 예상 금액이며, 프로젝트 규모와 요구사항에 따라 견적이 변경될 수 있습니다.",
"priceNote2": "※ 배경 제작 범위, 스토리보드 작가 비용, 아바타/프랍 개수, 연출 난이도에 따라 변동됩니다.",
"processTitle": "제작 프로세스 (7단계)",
"step1Title": "기획 상담 (무료)",
"step1Desc": "뮤직비디오 제작의 시작 단계로, 콘셉트와 분위기를 정리합니다.",
"step1Note": "※ 방향성이 명확해야 이후 제작이 원활하게 진행됩니다.",
"step2Title": "배경 제작",
"step2Desc": "저작권 귀속 여부에 따라 옵션을 선택할 수 있습니다.",
"step2Opt1Type": "보유 배경 사용",
"step2Opt1Price": "30,000원/개",
"step2Opt1Note": "저작권: 회사 귀속",
"step2Opt2Type": "신규 제작 (회사 귀속)",
"step2Opt2Price": "100,000원/개",
"step2Opt2Note": "저작권: 회사 귀속 (대형 또는 특수 배경은 제한될 수 있음)",
"step2Opt3Type": "신규 제작 (클라이언트 귀속)",
"step2Opt3Price": "200,000원 ~ 1,000,000원/개",
"step2Opt3Note": "저작권: 클라이언트 소유 (규모와 디테일에 따라 변동)",
"step2ProcessNote": "Unity 빌드로 전달되어 카메라 시점 확인 가능",
"step3Title": "스토리보드 작성",
"step3Price": "100,000원~",
"step3Desc": "외부 전문 작가가 뮤직비디오의 흐름을 구체화합니다.",
"step3Note": "※ 고객과 공유하여 연출과 카메라 컷을 사전 확인 및 컨펌",
"step4Title": "아바타 세팅 및 프랍 제작",
"step4AvatarLabel": "아바타 세팅:",
"step4AvatarPrice": "50,000원/개",
"step4PropLabel": "스토리 진행용 프랍:",
"step4PropPrice": "20,000원/개",
"step4Desc": "아바타를 뮤직비디오 환경에 맞게 최적화합니다.",
"step4Note": "※ 아바타 수정 및 최적화 작업 가능",
"step5Title": "모션 캡처",
"step5StudioLabel": "모션캡처 스튜디오 대관 비용",
"step5Solo": "1인 이용:",
"step5SoloPrice": "150,000원/시간",
"step5Duo": "2인 이용:",
"step5DuoPrice": "200,000원/시간",
"step5Extra": "추가 인원:",
"step5ExtraPrice": "+100,000원/명/시간",
"step5ExtraNote": "(최대 5인까지)",
"step5ActorLabel": "액터 섭외 비용",
"step5Actor": "액터 섭외:",
"step5ActorPrice": "100,000원/명/시간",
"step5Desc": "스토리보드를 기반으로 모션을 녹화합니다.",
"step5Note1": "※ 촬영 기간: 1~2일 소요",
"step5Note2": "※ 최소 이용: 2시간",
"step6Title": "룩 개발 & 연출",
"step6Price": "500,000원~",
"step6Desc": "Unity에서 포스트 프로세싱, 아트워크, 카메라 워킹 등을 진행합니다.",
"step6Note": "※ 연출 복잡도와 퀄리티에 따라 변동",
"step7Title": "최종 피드백 & 납품",
"step7Desc": "완성된 영상을 고객 피드백 반영 후 수정하여 최종 납품합니다.",
"step7Note": "※ 납품 형식: mp4/mov 등",
"processNote": "기획 상담(무료) → 전체 견적 제시 → 견적 승인 후 제작 시작 (2단계~7단계 순차 진행)"
},
"options": {
"title": "추가 옵션 요금",
"desc": "모든 서비스 패키지에 공통으로 적용되는 추가 옵션입니다",
"vatNote": "*부가세 별도",
"charSetup": "캐릭터 세팅",
"charPrice": "50,000원~",
"charUnit": "/ 1인 1벌",
"charDesc": "신규 캐릭터 세팅 작업",
"bgSetup": "배경 세팅",
"bgExisting": "기존 보유 배경 사용",
"bgExistingPrice": "30,000원~",
"bgExistingUnit": "/ 1개",
"bgExistingNote": "세팅비만 부과",
"bgNew": "신규 배경 제작",
"bgNewPrice": "100,000원~",
"bgNewUnit": "/ 1개",
"bgNewNote": "세팅비 + 제작비/구입비 별도\n밍글스튜디오 또는 의뢰자 귀속 선택 가능합니다",
"propSetup": "프랍 세팅",
"propPrice": "20,000원",
"propUnit": "/ 1개",
"propDesc": "프랍 세팅 작업\n(스트리밍글 서비스: 신규 프랍 최대 6개, 보유 프랍 무제한 무료 제공)"
},
"usage": {
"title": "이용 안내사항",
"hours": "운영 시간",
"hoursDesc": "기본 운영 시간: 10:00 ~ 22:00\n야간 이용 시 요금 1.5배 적용",
"minTime": "최소 이용 시간",
"minTimeDesc": "모든 서비스 최소 2시간\n(스트리밍글 서비스 제외)",
"preparation": "사전 준비 사항",
"preparationDesc": "뮤직비디오/숏폼 촬영 시\n기획서 및 준비물 사전 협의 필수",
"followUp": "후속 서비스",
"followUpDesc": "아바타 리타게팅은 후속 작업 연계 시에만\n제공됩니다 (별도 상담)"
},
"guide": {
"title": "서비스 이용 안내",
"processTitle": "스튜디오 대관 절차",
"step1": "이메일 문의",
"step1Desc": "예약 양식을 작성하여 문의",
"step2": "담당자 확인 및 협의",
"step2Desc": "세부사항 조율",
"step3": "전액 결제",
"step3Desc": "결제 완료",
"step4": "예약 확정",
"step4Desc": "최종 예약 완료",
"btnEmail": "이메일 문의하기",
"btnNaver": "네이버 예약 바로가기",
"naverNote": "※ 네이버 플레이스를 통해 실시간 일정 확인 및 예약이 가능합니다"
},
"policy": {
"reservationTitle": "예약 안내",
"reservation1": "스튜디오 예약은 이용 희망일로부터 최소 2주 전에 신청하시는 것을 권장합니다.",
"reservation2": "예약 확정 후 고객의 사정으로 인한 예약 취소 시 일정 기준에 따른 위약금이 발생합니다.",
"visitTitle": "방문 안내",
"visit1": "본 촬영 전 모션캡쳐 수트 착용 등의 준비시간이 소요되므로 촬영예정 시간 최소 30분 전에 방문 부탁드립니다. (준비시간은 이용시간에 포함되지 않습니다.)",
"visit2": "안경, 귀걸이 등 반사가 잘 되는 재질의 악세사리는 촬영 시 가급적 착용을 자제하여 주시기 바랍니다.",
"refundTitle": "취소 환불 규정",
"refundColTime": "취소 시점",
"refundColRate": "환불 비율",
"refund7days": "예약일로부터 7일 전",
"refund100": "100% 환불",
"refund3days": "예약일로부터 3일 전",
"refund70": "70% 환불",
"refund1day": "예약일로부터 1일 전",
"refund50": "50% 환불",
"refundSameDay": "당일 취소",
"refundNone": "환불 불가"
}
},
"portfolio": {
"meta": {
"title": "포트폴리오 - 밍글 스튜디오",
"description": "밍글 스튜디오 포트폴리오 - 모션캡쳐로 제작된 YouTube 콘텐츠, 버튜버 방송, Shorts 영상 모음",
"ogTitle": "포트폴리오 - 밍글 스튜디오",
"ogDescription": "모션캡처 스튜디오에서 제작된 뮤직비디오, 숏폼, 버튜버 방송 등 다양한 영상 콘텐츠. OptiTrack으로 고품질 모션캡처 서비스 제공"
},
"pageHeader": {
"title": "Portfolio",
"desc": "밍글 스튜디오에서 제작하고 협업한 모션캡쳐 콘텐츠"
},
"channel": {
"title": "밍글 스튜디오 공식 채널",
"desc": "최신 모션캡쳐 콘텐츠와 제작 과정을 YouTube에서 확인하세요",
"btn": "YouTube 채널 방문하기"
},
"tabs": {
"individual": "개인 크리에이터",
"corporate": "기업 프로젝트"
},
"longform": {
"title": "Long-Form 콘텐츠",
"desc": "개인 크리에이터들의 모션캡쳐 프로젝트"
},
"shorts": {
"title": "Shorts 콘텐츠",
"desc": "짧고 임팩트 있는 모션캡쳐 순간들"
},
"broadcast": {
"title": "실시간 방송 예시",
"desc": "버튜버와 스트리머들의 실시간 모션캡쳐 방송",
"noticeTitle": "실시간 모션캡쳐 방송",
"noticeDesc": "밍글 스튜디오에서 진행되는 실시간 모션캡쳐 방송을 통해 고품질 버추얼 콘텐츠를 경험하세요"
},
"corporate": {
"title": "기업 프로젝트",
"desc": "기업 및 상업적 모션캡쳐 프로젝트",
"ixiaDesc": "버추얼 아이돌 그룹 모션캡쳐 제작",
"mvSection": "뮤직비디오 제작",
"shortsSection": "숏폼비디오 제작",
"liveSection": "라이브 방송 진행"
},
"cta": {
"title": "당신의 콘텐츠도 여기에",
"desc": "밍글 스튜디오와 함께 다음 포트폴리오의 주인공이 되어보세요",
"btnInquiry": "프로젝트 문의하기",
"btnServices": "서비스 알아보기"
},
"js": {
"checkNetwork": "네트워크 연결을 확인해주세요",
"shareTitle": "밍글 스튜디오 포트폴리오",
"linkCopied": "비디오 링크가 클립보드에 복사되었습니다.",
"linkCopyFailed": "링크 복사에 실패했습니다."
}
},
"gallery": {
"meta": {
"title": "스튜디오 갤러리 - 밍글 스튜디오",
"description": "밍글 스튜디오 갤러리 - 모션캡쳐 스튜디오 실제 공간과 시설을 사진으로 확인하세요",
"ogTitle": "스튜디오 갤러리 - 밍글 스튜디오",
"ogDescription": "30대 OptiTrack 카메라 시스템과 8×7m 대형 촬영 공간. 인천 유일 모션캡처 스튜디오의 실제 시설과 장비를 확인해보세요"
},
"pageHeader": {
"title": "Studio Gallery",
"desc": "밍글 스튜디오의 실제 공간을 사진으로 확인해보세요"
},
"captions": {
"exterior_open": "외부전경 커튼 열림",
"exterior_closed": "외부 전경 닫힘",
"control_room": "오퍼레이팅/컨트롤룸",
"powder_room": "파우더룸(스튜디오 연결)",
"changing_room_in": "탈의실(내부)",
"changing_room_out": "탈의실(외부)",
"audio_system": "고품질 음향 시스템",
"mocap_space_1": "모션캡쳐 공간 001",
"mocap_space_2": "모션캡쳐 공간 002",
"mocap_space_3": "모션캡쳐 공간 003",
"mocap_space_4": "모션캡쳐 공간 004"
},
"panorama": {
"title": "360° Studio View",
"desc": "드래그하여 스튜디오를 360도로 둘러보세요",
"clickToView": "클릭하여 360° VR로 체험하기",
"curtainOpen": "스튜디오 전경 (커튼 열림)",
"curtainClosed": "스튜디오 전경 (커튼 닫힘)"
},
"js": {
"lightboxLabel": "이미지 뷰어",
"close": "닫기",
"prevImage": "이전 이미지",
"nextImage": "다음 이미지",
"panoramaLoading": "360° 이미지 로딩중...",
"reset": "초기화",
"autoRotate": "자동회전",
"stop": "정지",
"zoomIn": "확대",
"zoomOut": "축소",
"help": "도움말",
"helpTitle": "360° 조작 가이드",
"helpDrag": "마우스 드래그로 화면을 회전시킬 수 있습니다",
"helpTouch": "터치 스크린에서는 손가락으로 드래그하세요",
"helpZoom": "마우스 휠이나 핀치로 확대/축소할 수 있습니다",
"helpAutoRotate": "자동회전 버튼으로 자동으로 둘러볼 수 있습니다",
"helpEsc": "ESC 키를 눌러 닫을 수 있습니다",
"checkImageFile": "이미지 파일을 확인해주세요"
}
},
"contact": {
"meta": {
"title": "문의하기 - 밍글 스튜디오",
"description": "밍글 스튜디오 문의하기 - 모션캡쳐 스튜디오 대관, 촬영, 제작 문의 및 상담",
"ogTitle": "문의하기 - 밍글 스튜디오",
"ogDescription": "모션캡처 스튜디오 대관, 촬영, 제작 관련 문의 및 상담. 인천 테크노밸리 소재 OptiTrack 전문 스튜디오"
},
"pageHeader": {
"title": "Contact Us",
"desc": "밍글 스튜디오와 함께 특별한 프로젝트를 시작하세요"
},
"phone": {
"title": "전화 문의",
"desc": "24시간 가능"
},
"business": {
"title": "비즈니스 문의",
"desc": "제휴 및 협력 문의"
},
"reservation": {
"title": "예약 및 문의",
"desc": "24시간 접수 가능"
},
"visit": {
"title": "스튜디오 방문",
"desc": "사전 예약 필수",
"link": "위치 보기"
},
"location": {
"title": "스튜디오 위치",
"address": "주소",
"addressValue": "(21330) 인천광역시 부평구 주부토로 236<br>인천테크노밸리 U1센터 A동 B105호",
"subway": "지하철",
"subwayDesc": "인천 7호선 갈산역 하차 → 도보 약 7분",
"bus": "버스",
"busStop": "갈산시장·갈산도서관 정류장 이용",
"busRoutes": "4번, 526번, 555번 버스",
"parking": "주차",
"parkingDesc": "기본 2시간 무료, 건물 내 시설 이용시 최대 4시간 무료",
"hours": "운영시간",
"hours24": "24시간 영업",
"hoursAllYear": "연중무휴",
"naverMap": "네이버 지도",
"googleMap": "구글 맵"
},
"cta": {
"title": "예약 및 문의",
"desc": "간편한 온라인 예약 또는 자주 묻는 질문을 확인해보세요",
"btnNaver": "네이버 예약",
"btnFaq": "FAQ 보기"
},
"js": {
"checkInput": "입력 정보를 확인해 주세요.",
"sending": "전송 중...",
"sendSuccess": "문의가 성공적으로 전송되었습니다. 빠른 시일 내에 연락드리겠습니다.",
"sendError": "전송 중 오류가 발생했습니다. 다시 시도해 주세요.",
"resetConfirm": "입력한 내용이 모두 삭제됩니다. 계속하시겠습니까?",
"invalidEmail": "올바른 이메일 형식을 입력해 주세요.",
"invalidPhone": "올바른 전화번호 형식을 입력해 주세요.",
"required": "필수 입력 항목입니다."
}
},
"qna": {
"meta": {
"title": "자주 묻는 질문 - 밍글 스튜디오",
"description": "밍글 스튜디오 FAQ - 모션캡쳐 스튜디오 대관, 촬영, 제작에 관한 자주 묻는 질문과 답변",
"ogTitle": "자주 묻는 질문 - 밍글 스튜디오",
"ogDescription": "모션캡처 스튜디오 대관, 촬영, 요금, 예약 등에 관한 자주 묻는 질문과 답변. OptiTrack 시스템 이용 가이드"
},
"pageHeader": {
"title": "자주하는 질문",
"desc": "밍글 스튜디오 이용에 관한 자주 묻는 질문들을 확인하세요"
},
"search": {
"placeholder": "궁금한 내용을 검색해보세요...",
"btnLabel": "검색"
},
"categories": {
"all": "전체",
"booking": "예약/대관",
"equipment": "장비/기술",
"pricing": "요금/결제",
"production": "제작/촬영",
"streaming": "스트리밍",
"etc": "기타"
},
"faq": {
"q1": "스튜디오 대관은 어떻게 예약하나요?",
"q2": "예약금 제도와 환불 규정이 있나요?",
"q3": "최소 대관 시간은 어떻게 되나요?",
"q4": "대관은 얼마나 전에 예약해야 하나요?",
"q5": "현장 결제가 가능한가요?",
"q6": "세금계산서 발행이 가능한가요?",
"q7": "어떤 모션캡쳐 장비를 사용하나요?",
"q8": "모션캡쳐 슈트는 제공되나요?",
"q9": "몇 명까지 동시에 모션캡쳐가 가능한가요?",
"q10": "결제는 어떻게 하나요?",
"q11": "촬영 준비물은 무엇이 필요한가요?",
"q12": "데이터는 어떤 형태로 받을 수 있나요?",
"q13": "실시간 스트리밍이 가능한가요?",
"q14": "주차는 가능한가요?",
"q15": "견학이나 시설 투어는 가능한가요?",
"a1": "<p>아래 방법으로 예약하실 수 있습니다:</p>\n<ul>\n<li><strong><i class=\"fa-solid fa-envelope\" aria-hidden=\"true\"></i> 이메일:</strong> <a href=\"mailto:help@minglestudio.co.kr?subject=[스튜디오 예약 문의] 밍글 스튜디오&body=안녕하세요. 밍글 스튜디오 대관 예약 문의 드립니다.%0A%0A■ 기본 정보%0A- 이용 예정일: (예: 2024년 12월 25일)%0A- 이용 시간: (예: 오후 2시 ~ 4시, 2시간)%0A- 참여 인원: 명%0A- 연락처: %0A- 이메일: %0A%0A■ 촬영 정보%0A- 촬영 목적: (예: 버튜버 방송, 게임 제작, 영상 콘텐츠 등)%0A- 예상 촬영 내용: %0A- 필요한 장비: (전신 모션캡쳐 / 페이셜 캡쳐 / 기타)%0A%0A■ 추가 요청사항%0A- 특별한 요구사항: %0A- 문의사항: %0A%0A■ 참고사항%0A- 최소 대관: 2시간 (220,000원, VAT 포함)%0A- 연장: 1시간당 110,000원%0A- 결제방법: 계좌이체 또는 현금 (카드결제 불가)%0A- 현금영수증/세금계산서 발행 가능%0A%0A빠른 시일 내에 답변 드리겠습니다.%0A감사합니다.\">help@minglestudio.co.kr</a></li>\n<li><strong><i class=\"fa-solid fa-phone\" aria-hidden=\"true\"></i> 전화:</strong> 010-9288-9190</li>\n<li><strong><i class=\"fa-solid fa-calendar\" aria-hidden=\"true\"></i> 네이버 예약:</strong> <a href=\"https://m.booking.naver.com/booking/10/bizes/1468174/items/6949481\" target=\"_blank\">네이버 플레이스 실시간 예약</a></li>\n</ul>\n<div style=\"margin-top: var(--spacing-md); text-align: center;\">\n<button id=\"showEmailFormFAQ\" class=\"btn btn-primary\" style=\"font-size: 0.9rem; padding: 0.5rem 1rem;\"><i class=\"fa-solid fa-envelope\" aria-hidden=\"true\"></i> 이메일 문의하기</button>\n</div>\n<div id=\"emailFormFAQ\" class=\"email-form\" style=\"display:none; margin-top: var(--spacing-lg); padding: var(--spacing-lg); border: 1px solid #ddd; border-radius: var(--border-radius); background: #f9f9f9;\">\n<h4>이메일 문의 양식</h4>\n<p>아래 양식을 복사하여 이메일로 문의해주세요:</p>\n<div class=\"email-template\" style=\"background: white; padding: var(--spacing-md); border-radius: var(--border-radius); font-family: monospace; font-size: 0.9rem; line-height: 1.6;\">\n<div><strong>제목:</strong> [스튜디오 대관 문의]</div>\n<div><strong>받는 사람:</strong> help@minglestudio.co.kr</div>\n<br>\n<div><strong>1. 성함 및 소속</strong></div>\n<div style=\"color: #666; font-size: 0.85rem;\">(개인의 경우 성함만, 기업인 경우 이용자분 성함과 소속을 함께 적어주세요)</div>\n<div style=\"margin: 0.5rem 0; padding: 0.5rem; background: #f0f0f0; border-radius: 4px;\">[여기에 작성해주세요]</div>\n<div><strong>2. 연락처</strong></div>\n<div style=\"color: #666; font-size: 0.85rem;\">(전화번호, 이메일, 디스코드 중 택1)</div>\n<div style=\"margin: 0.5rem 0; padding: 0.5rem; background: #f0f0f0; border-radius: 4px;\">[여기에 작성해주세요]</div>\n<div><strong>3. 이용 인원</strong></div>\n<div style=\"color: #666; font-size: 0.85rem;\">(1~2인 권장, 최대 5인까지 가능)</div>\n<div style=\"margin: 0.5rem 0; padding: 0.5rem; background: #f0f0f0; border-radius: 4px;\">\u25a1 1명 \u25a1 2명 \u25a1 3명 \u25a1 4명 \u25a1 5명</div>\n<div><strong>4. 스튜디오 사용 용도</strong></div>\n<div style=\"margin: 0.5rem 0; padding: 0.5rem; background: #f0f0f0; border-radius: 4px;\">\u25a1 녹화 \u25a1 기타: [여기에 작성해주세요]</div>\n<div><strong>5. 희망 대관 날짜</strong></div>\n<div style=\"color: #666; font-size: 0.85rem;\">※ 최소 2주 전 예약을 권장합니다</div>\n<div style=\"margin: 0.5rem 0; padding: 0.5rem; background: #f0f0f0; border-radius: 4px;\">[여기에 작성해주세요]</div>\n<div><strong>6. 희망 이용 시간</strong></div>\n<div style=\"color: #666; font-size: 0.85rem;\">※ 응답 예시) 오전 10시~ 오후 3시(5시간)</div>\n<div style=\"color: #666; font-size: 0.85rem;\">※ 새벽 대관(밤 10시~익일 8시) 이용 시 내부 규정에 따른 별도 요율이 적용됩니다</div>\n<div style=\"margin: 0.5rem 0; padding: 0.5rem; background: #f0f0f0; border-radius: 4px;\">[여기에 작성해주세요]</div>\n</div>\n<div style=\"margin-top: var(--spacing-md); text-align: center;\">\n<a href=\"mailto:help@minglestudio.co.kr?subject=[스튜디오 대관 문의]\" class=\"btn btn-primary\"><i class=\"fa-solid fa-envelope\" aria-hidden=\"true\"></i> 이메일 바로 보내기</a>\n</div>\n</div>\n<p>최소 2주 전에 연락주시면 원활하게 준비가 가능합니다.</p>",
"a2": "<p>아래는 환불 규정입니다:</p>\n<div class=\"policy-table\">\n<div class=\"policy-row\">\n<span class=\"policy-time\">예약일로부터 7일 전</span>\n<span class=\"policy-desc\">100% 환불</span>\n</div>\n<div class=\"policy-row\">\n<span class=\"policy-time\">예약일로부터 3일 전</span>\n<span class=\"policy-desc\">70% 환불</span>\n</div>\n<div class=\"policy-row\">\n<span class=\"policy-time\">예약일로부터 1일 전</span>\n<span class=\"policy-desc\">50% 환불</span>\n</div>\n<div class=\"policy-row\">\n<span class=\"policy-time\">당일 취소</span>\n<span class=\"policy-desc\">환불 불가</span>\n</div>\n</div>",
"a3": "<p>최소 대관은 <strong>2시간</strong>부터 가능합니다.</p>\n<p>연장은 1시간 단위로 가능합니다.</p>",
"a4": "<p>최소 2주 전에 연락주시면 원활하게 준비가 가능합니다.</p>",
"a5": "<p>현장에서는 현금 결제 또는 계좌이체가 가능합니다.</p>\n<p>카드 결제는 현장에서 불가능하니 참고해 주세요.</p>\n<p>현금영수증 및 세금계산서 발행 가능합니다.</p>",
"a6": "<p>네 발행 가능합니다</p>",
"a7": "<p>밍글 스튜디오는 다음과 같은 전문 장비를 보유하고 있습니다:</p>\n<ul>\n<li><strong>OptiTrack 카메라:</strong> 30대</li>\n<li><strong>핸드 트래킹:</strong> 로코코 스마트 글러브 사용중</li>\n</ul>",
"a8": "<p>네, 전문 모션캡쳐 슈트와 마커를 무료로 제공합니다.</p>\n<ul>\n<li>다양한 사이즈 (S, M, L, XL) 보유</li>\n<li>위생적인 관리로 깔끔한 상태 유지</li>\n<li>개인 슈트 지참도 가능</li>\n<li>장갑, 헤드밴드 등 부속품 포함</li>\n</ul>",
"a9": "<p>최대 <strong>5명</strong>까지 동시 모션캡쳐가 가능합니다.</p>\n<p>인원별 상세 정보:</p>\n<ul>\n<li><strong>1명:</strong> 최고 정밀도 캡쳐</li>\n<li><strong>2명:</strong> 상호작용 장면 최적</li>\n<li><strong>3-5명:</strong> 그룹 퍼포먼스 가능</li>\n</ul>\n<p>인원이 많을수록 캡쳐 공간과 정확도에 제약이 있을 수 있습니다.</p>",
"a10": "<p>다음과 같은 결제 방법을 지원합니다:</p>\n<ul>\n<li><strong>계좌이체:</strong> 예약 확정 후 24시간 내</li>\n<li><strong>현금결제:</strong> 현장 결제 가능</li>\n<li><strong>카드결제:</strong> 현장에서 불가능</li>\n<li><strong>세금계산서:</strong> 사업자 고객 발행 가능</li>\n<li><strong>현금영수증:</strong> 개인 고객 발행 가능</li>\n</ul>\n<p>예약금(30%)은 예약 확정 시, 잔금(70%)은 촬영 당일 결제 가능합니다.</p>",
"a11": "<p>기본적으로 다음과 같은 준비가 필요합니다:</p>\n<ul>\n<li><strong>신발:</strong> 양말 필수 착용</li>\n<li><strong>안경:</strong> 안경 착용 불가 (렌즈 착용 권장)</li>\n<li><strong>머리:</strong> 긴 머리는 묶어주세요</li>\n<li><strong>액세서리:</strong> 시계, 반지 등 제거</li>\n<li><strong>메이크업:</strong> 진한 메이크업은 피해주세요</li>\n</ul>\n<p>모션캡쳐 슈트와 마커는 스튜디오에서 제공합니다.</p>",
"a12": "<p>다음과 같은 형태의 데이터를 제공합니다:</p>\n<ul>\n<li><strong>FBX 파일:</strong> Unity, Unreal Engine 호환</li>\n<li><strong>ANIM 파일:</strong> Unity Animator 직접 호환</li>\n<li><strong>MP4 영상:</strong> 참고용 영상</li>\n</ul>\n<p>문의 시 세부사항을 안내해드리며, 클라우드를 통해 전달합니다.</p>",
"a13": "<p><strong>네, 스트리밍글 서비스를 통해 실시간 스트리밍이 가능합니다.</strong></p>\n<p>모션캡쳐 데이터를 실시간으로 송출하여 라이브 방송에 활용하실 수 있습니다.</p>\n<p>자세한 내용은 Services 페이지의 스트리밍글 서비스 항목을 참고해주세요.</p>",
"a14": "<p>네, 주차가 가능합니다:</p>\n<ul>\n<li><strong>기본:</strong> 2시간 무료</li>\n<li><strong>건물 내 시설 이용시:</strong> 추가 2시간, 최대 4시간 무료</li>\n<li><strong>위치:</strong> 인천테크노밸리 건물 주차장</li>\n</ul>",
"a15": "<p>견학 및 투어는 미리 문의를 통해 가능 여부를 확인해야 합니다:</p>\n<ul>\n<li><strong>사전 문의:</strong> 필수 (스튜디오 사정에 따라 거절될 수 있음)</li>\n<li><strong>문의처:</strong> help@minglestudio.co.kr</li>\n<li><strong>견학 시간:</strong> 승인 시 협의 (약 30분 소요)</li>\n<li><strong>비용:</strong> 무료</li>\n</ul>\n<p>스튜디오 운영 상황에 따라 견학이 제한될 수 있으니 양해 부탁드립니다.</p>"
},
"cta": {
"title": "원하는 답변을 찾지 못하셨나요?",
"desc": "궁금한 점이 있으시면 언제든지 문의해 주세요",
"btnContact": "문의하기",
"btnCall": "전화 상담"
}
},
"error404": {
"meta": {
"title": "페이지를 찾을 수 없습니다 - 밍글 스튜디오"
},
"title": "페이지를 찾을 수 없습니다",
"desc": "죄송합니다. 요청하신 페이지가 존재하지 않거나 이동되었을 수 있습니다.<br>아래 링크를 통해 원하시는 정보를 찾아보세요.",
"btnHome": "홈으로 돌아가기",
"btnContact": "문의하기",
"searchPlaceholder": "원하는 내용을 검색해보세요...",
"helpfulLinks": "도움이 될 수 있는 페이지",
"linkAbout": "회사 소개",
"linkServices": "서비스 안내",
"linkPortfolio": "포트폴리오",
"linkGallery": "스튜디오 갤러리",
"linkQna": "자주하는 질문",
"linkContact": "연락처 및 위치"
}
}

710
i18n/zh.json Normal file
View File

@ -0,0 +1,710 @@
{
"header": {
"studioName": "Mingle Studio",
"nav": {
"about": "About",
"services": "Services",
"portfolio": "Portfolio",
"gallery": "Gallery",
"contact": "Contact",
"qna": "Q&A"
},
"menuOpen": "打开菜单",
"menuClose": "关闭菜单",
"darkMode": "切换到深色模式",
"lightMode": "切换到浅色模式",
"langSelect": "选择语言"
},
"footer": {
"companyInfo": "公司信息",
"companyName": "Mingle Studio",
"ceo": "代表: 김희진",
"businessNumber": "营业执照号: 208-12-73755",
"contact": "联系方式",
"businessInquiry": "商务咨询",
"reservationInquiry": "预约咨询",
"directions": "交通指南",
"address": "인천광역시 부평구 주부토로 236",
"addressDetail": "인천테크노밸리 U1센터 A동 B105호",
"copyright": "© 2025 Mingle Studio. All rights reserved."
},
"common": {
"loading": "页面加载中...",
"componentLoading": "加载中...",
"skipToContent": "跳转到正文",
"videoLoading": "视频加载中...",
"videoError": "无法加载视频",
"imageError": "无法加载图片"
},
"index": {
"meta": {
"title": "Mingle Studio - 动作捕捉创作工作室",
"description": "配备先进OptiTrack系统和专业设备的动作捕捉工作室。在仁川科技谷体验虚拟内容创作的无限可能。",
"ogTitle": "Mingle Studio - 动作捕捉创作工作室",
"ogDescription": "配备先进OptiTrack系统和专业设备的动作捕捉工作室"
},
"hero": {
"title": "Mingle Studio",
"subtitle": "MINGLE STUDIO",
"description": "技术与创意、热情交融<br>创造全新价值的空间",
"btnAbout": "了解公司",
"btnContact": "预约咨询",
"specCamera": "OptiTrack 摄像头",
"specCameraUnit": "台",
"specSpace": "捕捉空间",
"specPrice": "每小时场地租赁费",
"specPriceUnit": "万韩元"
},
"showcase": {
"step1": {
"label": "Equipment",
"title": "先进的动作捕捉系统",
"desc": "OptiTrack光学摄像头、Rokoko手套、ARKit面部捕捉 —— 从全身到指尖、表情，实现精准追踪。",
"feature1Title": "OptiTrack 摄像头 30台",
"feature1Desc": "亚毫米级光学动作追踪",
"feature2Title": "Rokoko 手套 5副",
"feature2Desc": "精确到手指关节的手部捕捉",
"feature3Title": "ARKit 面部捕捉 (iPhone 5台)",
"feature3Desc": "基于iPhone的高精度表情捕捉"
},
"step2": {
"label": "Space",
"title": "宽敞且优化的捕捉空间",
"desc": "8m x 7m x 2.6m规格的专用捕捉空间，支持自由运动。",
"feature1Title": "8m × 7m × 2.6m",
"feature1Desc": "宽敞的专用捕捉空间",
"feature2Title": "实时直播",
"feature2Desc": "通过Streamingle服务进行直播"
},
"step3": {
"label": "Services",
"title": "主要应用领域",
"desc": "专业操作员为各类创意项目提供全方位支持。",
"virtual": "虚拟内容",
"virtualSub": "VTuber、虚拟偶像",
"game": "游戏开发",
"gameSub": "角色动画",
"video": "影视制作",
"videoSub": "VFX、虚拟制片",
"metaverse": "元宇宙",
"metaverseSub": "3D虚拟形象内容",
"btnServices": "查看全部服务"
},
"step4": {
"label": "Studio",
"title": "工作室空间",
"desc": "从主捕捉空间到控制室、私人房间，所有设施一应俱全。配合专业技术支持，提供最佳捕捉体验。",
"feature1Title": "专业技术支持",
"feature1Desc": "经验丰富的操作员实时协助",
"feature2Title": "私密环境",
"feature2Desc": "在独立空间中专注工作",
"btnGallery": "查看画廊"
}
},
"portfolio": {
"title": "作品集",
"desc": "在Mingle Studio制作和合作的动作捕捉内容",
"tabCreator": "个人创作者",
"tabCorporate": "企业项目",
"tabShorts": "Shorts",
"btnMore": "查看全部作品 →"
},
"partner": {
"title": "合作主播",
"desc": "与Mingle Studio一起创作内容的创作者",
"streamer1": {
"desc": "Guseulyo！一位展示聊天、唱歌、游戏、VRChat等多样化内容的虚拟主播",
"tagSong": "唱歌",
"tagGame": "游戏"
}
},
"creatorSigns": {
"title": "来访创作者",
"desc": "到访Mingle Studio的创作者签名"
},
"clients": {
"title": "客户",
"desc": "与各领域企业共同制作创新动作捕捉内容"
},
"faqShortcut": {
"label": "FAQ",
"title": "第一次不知道怎么做？",
"desc": "即使是第一次接触动作捕捉也没关系。我们整理了从预约到拍摄的常见问题。",
"btnFaq": "查看常见问题",
"btnContact": "1:1 咨询"
},
"cta": {
"label": "Get Started",
"title": "您的创意，<br>用动作来呈现",
"desc": "在专业动作捕捉工作室体验创意的全新可能",
"btnReserve": "预约咨询",
"btnNaver": "Naver预约",
"infoReservation": "预约咨询",
"infoBusiness": "商务合作",
"infoDirections": "交通指南",
"infoAddress": "仁川市富平区主夫吐路236，仁川科技谷"
},
"popup": {
"title": "价格调整通知",
"subtitle": "自2026年3月起已开始实施",
"badge": "实施中",
"mainChanges": "主要变更内容",
"discountEnd": "优惠活动结束",
"discountEndDesc": "开业纪念8折优惠活动已于<strong>2月28日</strong>结束，目前按原价执行。",
"streaming4h": "Streamingle 4小时服务上线",
"streaming4hDesc": "可以4小时套餐享受与现有Streamingle服务（6小时）相同的权益。",
"referral": "推荐人制度上线",
"referralDesc": "推荐朋友后，推荐人和被推荐人均可获得<strong>8折优惠券</strong>。（限使用1次，不可叠加使用）",
"notice": "※ 调整后的价格已更新至服务页面",
"effectiveDate": "实施时间",
"effectiveDateValue": "2026年3月起",
"inquiryEmail": "咨询邮箱",
"ctaBtn": "查看当前服务价格 →",
"dontShowToday": "今日不再显示",
"close": "关闭"
}
},
"about": {
"meta": {
"title": "关于我们 - Mingle Studio",
"description": "Mingle Studio是一个融合技术与创意的动作捕捉创作空间。2025年成立，位于仁川科技谷。",
"ogTitle": "关于我们 - Mingle Studio",
"ogDescription": "2025年成立的仁川唯一动作捕捉专业工作室。融合技术与创意的虚拟内容创作空间。"
},
"pageHeader": {
"title": "About Us",
"desc": "技术与创意、热情交融，创造全新价值的空间"
},
"info": {
"companyName": "公司名称",
"companyNameValue": "Mingle Studio",
"foundingDate": "成立日期",
"foundingDateValue": "2025年7月15日",
"slogan": "标语",
"sloganValue": "\"人人交融的快乐创作空间\"",
"meaning": "含义",
"meaningValue": "Mingle Studio是一个让技术人员、创作者和观众共同交融的虚拟内容制作空间。利用先进的光学动作捕捉技术，捕捉虚拟角色鲜活的情感与动作，实现新一代数字表演。"
},
"companyIntro": {
"title": "公司介绍",
"desc1": "Mingle Studio是一个以动作捕捉为基础的创作空间，通过创作者与技术、人与人之间的\u201c交融\u201d创造全新内容。",
"desc2": "自成立以来，以人人都能便捷使用的场地租赁服务为核心，提供虚拟内容制作环境。"
},
"visionMission": {
"title": "愿景与使命",
"visionTitle": "愿景",
"visionDesc": "构建让所有创作者不受技术限制，将想象变为现实的创作生态系统",
"missionTitle": "使命",
"missionDesc": "通过先进的动作捕捉技术，将创作者的创意转化为生动的内容，提供全新的数字体验"
},
"history": {
"title": "发展历程",
"date1": "2025年7月15日",
"event1Title": "Mingle Studio 成立",
"event1Desc": "Mingle Studio 公司注册成立",
"date2": "2025年8月1日",
"event2Title": "工作室正式开放",
"event2Desc": "OptiTrack系统搭建完成，场地租赁服务正式启动"
},
"team": {
"title": "Our Team",
"desc": "各领域专家协同合作，全力支持内容制作",
"member1Name": "김희진",
"member1Role": "CEO / 3D美术师",
"member1Desc": "场景/资源制作，人事及项目管理",
"member2Name": "김광진",
"member2Role": "CTO / 技术总监",
"member2Desc": "工作室整体技术运营，动作捕捉设备管理，音响系统，引擎编程",
"member3Name": "이승민",
"member3Role": "CCO / 内容总监",
"member3Desc": "捕捉指导，演员动作清理，摄像机运动，表演导演"
},
"partner": {
"title": "Partner Streamer",
"desc": "与Mingle Studio合作创作内容的创作者",
"streamer1Desc": "以互动、歌唱、游戏、VRChat等丰富多样的内容亮相的虚拟主播。主要在SOOP平台活跃，与Mingle Studio的动作捕捉技术携手打造全新的虚拟内容。"
},
"values": {
"title": "Core Values",
"desc": "Mingle Studio所追求的核心价值",
"collaboration": "协作",
"collaborationDesc": "技术人员与创作者携手共创的协同效应",
"innovation": "创新",
"innovationDesc": "以前沿技术开拓创作新可能",
"creativity": "创意",
"creativityDesc": "将想象变为现实的创意解决方案",
"quality": "品质",
"qualityDesc": "追求最高水准的动作捕捉质量"
}
},
"services": {
"meta": {
"title": "服务介绍 - Mingle Studio",
"description": "Mingle Studio服务介绍 - OptiTrack动作捕捉工作室场地租赁，2人200,000韩元起/小时，全身/面部捕捉，专业动作录制",
"ogTitle": "服务介绍 - Mingle Studio",
"ogDescription": "OptiTrack动作捕捉工作室场地租赁服务。全身/面部捕捉专业服务"
},
"pageHeader": {
"title": "Services",
"desc": "提供先进的动作捕捉设施和专业服务"
},
"packages": {
"title": "服务套餐",
"desc": "根据用途和规模提供最优动作捕捉录制服务",
"vatNotice": "※ 所有价格均不含增值税"
},
"service1": {
"title": "服务1: 动作捕捉录制服务",
"badge": "基础型",
"team": "2人使用",
"teamPopular": "热门",
"teamPrice": "200,000韩元",
"teamUnit": "/小时",
"teamFeature1": "2人同步动作录制",
"teamFeature2": "角色间互动录制",
"teamFeature3": "团队项目协作",
"additional": "额外人员",
"additionalPrice": "+100,000韩元",
"additionalUnit": "/人/小时",
"additionalFeature1": "最多5人同步录制",
"additionalFeature2": "多人动作捕捉",
"additionalFeature3": "群体编舞/表演录制",
"minPerson": "最少使用人数: 2人",
"minTime": "最少使用时间: 2小时",
"maxPerson": "最多同时使用: 5人",
"techTitle": "提供的技术与服务",
"tech1": "OptiTrack 30台摄像头",
"tech2": "实时虚拟形象录制",
"tech3": "全身/面部捕捉",
"tech4": "实时监控",
"tech5": "专业操作员",
"tech6": "提供动作数据",
"note": "虚拟形象重定向服务不包含在基础服务中，如需后续对接可通过单独咨询提供。"
},
"combo": {
"title": "组合产品",
"badge": "特色服务",
"mvTitle": "音乐视频/短视频实时拍摄",
"mvPrice": "与动作捕捉相同费用",
"mvReqTitle": "额外要求",
"mvReq1": "需提前协商策划方案",
"mvReq2": "角色/背景/道具需提前协商",
"mvReq3": "如需聘请演员: 100,000韩元 (每人每小时)",
"mvPortfolio": "查看作品集",
"remoteTitle": "远程拍摄",
"remotePrice": "与动作捕捉相同费用",
"remoteServiceTitle": "服务内容",
"remoteService1": "支持远程实时拍摄",
"remoteService2": "可在线指导",
"remoteService3": "实时直播推流",
"remoteExtraTitle": "额外费用",
"remoteExtra1": "演员聘请费: 100,000韩元 (每人每小时)"
},
"service2": {
"title": "服务2: Streamingle 直播服务",
"badge": "代表产品",
"pkg4h": "4小时套餐",
"pkg4hBadge": "NEW",
"pkg4hPrice": "1,400,000韩元",
"pkg4hUnit": "/ 1~5人使用",
"pkg4hFeature1": "共4小时使用",
"pkg4hFeature2": "场地租赁2小时 + 拍摄准备2小时",
"pkg4hFeature3": "享受与6小时套餐相同的权益",
"pkg6h": "6小时套餐",
"pkg6hPrice": "2,000,000韩元",
"pkg6hUnit": "/ 1~5人使用",
"pkg6hFeature1": "共6小时使用",
"pkg6hFeature2": "场地租赁4小时 + 拍摄准备2小时",
"pkg6hFeature3": "适合大型项目",
"commonLabel": "以下权益适用于4小时和6小时套餐",
"benefitsTitle": "通用包含权益",
"benefit1": "每人1套角色免费设置",
"benefit2": "现有背景中2个免费设置",
"benefit3": "道具免费设置（新道具最多6个，现有道具不限量）",
"benefit4": "动作捕捉录制服务",
"benefit5": "实时视频拍摄",
"benefit6": "直播服务",
"featuresTitle": "服务特点",
"feature1": "支持大型项目",
"feature2": "提供综合拍摄环境",
"feature3": "实时直播（Streamingle专属）",
"feature4": "专业团队全程服务",
"feature5": "1~5人自由选择",
"livePortfolio": "查看直播作品集"
},
"service3": {
"title": "服务3: 音乐视频制作服务",
"badge": "高级版",
"intro": "从策划到交付，全方位支持专业音乐视频制作的全过程。",
"priceRange": "预计总费用: 2,000,000韩元 ~ 4,000,000韩元",
"priceNote1": "※ 以上费用为大致预估金额，具体报价可能根据项目规模和需求有所变动。",
"priceNote2": "※ 费用会根据背景制作范围、分镜师费用、虚拟形象/道具数量、导演难度等因素浮动。",
"processTitle": "制作流程（7个阶段）",
"step1Title": "策划咨询（免费）",
"step1Desc": "音乐视频制作的起始阶段，梳理概念和风格。",
"step1Note": "※ 方向明确后，后续制作才能顺利推进。",
"step2Title": "背景制作",
"step2Desc": "可根据版权归属选择不同方案。",
"step2Opt1Type": "使用现有背景",
"step2Opt1Price": "30,000韩元/个",
"step2Opt1Note": "版权: 归公司所有",
"step2Opt2Type": "全新制作（归公司所有）",
"step2Opt2Price": "100,000韩元/个",
"step2Opt2Note": "版权: 归公司所有（大型或特殊背景可能受限）",
"step2Opt3Type": "全新制作（归客户所有）",
"step2Opt3Price": "200,000韩元 ~ 1,000,000韩元/个",
"step2Opt3Note": "版权: 归客户所有（根据规模和细节有所变动）",
"step2ProcessNote": "以Unity构建方式交付，可确认摄像机视角",
"step3Title": "分镜脚本编写",
"step3Price": "100,000韩元起",
"step3Desc": "由外部专业编剧将音乐视频的流程具象化。",
"step3Note": "※ 与客户共享，提前确认导演风格和镜头切换",
"step4Title": "虚拟形象设置与道具制作",
"step4AvatarLabel": "虚拟形象设置:",
"step4AvatarPrice": "50,000韩元/个",
"step4PropLabel": "剧情用道具:",
"step4PropPrice": "20,000韩元/个",
"step4Desc": "根据音乐视频环境优化虚拟形象。",
"step4Note": "※ 可进行虚拟形象修改和优化",
"step5Title": "动作捕捉",
"step5StudioLabel": "动作捕捉工作室场地租赁费用",
"step5Solo": "1人使用:",
"step5SoloPrice": "150,000韩元/小时",
"step5Duo": "2人使用:",
"step5DuoPrice": "200,000韩元/小时",
"step5Extra": "额外人员:",
"step5ExtraPrice": "+100,000韩元/人/小时",
"step5ExtraNote": "（最多5人）",
"step5ActorLabel": "演员聘请费用",
"step5Actor": "演员聘请:",
"step5ActorPrice": "100,000韩元/人/小时",
"step5Desc": "根据分镜脚本录制动作。",
"step5Note1": "※ 拍摄周期: 约1~2天",
"step5Note2": "※ 最少使用: 2小时",
"step6Title": "视觉开发与导演",
"step6Price": "500,000韩元起",
"step6Desc": "在Unity中进行后期处理、美术设计、摄像机运动等工作。",
"step6Note": "※ 根据导演复杂度和质量要求有所变动",
"step7Title": "最终反馈与交付",
"step7Desc": "完成的视频经客户反馈修改后进行最终交付。",
"step7Note": "※ 交付格式: mp4/mov等",
"processNote": "策划咨询（免费） → 整体报价 → 报价确认后开始制作（第2~7阶段依次推进）"
},
"options": {
"title": "附加选项费用",
"desc": "适用于所有服务套餐的通用附加选项",
"vatNote": "*不含增值税",
"charSetup": "角色设置",
"charPrice": "50,000韩元起",
"charUnit": "/ 每人1套",
"charDesc": "新角色设置工作",
"bgSetup": "背景设置",
"bgExisting": "使用现有背景",
"bgExistingPrice": "30,000韩元起",
"bgExistingUnit": "/ 1个",
"bgExistingNote": "仅收取设置费",
"bgNew": "全新背景制作",
"bgNewPrice": "100,000韩元起",
"bgNewUnit": "/ 1个",
"bgNewNote": "设置费 + 制作费/购买费另计\n可选择归属Mingle Studio或委托方",
"propSetup": "道具设置",
"propPrice": "20,000韩元",
"propUnit": "/ 1个",
"propDesc": "道具设置工作\n（Streamingle服务: 新道具最多6个，现有道具不限量免费提供）"
},
"usage": {
"title": "使用须知",
"hours": "营业时间",
"hoursDesc": "基本营业时间: 10:00 ~ 22:00\n夜间使用费用按1.5倍计算",
"minTime": "最少使用时间",
"minTimeDesc": "所有服务最少2小时\n（Streamingle服务除外）",
"preparation": "事前准备事项",
"preparationDesc": "拍摄音乐视频/短视频时\n需提前协商策划方案和准备物品",
"followUp": "后续服务",
"followUpDesc": "虚拟形象重定向仅在后续工作对接时\n提供（需单独咨询）"
},
"guide": {
"title": "服务使用指南",
"processTitle": "场地租赁流程",
"step1": "邮件咨询",
"step1Desc": "填写预约表格发送咨询",
"step2": "负责人确认与协商",
"step2Desc": "协调详细事项",
"step3": "全额支付",
"step3Desc": "完成支付",
"step4": "预约确认",
"step4Desc": "最终完成预约",
"btnEmail": "发送邮件咨询",
"btnNaver": "前往Naver预约",
"naverNote": "※ 可通过Naver Place实时查看日程并预约"
},
"policy": {
"reservationTitle": "预约须知",
"reservation1": "建议在您希望使用的日期前至少2周进行预约申请。",
"reservation2": "预约确认后因客户原因取消预约时，将根据取消政策收取违约金。",
"visitTitle": "到访须知",
"visit1": "由于正式拍摄前需要穿戴动作捕捉服等准备工作，请在预定拍摄时间前至少30分钟到达。（准备时间不包含在使用时间内。）",
"visit2": "拍摄时请尽量避免佩戴眼镜、耳环等反光材质的配饰。",
"refundTitle": "取消退款政策",
"refundColTime": "取消时间",
"refundColRate": "退款比例",
"refund7days": "预约日7天前",
"refund100": "100%退款",
"refund3days": "预约日3天前",
"refund70": "70%退款",
"refund1day": "预约日1天前",
"refund50": "50%退款",
"refundSameDay": "当天取消",
"refundNone": "不可退款"
}
},
"portfolio": {
"meta": {
"title": "作品集 - Mingle Studio",
"description": "Mingle Studio作品集 - 动作捕捉制作的YouTube内容、VTuber直播、Shorts视频合集",
"ogTitle": "作品集 - Mingle Studio",
"ogDescription": "在动作捕捉工作室制作的音乐视频、短视频、VTuber直播等多样化视频内容。OptiTrack提供高品质动作捕捉服务"
},
"pageHeader": {
"title": "Portfolio",
"desc": "在Mingle Studio制作和合作的动作捕捉内容"
},
"channel": {
"title": "Mingle Studio 官方频道",
"desc": "在YouTube上查看最新动作捕捉内容和制作过程",
"btn": "访问YouTube频道"
},
"tabs": {
"individual": "个人创作者",
"corporate": "企业项目"
},
"longform": {
"title": "Long-Form 内容",
"desc": "个人创作者的动作捕捉项目"
},
"shorts": {
"title": "Shorts 内容",
"desc": "短小精悍的动作捕捉精彩瞬间"
},
"broadcast": {
"title": "实时直播示例",
"desc": "VTuber和主播的实时动作捕捉直播",
"noticeTitle": "实时动作捕捉直播",
"noticeDesc": "通过Mingle Studio进行的实时动作捕捉直播，体验高品质虚拟内容"
},
"corporate": {
"title": "企业项目",
"desc": "企业及商业动作捕捉项目",
"ixiaDesc": "虚拟偶像团体动作捕捉制作",
"mvSection": "音乐视频制作",
"shortsSection": "短视频制作",
"liveSection": "直播进行"
},
"cta": {
"title": "您的内容也可以在这里",
"desc": "与Mingle Studio一起成为下一个作品集的主角",
"btnInquiry": "项目咨询",
"btnServices": "了解服务"
},
"js": {
"checkNetwork": "请检查网络连接",
"shareTitle": "Mingle Studio 作品集",
"linkCopied": "视频链接已复制到剪贴板。",
"linkCopyFailed": "链接复制失败。"
}
},
"gallery": {
"meta": {
"title": "工作室画廊 - Mingle Studio",
"description": "Mingle Studio画廊 - 通过照片了解动作捕捉工作室的实际空间和设施",
"ogTitle": "工作室画廊 - Mingle Studio",
"ogDescription": "30台OptiTrack摄像头系统和8×7m大型拍摄空间。查看仁川唯一动作捕捉工作室的实际设施和设备"
},
"pageHeader": {
"title": "Studio Gallery",
"desc": "通过照片了解Mingle Studio的实际空间"
},
"captions": {
"exterior_open": "外观全景 窗帘打开",
"exterior_closed": "外观全景 窗帘关闭",
"control_room": "操作/控制室",
"powder_room": "化妆间（连接工作室）",
"changing_room_in": "更衣室（内部）",
"changing_room_out": "更衣室（外部）",
"audio_system": "高品质音响系统",
"mocap_space_1": "动作捕捉空间 001",
"mocap_space_2": "动作捕捉空间 002",
"mocap_space_3": "动作捕捉空间 003",
"mocap_space_4": "动作捕捉空间 004"
},
"panorama": {
"title": "360° Studio View",
"desc": "拖动鼠标360度全方位浏览工作室",
"clickToView": "点击体验360° VR全景",
"curtainOpen": "工作室全景（窗帘打开）",
"curtainClosed": "工作室全景（窗帘关闭）"
},
"js": {
"lightboxLabel": "图片查看器",
"close": "关闭",
"prevImage": "上一张",
"nextImage": "下一张",
"panoramaLoading": "360°图片加载中...",
"reset": "重置",
"autoRotate": "自动旋转",
"stop": "停止",
"zoomIn": "放大",
"zoomOut": "缩小",
"help": "帮助",
"helpTitle": "360° 操作指南",
"helpDrag": "拖动鼠标旋转画面",
"helpTouch": "在触摸屏上用手指拖动",
"helpZoom": "使用鼠标滚轮或捏合手势缩放",
"helpAutoRotate": "点击自动旋转按钮自动浏览",
"helpEsc": "按ESC键关闭",
"checkImageFile": "请检查图片文件"
}
},
"contact": {
"meta": {
"title": "联系我们 - Mingle Studio",
"description": "Mingle Studio联系方式 - 动作捕捉工作室场地租赁、拍摄、制作咨询与洽谈",
"ogTitle": "联系我们 - Mingle Studio",
"ogDescription": "动作捕捉工作室场地租赁、拍摄、制作相关咨询与洽谈。位于仁川科技谷的OptiTrack专业工作室"
},
"pageHeader": {
"title": "Contact Us",
"desc": "与Mingle Studio一起开启您的特别项目"
},
"phone": {
"title": "电话咨询",
"desc": "24小时可用"
},
"business": {
"title": "商务咨询",
"desc": "合作与协作咨询"
},
"reservation": {
"title": "预约与咨询",
"desc": "24小时受理"
},
"visit": {
"title": "到访工作室",
"desc": "需提前预约",
"link": "查看位置"
},
"location": {
"title": "工作室位置",
"address": "地址",
"addressValue": "(21330) 인천광역시 부평구 주부토로 236<br>인천테크노밸리 U1센터 A동 B105호",
"subway": "地铁",
"subwayDesc": "仁川7号线葛山站下车 → 步行约7分钟",
"bus": "公交",
"busStop": "갈산시장·갈산도서관 站",
"busRoutes": "4路、526路、555路公交",
"parking": "停车",
"parkingDesc": "基本2小时免费，使用楼内设施最多4小时免费",
"hours": "营业时间",
"hours24": "24小时营业",
"hoursAllYear": "全年无休",
"naverMap": "Naver地图",
"googleMap": "Google地图"
},
"cta": {
"title": "预约与咨询",
"desc": "便捷的在线预约或查看常见问题",
"btnNaver": "Naver预约",
"btnFaq": "查看FAQ"
},
"js": {
"checkInput": "请检查输入信息。",
"sending": "发送中...",
"sendSuccess": "咨询已成功发送。我们将尽快与您联系。",
"sendError": "发送过程中出现错误，请重试。",
"resetConfirm": "所有输入内容将被删除。是否继续？",
"invalidEmail": "请输入正确的邮箱地址。",
"invalidPhone": "请输入正确的电话号码。",
"required": "此为必填项。"
}
},
"qna": {
"meta": {
"title": "常见问题 - Mingle Studio",
"description": "Mingle Studio FAQ - 动作捕捉工作室场地租赁、拍摄、制作相关常见问题及解答",
"ogTitle": "常见问题 - Mingle Studio",
"ogDescription": "动作捕捉工作室场地租赁、拍摄、费用、预约等常见问题及解答。OptiTrack系统使用指南"
},
"pageHeader": {
"title": "常见问题",
"desc": "查看关于Mingle Studio使用的常见问题"
},
"search": {
"placeholder": "搜索您想了解的内容...",
"btnLabel": "搜索"
},
"categories": {
"all": "全部",
"booking": "预约/租赁",
"equipment": "设备/技术",
"pricing": "费用/支付",
"production": "制作/拍摄",
"streaming": "直播",
"etc": "其他"
},
"faq": {
"q1": "如何预约工作室场地租赁？",
"q2": "有预约金制度和退款规定吗？",
"q3": "最少租赁时间是多少？",
"q4": "需要提前多久预约场地？",
"q5": "可以现场支付吗？",
"q6": "可以开具增值税发票吗？",
"q7": "使用什么动作捕捉设备？",
"q8": "提供动作捕捉服装吗？",
"q9": "最多可以同时进行多少人的动作捕捉？",
"q10": "如何进行支付？",
"q11": "拍摄需要准备什么？",
"q12": "数据以什么格式提供？",
"q13": "可以进行实时直播吗？",
"q14": "可以停车吗？",
"q15": "可以参观或设施导览吗？",
"a1": "<p>您可以通过以下方式进行预约：</p>\n<ul>\n<li><strong><i class=\"fa-solid fa-envelope\" aria-hidden=\"true\"></i> 邮件：</strong> <a href=\"mailto:help@minglestudio.co.kr?subject=[工作室预约咨询] Mingle Studio&body=您好，我想咨询Mingle Studio场地租赁预约事宜。%0A%0A■ 基本信息%0A- 预计使用日期：（例：2024年12月25日）%0A- 使用时间：（例：下午2点~4点，2小时）%0A- 参与人数：人%0A- 联系方式：%0A- 邮箱：%0A%0A■ 拍摄信息%0A- 拍摄目的：（例：VTuber直播、游戏制作、视频内容等）%0A- 预计拍摄内容：%0A- 所需设备：（全身动作捕捉/面部捕捉/其他）%0A%0A■ 补充说明%0A- 特殊需求：%0A- 咨询事项：%0A%0A■ 参考信息%0A- 最少租赁：2小时（220,000韩元，含增值税）%0A- 延长：每小时110,000韩元%0A- 支付方式：银行转账或现金（不支持刷卡）%0A- 可开具现金收据/增值税发票%0A%0A我们将尽快回复。%0A谢谢。\">help@minglestudio.co.kr</a></li>\n<li><strong><i class=\"fa-solid fa-phone\" aria-hidden=\"true\"></i> 电话：</strong> 010-9288-9190</li>\n<li><strong><i class=\"fa-solid fa-calendar\" aria-hidden=\"true\"></i> Naver预约：</strong> <a href=\"https://m.booking.naver.com/booking/10/bizes/1468174/items/6949481\" target=\"_blank\">Naver Place实时预约</a></li>\n</ul>\n<div style=\"margin-top: var(--spacing-md); text-align: center;\">\n<button id=\"showEmailFormFAQ\" class=\"btn btn-primary\" style=\"font-size: 0.9rem; padding: 0.5rem 1rem;\"><i class=\"fa-solid fa-envelope\" aria-hidden=\"true\"></i> 邮件咨询</button>\n</div>\n<div id=\"emailFormFAQ\" class=\"email-form\" style=\"display:none; margin-top: var(--spacing-lg); padding: var(--spacing-lg); border: 1px solid #ddd; border-radius: var(--border-radius); background: #f9f9f9;\">\n<h4>邮件咨询表格</h4>\n<p>请复制以下表格并通过邮件发送咨询：</p>\n<div class=\"email-template\" style=\"background: white; padding: var(--spacing-md); border-radius: var(--border-radius); font-family: monospace; font-size: 0.9rem; line-height: 1.6;\">\n<div><strong>主题：</strong> [工作室租赁咨询]</div>\n<div><strong>收件人：</strong> help@minglestudio.co.kr</div>\n<br>\n<div><strong>1. 姓名及所属单位</strong></div>\n<div style=\"color: #666; font-size: 0.85rem;\">（个人请填写姓名，企业请填写使用者姓名和所属单位）</div>\n<div style=\"margin: 0.5rem 0; padding: 0.5rem; background: #f0f0f0; border-radius: 4px;\">[请在此填写]</div>\n<div><strong>2. 联系方式</strong></div>\n<div style=\"color: #666; font-size: 0.85rem;\">（电话、邮箱、Discord 任选其一）</div>\n<div style=\"margin: 0.5rem 0; padding: 0.5rem; background: #f0f0f0; border-radius: 4px;\">[请在此填写]</div>\n<div><strong>3. 使用人数</strong></div>\n<div style=\"color: #666; font-size: 0.85rem;\">（建议1~2人，最多5人）</div>\n<div style=\"margin: 0.5rem 0; padding: 0.5rem; background: #f0f0f0; border-radius: 4px;\">\u25a1 1人 \u25a1 2人 \u25a1 3人 \u25a1 4人 \u25a1 5人</div>\n<div><strong>4. 工作室使用用途</strong></div>\n<div style=\"margin: 0.5rem 0; padding: 0.5rem; background: #f0f0f0; border-radius: 4px;\">\u25a1 录制 \u25a1 其他：[请在此填写]</div>\n<div><strong>5. 希望租赁日期</strong></div>\n<div style=\"color: #666; font-size: 0.85rem;\">※ 建议至少提前2周预约</div>\n<div style=\"margin: 0.5rem 0; padding: 0.5rem; background: #f0f0f0; border-radius: 4px;\">[请在此填写]</div>\n<div><strong>6. 希望使用时间</strong></div>\n<div style=\"color: #666; font-size: 0.85rem;\">※ 示例：上午10点~下午3点（5小时）</div>\n<div style=\"color: #666; font-size: 0.85rem;\">※ 凌晨租赁（晚10点~次日8点）按内部规定执行特殊费率</div>\n<div style=\"margin: 0.5rem 0; padding: 0.5rem; background: #f0f0f0; border-radius: 4px;\">[请在此填写]</div>\n</div>\n<div style=\"margin-top: var(--spacing-md); text-align: center;\">\n<a href=\"mailto:help@minglestudio.co.kr?subject=[工作室租赁咨询]\" class=\"btn btn-primary\"><i class=\"fa-solid fa-envelope\" aria-hidden=\"true\"></i> 立即发送邮件</a>\n</div>\n</div>\n<p>请至少提前2周联系我们，以便顺利准备。</p>",
"a2": "<p>以下是退款规定：</p>\n<div class=\"policy-table\">\n<div class=\"policy-row\">\n<span class=\"policy-time\">预约日7天前</span>\n<span class=\"policy-desc\">100%退款</span>\n</div>\n<div class=\"policy-row\">\n<span class=\"policy-time\">预约日3天前</span>\n<span class=\"policy-desc\">70%退款</span>\n</div>\n<div class=\"policy-row\">\n<span class=\"policy-time\">预约日1天前</span>\n<span class=\"policy-desc\">50%退款</span>\n</div>\n<div class=\"policy-row\">\n<span class=\"policy-time\">当天取消</span>\n<span class=\"policy-desc\">不可退款</span>\n</div>\n</div>",
"a3": "<p>最少租赁时间为<strong>2小时</strong>起。</p>\n<p>可按1小时为单位延长。</p>",
"a4": "<p>请至少提前2周联系我们，以便顺利准备。</p>",
"a5": "<p>现场可使用现金支付或银行转账。</p>\n<p>请注意，现场不支持刷卡支付。</p>\n<p>可开具现金收据及增值税发票。</p>",
"a6": "<p>是的，可以开具增值税发票。</p>",
"a7": "<p>Mingle Studio配备了以下专业设备：</p>\n<ul>\n<li><strong>OptiTrack 摄像头：</strong> 30台</li>\n<li><strong>手部追踪：</strong> 使用Rokoko智能手套</li>\n</ul>",
"a8": "<p>是的，免费提供专业动作捕捉服装和标记点。</p>\n<ul>\n<li>备有多种尺码（S、M、L、XL）</li>\n<li>卫生管理，保持整洁状态</li>\n<li>也可自带服装</li>\n<li>包含手套、头带等配件</li>\n</ul>",
"a9": "<p>最多可<strong>5人</strong>同时进行动作捕捉。</p>\n<p>各人数详细信息：</p>\n<ul>\n<li><strong>1人：</strong> 最高精度捕捉</li>\n<li><strong>2人：</strong> 最适合互动场景</li>\n<li><strong>3-5人：</strong> 可进行团体表演</li>\n</ul>\n<p>人数越多，捕捉空间和精度可能会受到一定限制。</p>",
"a10": "<p>我们支持以下支付方式：</p>\n<ul>\n<li><strong>银行转账：</strong> 预约确认后24小时内</li>\n<li><strong>现金支付：</strong> 可现场支付</li>\n<li><strong>刷卡支付：</strong> 现场不可用</li>\n<li><strong>增值税发票：</strong> 可为企业客户开具</li>\n<li><strong>现金收据：</strong> 可为个人客户开具</li>\n</ul>\n<p>预约金（30%）在预约确认时支付，尾款（70%）可在拍摄当天支付。</p>",
"a11": "<p>基本上需要做以下准备：</p>\n<ul>\n<li><strong>鞋子：</strong> 必须穿袜子</li>\n<li><strong>眼镜：</strong> 不能戴眼镜（建议戴隐形眼镜）</li>\n<li><strong>头发：</strong> 长发请扎起来</li>\n<li><strong>饰品：</strong> 请取下手表、戒指等</li>\n<li><strong>化妆：</strong> 请避免浓妆</li>\n</ul>\n<p>动作捕捉服装和标记点由工作室提供。</p>",
"a12": "<p>我们提供以下格式的数据：</p>\n<ul>\n<li><strong>FBX文件：</strong> 兼容Unity、Unreal Engine</li>\n<li><strong>ANIM文件：</strong> 直接兼容Unity Animator</li>\n<li><strong>MP4视频：</strong> 参考视频</li>\n</ul>\n<p>咨询时将提供详细信息，数据通过云端传送。</p>",
"a13": "<p><strong>是的，通过我们的Streamingle服务可以进行实时直播。</strong></p>\n<p>动作捕捉数据可以实时推送，用于直播。</p>\n<p>详细信息请参考服务页面的Streamingle服务部分。</p>",
"a14": "<p>是的，可以停车：</p>\n<ul>\n<li><strong>基本：</strong> 2小时免费</li>\n<li><strong>使用楼内设施时：</strong> 额外2小时，最多4小时免费</li>\n<li><strong>位置：</strong> 仁川科技谷大楼停车场</li>\n</ul>",
"a15": "<p>参观和导览需提前咨询确认是否可行：</p>\n<ul>\n<li><strong>提前咨询：</strong> 必须（根据工作室情况可能会被拒绝）</li>\n<li><strong>联系方式：</strong> help@minglestudio.co.kr</li>\n<li><strong>参观时间：</strong> 批准后协商（约30分钟）</li>\n<li><strong>费用：</strong> 免费</li>\n</ul>\n<p>根据工作室运营情况，参观可能会受到限制，敬请谅解。</p>"
},
"cta": {
"title": "没有找到想要的答案？",
"desc": "如有任何疑问，请随时联系我们",
"btnContact": "联系我们",
"btnCall": "电话咨询"
}
},
"error404": {
"meta": {
"title": "页面未找到 - Mingle Studio"
},
"title": "页面未找到",
"desc": "抱歉，您请求的页面不存在或已被移动。<br>请通过以下链接查找您需要的信息。",
"btnHome": "返回首页",
"btnContact": "联系我们",
"searchPlaceholder": "搜索您需要的内容...",
"helpfulLinks": "可能有帮助的页面",
"linkAbout": "关于我们",
"linkServices": "服务介绍",
"linkPortfolio": "作品集",
"linkGallery": "工作室画廊",
"linkQna": "常见问题",
"linkContact": "联系方式与位置"
}
}

185
index.html
View File

@ -184,7 +184,7 @@
</head>
<body>
<a href="#main-content" class="skip-to-content">본문 바로가기</a>
<a href="#main-content" class="skip-to-content" data-i18n="common.skipToContent">본문 바로가기</a>
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-PPTNN6WD"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
@ -196,61 +196,61 @@
<button class="popup-close-x" id="popupCloseX" aria-label="팝업 닫기">×</button>
<div class="popup-header">
<h2 class="popup-title"><i class="fa-solid fa-bullhorn" aria-hidden="true"></i> 요금제 변경 안내</h2>
<p class="popup-subtitle">2026년 3월부터 적용되었습니다</p>
<div class="popup-badge">시행 중</div>
<h2 class="popup-title"><i class="fa-solid fa-bullhorn" aria-hidden="true"></i> <span data-i18n="index.popup.title">요금제 변경 안내</span></h2>
<p class="popup-subtitle" data-i18n="index.popup.subtitle">2026년 3월부터 적용되었습니다</p>
<div class="popup-badge" data-i18n="index.popup.badge">시행 중</div>
</div>
<div class="popup-body">
<div class="popup-section">
<h3 class="popup-section-title">주요 변경사항</h3>
<h3 class="popup-section-title" data-i18n="index.popup.mainChanges">주요 변경사항</h3>
<div class="change-card">
<div class="change-card-header">
<span class="change-card-title"><i class="fa-solid fa-clock-rotate-left" aria-hidden="true"></i> 할인 이벤트 종료</span>
<span class="change-card-title"><i class="fa-solid fa-clock-rotate-left" aria-hidden="true"></i> <span data-i18n="index.popup.discountEnd">할인 이벤트 종료</span></span>
<span class="change-badge badge-end">종료</span>
</div>
<p class="change-description">오픈 기념 20% 할인 이벤트가 <strong>2월 28일</strong>부로 종료되었으며, 현재 정상가가 적용되고 있습니다.</p>
<p class="change-description" data-i18n-html="index.popup.discountEndDesc">오픈 기념 20% 할인 이벤트가 <strong>2월 28일</strong>부로 종료되었으며, 현재 정상가가 적용되고 있습니다.</p>
</div>
<div class="change-card">
<div class="change-card-header">
<span class="change-card-title"><i class="fa-solid fa-plus-circle" aria-hidden="true"></i> 스트리밍글 4시간 서비스 신설</span>
<span class="change-card-title"><i class="fa-solid fa-plus-circle" aria-hidden="true"></i> <span data-i18n="index.popup.streaming4h">스트리밍글 4시간 서비스 신설</span></span>
<span class="change-badge badge-new">NEW</span>
</div>
<div class="change-price">
<span class="change-price-amount">1,400,000원</span>
<span class="change-price-unit">/ 4시간 패키지</span>
</div>
<p class="change-description">기존 스트리밍글 서비스(6시간)와 동일한 혜택을 4시간 패키지로 이용할 수 있습니다.</p>
<p class="change-description" data-i18n="index.popup.streaming4hDesc">기존 스트리밍글 서비스(6시간)와 동일한 혜택을 4시간 패키지로 이용할 수 있습니다.</p>
</div>
<div class="change-card">
<div class="change-card-header">
<span class="change-card-title"><i class="fa-solid fa-user-plus" aria-hidden="true"></i> 추천인 제도 오픈</span>
<span class="change-card-title"><i class="fa-solid fa-user-plus" aria-hidden="true"></i> <span data-i18n="index.popup.referral">추천인 제도 오픈</span></span>
<span class="change-badge badge-new">NEW</span>
</div>
<p class="change-description">친구를 소개하면 소개한 분, 소개받은 분 모두에게 <strong>20% 할인권</strong>을 드립니다. (1회 사용, 중복 적용 불가)</p>
<p class="change-description" data-i18n-html="index.popup.referralDesc">친구를 소개하면 소개한 분, 소개받은 분 모두에게 <strong>20% 할인권</strong>을 드립니다. (1회 사용, 중복 적용 불가)</p>
</div>
</div>
<div class="popup-notice">
<p>※ 변경된 요금이 서비스 페이지에 반영되었습니다</p>
<p data-i18n="index.popup.notice">※ 변경된 요금이 서비스 페이지에 반영되었습니다</p>
</div>
<div class="popup-info">
<div class="info-item">
<div class="info-label">적용 시기</div>
<div class="info-value">2026년 3월~</div>
<div class="info-label" data-i18n="index.popup.effectiveDate">적용 시기</div>
<div class="info-value" data-i18n="index.popup.effectiveDateValue">2026년 3월~</div>
</div>
<div class="info-item">
<div class="info-label">문의 메일</div>
<div class="info-label" data-i18n="index.popup.inquiryEmail">문의 메일</div>
<div class="info-value">help@minglestudio.co.kr</div>
</div>
</div>
<button class="popup-cta" id="popupCtaBtn">
<button class="popup-cta" id="popupCtaBtn" data-i18n="index.popup.ctaBtn">
현재 서비스 요금 보기 →
</button>
</div>
@ -258,9 +258,9 @@
<div class="popup-footer">
<div class="popup-checkbox">
<input type="checkbox" id="dontShowToday">
<label for="dontShowToday">하루동안 보지 않기</label>
<label for="dontShowToday" data-i18n="index.popup.dontShowToday">하루동안 보지 않기</label>
</div>
<button class="popup-close-btn" id="popupCloseBtn">닫기</button>
<button class="popup-close-btn" id="popupCloseBtn" data-i18n="index.popup.close">닫기</button>
</div>
</div>
</div>
@ -302,31 +302,31 @@
<div class="logo-glow"></div>
</div>
<h1 class="hero-title">
밍글스튜디오<br>
<span class="hero-subtitle gradient-text">MINGLE STUDIO</span>
<span data-i18n="index.hero.title">밍글스튜디오</span><br>
<span class="hero-subtitle gradient-text" data-i18n="index.hero.subtitle">MINGLE STUDIO</span>
</h1>
<p class="hero-description">
<p class="hero-description" data-i18n-html="index.hero.description">
기술과 창의력 열정이 한데 섞여<br>
새로운 가치가 만들어지는 공간
</p>
<div class="hero-buttons">
<a href="/about" class="btn btn-primary">회사 소개 보기</a>
<a href="/contact" class="btn btn-outline">예약 문의하기</a>
<a href="/about" class="btn btn-primary" data-i18n="index.hero.btnAbout">회사 소개 보기</a>
<a href="/contact" class="btn btn-outline" data-i18n="index.hero.btnContact">예약 문의하기</a>
</div>
<!-- 스펙 카운터 -->
<div class="hero-specs">
<div class="spec-item">
<span class="spec-number"><span class="counter" data-target="30">0</span><span class="spec-unit">대</span></span>
<span class="spec-label">OptiTrack 카메라</span>
<span class="spec-label" data-i18n="index.hero.specCamera">OptiTrack 카메라</span>
</div>
<div class="spec-item">
<span class="spec-number">8<span class="spec-unit">m</span> × 7<span class="spec-unit">m</span></span>
<span class="spec-label">캡쳐 공간</span>
<span class="spec-label" data-i18n="index.hero.specSpace">캡쳐 공간</span>
</div>
<div class="spec-item">
<span class="spec-number"><span class="counter" data-target="20">0</span><span class="spec-unit">만원</span></span>
<span class="spec-label">시간당 대관료</span>
<span class="spec-number"><span class="counter" data-target="20">0</span><span class="spec-unit" data-i18n="index.hero.specPriceUnit">만원</span></span>
<span class="spec-label" data-i18n="index.hero.specPrice">시간당 대관료</span>
</div>
</div>
</div>
@ -385,29 +385,29 @@
<div class="showcase-mobile-media">
<iframe src="https://www.youtube-nocookie.com/embed/rM9GEe0tb_I?autoplay=1&mute=1&loop=1&playlist=rM9GEe0tb_I&controls=0&playsinline=1" title="모션캡쳐 워크플로우 영상" allow="autoplay; encrypted-media" allowfullscreen loading="lazy"></iframe>
</div>
<div class="showcase-step-label">Equipment</div>
<h2 class="showcase-step-title">최첨단 모션캡쳐 시스템</h2>
<p class="showcase-step-desc">OptiTrack 광학식 카메라, Rokoko 글러브, ARKit 페이셜 캡쳐까지 — 전신부터 손끝, 표정까지 정밀하게 트래킹합니다.</p>
<div class="showcase-step-label" data-i18n="index.showcase.step1.label">Equipment</div>
<h2 class="showcase-step-title" data-i18n="index.showcase.step1.title">최첨단 모션캡쳐 시스템</h2>
<p class="showcase-step-desc" data-i18n="index.showcase.step1.desc">OptiTrack 광학식 카메라, Rokoko 글러브, ARKit 페이셜 캡쳐까지 — 전신부터 손끝, 표정까지 정밀하게 트래킹합니다.</p>
<div class="showcase-features">
<div class="showcase-feature-item">
<span class="showcase-feature-icon"><i class="fa-solid fa-clapperboard" aria-hidden="true"></i></span>
<div>
<strong>OptiTrack 카메라 30대</strong>
<span>서브밀리미터 수준 광학식 모션 트래킹</span>
<strong data-i18n="index.showcase.step1.feature1Title">OptiTrack 카메라 30대</strong>
<span data-i18n="index.showcase.step1.feature1Desc">서브밀리미터 수준 광학식 모션 트래킹</span>
</div>
</div>
<div class="showcase-feature-item">
<span class="showcase-feature-icon"><i class="fa-solid fa-hand" aria-hidden="true"></i></span>
<div>
<strong>Rokoko 글러브 5대</strong>
<span>손가락 관절까지 정밀한 핸드 캡쳐</span>
<strong data-i18n="index.showcase.step1.feature2Title">Rokoko 글러브 5대</strong>
<span data-i18n="index.showcase.step1.feature2Desc">손가락 관절까지 정밀한 핸드 캡쳐</span>
</div>
</div>
<div class="showcase-feature-item">
<span class="showcase-feature-icon"><i class="fa-solid fa-mobile-screen" aria-hidden="true"></i></span>
<div>
<strong>ARKit 페이셜 캡쳐 (iPhone 5대)</strong>
<span>iPhone 기반 고정밀 표정 캡쳐</span>
<strong data-i18n="index.showcase.step1.feature3Title">ARKit 페이셜 캡쳐 (iPhone 5대)</strong>
<span data-i18n="index.showcase.step1.feature3Desc">iPhone 기반 고정밀 표정 캡쳐</span>
</div>
</div>
</div>
@ -418,22 +418,22 @@
<div class="showcase-mobile-media">
<img src="/images/studio/넓은 모션 캡쳐 공간 002.webp" alt="넓은 모션캡쳐 공간" loading="lazy">
</div>
<div class="showcase-step-label">Space</div>
<h2 class="showcase-step-title">넓고 최적화된 캡쳐 공간</h2>
<p class="showcase-step-desc">8m x 7m x 2.6m 규모의 전용 캡쳐 볼륨으로 자유로운 움직임이 가능합니다.</p>
<div class="showcase-step-label" data-i18n="index.showcase.step2.label">Space</div>
<h2 class="showcase-step-title" data-i18n="index.showcase.step2.title">넓고 최적화된 캡쳐 공간</h2>
<p class="showcase-step-desc" data-i18n="index.showcase.step2.desc">8m x 7m x 2.6m 규모의 전용 캡쳐 볼륨으로 자유로운 움직임이 가능합니다.</p>
<div class="showcase-features">
<div class="showcase-feature-item">
<span class="showcase-feature-icon"><i class="fa-solid fa-ruler-combined" aria-hidden="true"></i></span>
<div>
<strong>8m × 7m × 2.6m</strong>
<span>넓은 전용 캡쳐 볼륨</span>
<strong data-i18n="index.showcase.step2.feature1Title">8m × 7m × 2.6m</strong>
<span data-i18n="index.showcase.step2.feature1Desc">넓은 전용 캡쳐 볼륨</span>
</div>
</div>
<div class="showcase-feature-item">
<span class="showcase-feature-icon"><i class="fa-solid fa-gamepad" aria-hidden="true"></i></span>
<div>
<strong>실시간 스트리밍</strong>
<span>스트리밍글 서비스로 라이브 방송</span>
<strong data-i18n="index.showcase.step2.feature2Title">실시간 스트리밍</strong>
<span data-i18n="index.showcase.step2.feature2Desc">스트리밍글 서비스로 라이브 방송</span>
</div>
</div>
</div>
@ -444,32 +444,32 @@
<div class="showcase-mobile-media">
<iframe src="https://www.youtube-nocookie.com/embed/YO7-z_JxSjY?autoplay=1&mute=1&loop=1&playlist=YO7-z_JxSjY&controls=0&playsinline=1" title="모션캡쳐 결과물 영상" allow="autoplay; encrypted-media" allowfullscreen loading="lazy"></iframe>
</div>
<div class="showcase-step-label">Services</div>
<h2 class="showcase-step-title">주요 활용 분야</h2>
<p class="showcase-step-desc">다양한 크리에이티브 프로젝트를 전문 오퍼레이터가 지원합니다.</p>
<div class="showcase-step-label" data-i18n="index.showcase.step3.label">Services</div>
<h2 class="showcase-step-title" data-i18n="index.showcase.step3.title">주요 활용 분야</h2>
<p class="showcase-step-desc" data-i18n="index.showcase.step3.desc">다양한 크리에이티브 프로젝트를 전문 오퍼레이터가 지원합니다.</p>
<div class="showcase-services-grid">
<div class="showcase-service">
<span><i class="fa-solid fa-masks-theater" aria-hidden="true"></i></span>
<strong>버추얼 콘텐츠</strong>
<span class="showcase-service-sub">VTuber, 버추얼 아이돌</span>
<strong data-i18n="index.showcase.step3.virtual">버추얼 콘텐츠</strong>
<span class="showcase-service-sub" data-i18n="index.showcase.step3.virtualSub">VTuber, 버추얼 아이돌</span>
</div>
<div class="showcase-service">
<span><i class="fa-solid fa-gamepad" aria-hidden="true"></i></span>
<strong>게임 개발</strong>
<span class="showcase-service-sub">캐릭터 애니메이션</span>
<strong data-i18n="index.showcase.step3.game">게임 개발</strong>
<span class="showcase-service-sub" data-i18n="index.showcase.step3.gameSub">캐릭터 애니메이션</span>
</div>
<div class="showcase-service">
<span><i class="fa-solid fa-film" aria-hidden="true"></i></span>
<strong>영상 제작</strong>
<span class="showcase-service-sub">VFX, 버추얼 프로덕션</span>
<strong data-i18n="index.showcase.step3.video">영상 제작</strong>
<span class="showcase-service-sub" data-i18n="index.showcase.step3.videoSub">VFX, 버추얼 프로덕션</span>
</div>
<div class="showcase-service">
<span><i class="fa-solid fa-vr-cardboard" aria-hidden="true"></i></span>
<strong>메타버스</strong>
<span class="showcase-service-sub">3D 아바타 콘텐츠</span>
<strong data-i18n="index.showcase.step3.metaverse">메타버스</strong>
<span class="showcase-service-sub" data-i18n="index.showcase.step3.metaverseSub">3D 아바타 콘텐츠</span>
</div>
</div>
<a href="/services" class="btn btn-secondary showcase-btn">전체 서비스 보기</a>
<a href="/services" class="btn btn-secondary showcase-btn" data-i18n="index.showcase.step3.btnServices">전체 서비스 보기</a>
</div>
<!-- Step 4: 스튜디오 -->
@ -477,26 +477,26 @@
<div class="showcase-mobile-media">
<img src="/images/studio/오퍼레이팅 공간 강조.webp" alt="오퍼레이팅 공간" loading="lazy">
</div>
<div class="showcase-step-label">Studio</div>
<h2 class="showcase-step-title">스튜디오 공간</h2>
<p class="showcase-step-desc">메인 캡쳐 공간부터 컨트롤룸, 프라이빗 룸까지 모든 환경이 갖춰져 있습니다. 전문 기술 지원과 함께 최적의 캡쳐 경험을 제공합니다.</p>
<div class="showcase-step-label" data-i18n="index.showcase.step4.label">Studio</div>
<h2 class="showcase-step-title" data-i18n="index.showcase.step4.title">스튜디오 공간</h2>
<p class="showcase-step-desc" data-i18n="index.showcase.step4.desc">메인 캡쳐 공간부터 컨트롤룸, 프라이빗 룸까지 모든 환경이 갖춰져 있습니다. 전문 기술 지원과 함께 최적의 캡쳐 경험을 제공합니다.</p>
<div class="showcase-features">
<div class="showcase-feature-item">
<span class="showcase-feature-icon"><i class="fa-solid fa-screwdriver-wrench" aria-hidden="true"></i></span>
<div>
<strong>전문 기술 지원</strong>
<span>숙련된 오퍼레이터의 실시간 서포트</span>
<strong data-i18n="index.showcase.step4.feature1Title">전문 기술 지원</strong>
<span data-i18n="index.showcase.step4.feature1Desc">숙련된 오퍼레이터의 실시간 서포트</span>
</div>
</div>
<div class="showcase-feature-item">
<span class="showcase-feature-icon"><i class="fa-solid fa-lock" aria-hidden="true"></i></span>
<div>
<strong>프라이빗 환경</strong>
<span>독립된 공간에서 집중 작업</span>
<strong data-i18n="index.showcase.step4.feature2Title">프라이빗 환경</strong>
<span data-i18n="index.showcase.step4.feature2Desc">독립된 공간에서 집중 작업</span>
</div>
</div>
</div>
<a href="/gallery" class="btn btn-primary showcase-btn">갤러리 보기</a>
<a href="/gallery" class="btn btn-primary showcase-btn" data-i18n="index.showcase.step4.btnGallery">갤러리 보기</a>
</div>
</div>
</div>
@ -506,15 +506,15 @@
<section class="portfolio-preview section bg-light">
<div class="container">
<div class="section-header reveal" data-reveal="up">
<h2>포트폴리오</h2>
<p>밍글 스튜디오에서 제작하고 협업한 모션캡쳐 콘텐츠</p>
<h2 data-i18n="index.portfolio.title">포트폴리오</h2>
<p data-i18n="index.portfolio.desc">밍글 스튜디오에서 제작하고 협업한 모션캡쳐 콘텐츠</p>
</div>
<!-- 탭 버튼 -->
<div class="portfolio-tab-nav reveal" data-reveal="up" data-delay="100">
<button class="portfolio-tab-btn active" data-portfolio-tab="creator">개인 크리에이터</button>
<button class="portfolio-tab-btn" data-portfolio-tab="corporate">기업 프로젝트</button>
<button class="portfolio-tab-btn" data-portfolio-tab="shorts">Shorts</button>
<button class="portfolio-tab-btn active" data-portfolio-tab="creator" data-i18n="index.portfolio.tabCreator">개인 크리에이터</button>
<button class="portfolio-tab-btn" data-portfolio-tab="corporate" data-i18n="index.portfolio.tabCorporate">기업 프로젝트</button>
<button class="portfolio-tab-btn" data-portfolio-tab="shorts" data-i18n="index.portfolio.tabShorts">Shorts</button>
</div>
<!-- 개인 크리에이터 탭 -->
@ -643,7 +643,7 @@
</div>
<div class="text-center mt-4 reveal" data-reveal="up">
<a href="/portfolio" class="btn btn-secondary">전체 포트폴리오 보기 →</a>
<a href="/portfolio" class="btn btn-secondary" data-i18n="index.portfolio.btnMore">전체 포트폴리오 보기 →</a>
</div>
</div>
</section>
@ -652,8 +652,8 @@
<section class="partner-streamer-section section">
<div class="container">
<div class="section-header reveal" data-reveal="fade">
<h2>파트너 스트리머</h2>
<p>밍글 스튜디오와 함께 콘텐츠를 만드는 크리에이터</p>
<h2 data-i18n="index.partner.title">파트너 스트리머</h2>
<p data-i18n="index.partner.desc">밍글 스튜디오와 함께 콘텐츠를 만드는 크리에이터</p>
</div>
<div class="streamer-grid stagger-children">
@ -663,11 +663,11 @@
</div>
<h3>구슬요</h3>
<p class="streamer-handle">@beadyo97</p>
<p class="streamer-desc">떼굴떼굴 구슬요! 소통, 노래, 게임, VRChat 등 다양한 콘텐츠를 선보이는 버츄얼 스트리머</p>
<p class="streamer-desc" data-i18n="index.partner.streamer1.desc">떼굴떼굴 구슬요! 소통, 노래, 게임, VRChat 등 다양한 콘텐츠를 선보이는 버츄얼 스트리머</p>
<div class="streamer-tags">
<span class="streamer-tag">VTuber</span>
<span class="streamer-tag">노래</span>
<span class="streamer-tag">게임</span>
<span class="streamer-tag" data-i18n="index.partner.streamer1.tagSong">노래</span>
<span class="streamer-tag" data-i18n="index.partner.streamer1.tagGame">게임</span>
<span class="streamer-tag">VRChat</span>
</div>
<div class="streamer-links">
@ -685,8 +685,8 @@
<section class="creator-signs-section section">
<div class="container">
<div class="section-header reveal" data-reveal="fade">
<h2>방문 크리에이터</h2>
<p>밍글 스튜디오를 방문한 크리에이터들의 사인</p>
<h2 data-i18n="index.creatorSigns.title">방문 크리에이터</h2>
<p data-i18n="index.creatorSigns.desc">밍글 스튜디오를 방문한 크리에이터들의 사인</p>
</div>
<div class="signs-marquee">
@ -733,8 +733,8 @@
<section class="partners-section section">
<div class="container">
<div class="section-header reveal" data-reveal="up">
<h2>클라이언트</h2>
<p>다양한 분야의 기업들과 함께 혁신적인 모션캡쳐 콘텐츠를 제작합니다</p>
<h2 data-i18n="index.clients.title">클라이언트</h2>
<p data-i18n="index.clients.desc">다양한 분야의 기업들과 함께 혁신적인 모션캡쳐 콘텐츠를 제작합니다</p>
</div>
<!-- 클라이언트 로고 마키 -->
@ -758,13 +758,13 @@
<div class="container">
<div class="faq-shortcut-inner reveal" data-reveal="up">
<div class="faq-shortcut-content">
<span class="faq-shortcut-label">FAQ</span>
<h2 class="faq-shortcut-title">처음이라 막막하신가요?</h2>
<p class="faq-shortcut-desc">모션캡쳐가 처음이어도 괜찮습니다. 예약부터 촬영까지 자주 묻는 질문을 정리했어요.</p>
<span class="faq-shortcut-label" data-i18n="index.faqShortcut.label">FAQ</span>
<h2 class="faq-shortcut-title" data-i18n="index.faqShortcut.title">처음이라 막막하신가요?</h2>
<p class="faq-shortcut-desc" data-i18n="index.faqShortcut.desc">모션캡쳐가 처음이어도 괜찮습니다. 예약부터 촬영까지 자주 묻는 질문을 정리했어요.</p>
</div>
<div class="faq-shortcut-actions">
<a href="/qna" class="btn btn-primary btn-lg">자주 묻는 질문 보기</a>
<a href="/contact" class="btn btn-ghost btn-lg">1:1 문의하기</a>
<a href="/qna" class="btn btn-primary btn-lg" data-i18n="index.faqShortcut.btnFaq">자주 묻는 질문 보기</a>
<a href="/contact" class="btn btn-ghost btn-lg" data-i18n="index.faqShortcut.btnContact">1:1 문의하기</a>
</div>
</div>
</div>
@ -774,36 +774,36 @@
<section class="cta-section">
<div class="cta-bg"></div>
<div class="container text-center">
<div class="cta-label reveal" data-reveal="fade">Get Started</div>
<h2 class="cta-title reveal" data-reveal="fade" data-delay="100">당신의 아이디어,<br>움직임으로 만들어 드립니다</h2>
<p class="cta-description reveal" data-reveal="up" data-delay="200">
<div class="cta-label reveal" data-reveal="fade" data-i18n="index.cta.label">Get Started</div>
<h2 class="cta-title reveal" data-reveal="fade" data-delay="100" data-i18n-html="index.cta.title">당신의 아이디어,<br>움직임으로 만들어 드립니다</h2>
<p class="cta-description reveal" data-reveal="up" data-delay="200" data-i18n="index.cta.desc">
전문 모션캡쳐 스튜디오에서 크리에이티브의 새로운 가능성을 경험하세요
</p>
<div class="cta-buttons reveal" data-reveal="up" data-delay="300">
<a href="/contact" class="btn btn-primary btn-lg">예약 문의하기</a>
<a href="https://m.booking.naver.com/booking/10/bizes/1468174/items/6949481" target="_blank" class="btn btn-outline btn-lg">네이버 예약</a>
<a href="/contact" class="btn btn-primary btn-lg" data-i18n="index.cta.btnReserve">예약 문의하기</a>
<a href="https://m.booking.naver.com/booking/10/bizes/1468174/items/6949481" target="_blank" class="btn btn-outline btn-lg" data-i18n="index.cta.btnNaver">네이버 예약</a>
</div>
<div class="contact-info-quick reveal" data-reveal="up" data-delay="400">
<div class="info-quick-item">
<span class="info-quick-icon"><i class="fa-solid fa-envelope" aria-hidden="true"></i></span>
<div>
<span class="info-quick-label">예약 문의</span>
<span class="info-quick-label" data-i18n="index.cta.infoReservation">예약 문의</span>
<span class="info-quick-value">help@minglestudio.co.kr</span>
</div>
</div>
<div class="info-quick-item">
<span class="info-quick-icon"><i class="fa-solid fa-briefcase" aria-hidden="true"></i></span>
<div>
<span class="info-quick-label">비즈니스</span>
<span class="info-quick-label" data-i18n="index.cta.infoBusiness">비즈니스</span>
<span class="info-quick-value">minglestudio@minglestudio.co.kr</span>
</div>
</div>
<div class="info-quick-item">
<span class="info-quick-icon"><i class="fa-solid fa-location-dot" aria-hidden="true"></i></span>
<div>
<span class="info-quick-label">오시는 길</span>
<span class="info-quick-value">인천 부평구 주부토로 236, 인천테크노밸리</span>
<span class="info-quick-label" data-i18n="index.cta.infoDirections">오시는 길</span>
<span class="info-quick-value" data-i18n="index.cta.infoAddress">인천 부평구 주부토로 236, 인천테크노밸리</span>
</div>
</div>
</div>
@ -850,6 +850,7 @@
</footer>
<!-- JavaScript -->
<script src="js/i18n.js"></script>
<script src="js/common.js"></script>
<script src="js/main.js"></script>
<script src="js/popup.js"></script>

32
js/common.js
View File

@ -13,9 +13,18 @@
// DOM 로드 완료 후 실행
document.addEventListener('DOMContentLoaded', async function() {
showPageLoading();
// i18n 초기화 (언어 감지 + JSON 로드)
if (window.i18n) {
await window.i18n.init();
}
initializeNavigation();
setActiveNavLink();
await loadComponents();
// 컴포넌트 로드 후 i18n 번역 적용 + 언어 스위처 초기화
if (window.i18n) {
window.i18n.translateDOM();
window.i18n.initSwitcher();
}
initLazyLoading();
initRevealAnimations();
createFloatingSNS();
@ -53,7 +62,7 @@ async function loadComponents() {
footerPlaceholder.innerHTML = html;
// 동적 푸터 로드 성공 시 백업 푸터 숨기기
const backupFooter = document.querySelector('footer.site-footer');
const backupFooter = document.getElementById('backupFooter');
if (backupFooter) {
backupFooter.style.display = 'none';
}
@ -76,7 +85,9 @@ function initializeNavigation() {
const isActive = hamburger.classList.toggle('active');
navMenu.classList.toggle('active');
hamburger.setAttribute('aria-expanded', isActive);
hamburger.setAttribute('aria-label', isActive ? '메뉴 닫기' : '메뉴 열기');
const closeLabel = (window.i18n && window.i18n.t) ? window.i18n.t('header.menuClose', '메뉴 닫기') : '메뉴 닫기';
const openLabel = (window.i18n && window.i18n.t) ? window.i18n.t('header.menuOpen', '메뉴 열기') : '메뉴 열기';
hamburger.setAttribute('aria-label', isActive ? closeLabel : openLabel);
});
// 네비게이션 링크 클릭 시 모바일 메뉴 닫기
@ -85,7 +96,7 @@ function initializeNavigation() {
hamburger.classList.remove('active');
navMenu.classList.remove('active');
hamburger.setAttribute('aria-expanded', 'false');
hamburger.setAttribute('aria-label', '메뉴 열기');
hamburger.setAttribute('aria-label', (window.i18n && window.i18n.t) ? window.i18n.t('header.menuOpen', '메뉴 열기') : '메뉴 열기');
});
});
}
@ -305,9 +316,10 @@ function showPageLoading() {
const loadingOverlay = document.createElement('div');
loadingOverlay.id = 'pageLoadingOverlay';
loadingOverlay.className = 'loading-overlay';
const loadingText = (window.i18n && window.i18n.t) ? window.i18n.t('common.loading', '페이지를 불러오는 중...') : '페이지를 불러오는 중...';
loadingOverlay.innerHTML = `
<div class="loading-spinner"></div>
<div class="loading-text">페이지를 불러오는 중...</div>
<div class="loading-text">${loadingText}</div>
`;
document.body.appendChild(loadingOverlay);
}
@ -378,16 +390,16 @@ function initThemeToggle() {
document.documentElement.setAttribute('data-theme', newTheme);
localStorage.setItem('theme', newTheme);
toggle.setAttribute('aria-label',
newTheme === 'dark' ? '라이트 모드로 전환' : '다크 모드로 전환'
);
const lightLabel = (window.i18n && window.i18n.t) ? window.i18n.t('header.lightMode', '라이트 모드로 전환') : '라이트 모드로 전환';
const darkLabel = (window.i18n && window.i18n.t) ? window.i18n.t('header.darkMode', '다크 모드 전환') : '다크 모드 전환';
toggle.setAttribute('aria-label', newTheme === 'dark' ? lightLabel : darkLabel);
});
// 초기 aria-label 설정
const current = document.documentElement.getAttribute('data-theme');
toggle.setAttribute('aria-label',
current === 'dark' ? '라이트 모드로 전환' : '다크 모드로 전환'
);
const lightLabelInit = (window.i18n && window.i18n.t) ? window.i18n.t('header.lightMode', '라이트 모드로 전환') : '라이트 모드로 전환';
const darkLabelInit = (window.i18n && window.i18n.t) ? window.i18n.t('header.darkMode', '다크 모드 전환') : '다크 모드 전환';
toggle.setAttribute('aria-label', current === 'dark' ? lightLabelInit : darkLabelInit);
}
// ========================================

23
js/contact.js
View File

@ -9,6 +9,9 @@ document.addEventListener('DOMContentLoaded', function() {
initFormValidation();
});
// i18n 헬퍼
const _t = (key, fallback) => window.i18n?.t(key, fallback) ?? fallback;
// 연락처 폼 초기화
function initContactForm() {
const form = document.getElementById('contactForm');
@ -46,13 +49,13 @@ async function handleFormSubmit(e) {
// 유효성 검사
if (!validateForm(form)) {
showNotification('입력 정보를 확인해 주세요.', 'error');
showNotification(_t('contact.js.checkInput', '입력 정보를 확인해 주세요.'), 'error');
return;
}
// 제출 버튼 비활성화
const originalText = submitBtn.textContent;
submitBtn.textContent = '전송 중...';
submitBtn.textContent = _t('contact.js.sending', '전송 중...');
submitBtn.disabled = true;
try {
@ -64,12 +67,12 @@ async function handleFormSubmit(e) {
await submitContactForm(data);
// 성공 메시지
showNotification('문의가 성공적으로 전송되었습니다. 빠른 시일 내에 연락드리겠습니다.', 'success');
showNotification(_t('contact.js.sendSuccess', '문의가 성공적으로 전송되었습니다. 빠른 시일 내에 연락드리겠습니다.'), 'success');
form.reset();
} catch (error) {
console.error('Form submission error:', error);
showNotification('전송 중 오류가 발생했습니다. 다시 시도해 주세요.', 'error');
showNotification(_t('contact.js.sendError', '전송 중 오류가 발생했습니다. 다시 시도해 주세요.'), 'error');
} finally {
// 버튼 복원
submitBtn.textContent = originalText;
@ -94,7 +97,7 @@ async function submitContactForm(data) {
// 폼 리셋 처리
function handleFormReset(e) {
const confirmed = confirm('입력한 내용이 모두 삭제됩니다. 계속하시겠습니까?');
const confirmed = confirm(_t('contact.js.resetConfirm', '입력한 내용이 모두 삭제됩니다. 계속하시겠습니까?'));
if (!confirmed) {
e.preventDefault();
} else {
@ -123,14 +126,14 @@ function validateForm(form) {
// 이메일 형식 검사
const emailField = form.querySelector('#email');
if (emailField && emailField.value && !isValidEmail(emailField.value)) {
showFieldError(emailField, '올바른 이메일 형식을 입력해 주세요.');
showFieldError(emailField, _t('contact.js.invalidEmail', '올바른 이메일 형식을 입력해 주세요.'));
isValid = false;
}
// 전화번호 형식 검사
const phoneField = form.querySelector('#phone');
if (phoneField && phoneField.value && !isValidPhone(phoneField.value)) {
showFieldError(phoneField, '올바른 전화번호 형식을 입력해 주세요.');
showFieldError(phoneField, _t('contact.js.invalidPhone', '올바른 전화번호 형식을 입력해 주세요.'));
isValid = false;
}
@ -147,19 +150,19 @@ function validateField(e) {
// 필수 필드 검사
if (field.required && !value) {
showFieldError(field, '필수 입력 항목입니다.');
showFieldError(field, _t('contact.js.required', '필수 입력 항목입니다.'));
return false;
}
// 이메일 형식 검사
if (field.type === 'email' && value && !isValidEmail(value)) {
showFieldError(field, '올바른 이메일 형식을 입력해 주세요.');
showFieldError(field, _t('contact.js.invalidEmail', '올바른 이메일 형식을 입력해 주세요.'));
return false;
}
// 전화번호 형식 검사
if (field.type === 'tel' && value && !isValidPhone(value)) {
showFieldError(field, '올바른 전화번호 형식을 입력해 주세요.');
showFieldError(field, _t('contact.js.invalidPhone', '올바른 전화번호 형식을 입력해 주세요.'));
return false;
}

47
js/gallery.js
View File

@ -9,6 +9,9 @@ document.addEventListener('DOMContentLoaded', function() {
initCustom360Viewers();
});
// i18n 헬퍼
const _t = (key, fallback) => window.i18n?.t(key, fallback) ?? fallback;
// 갤러리 초기화
function initGallery() {
const galleryItems = document.querySelectorAll('.gallery-item');
@ -22,7 +25,7 @@ function initGallery() {
// 이미지 로딩 에러 처리
img.addEventListener('error', function() {
this.src = 'images/placeholder.jpg';
this.alt = '이미지를 불러올 수 없습니다';
this.alt = _t('common.imageError', '이미지를 불러올 수 없습니다');
});
// 레이지 로딩 구현
@ -52,13 +55,13 @@ const galleryImages = document.querySelectorAll('.gallery-img');
function initLightbox() {
// 라이트박스 HTML 생성
const lightboxHTML = `
<div id="lightbox" class="lightbox" role="dialog" aria-label="이미지 뷰어">
<div id="lightbox" class="lightbox" role="dialog" aria-label="${_t('gallery.js.lightboxLabel', '이미지 뷰어')}">
<div class="lightbox-content">
<img id="lightbox-img" class="lightbox-img" src="" alt="">
<div id="lightbox-caption" class="lightbox-caption"></div>
<button class="lightbox-close" onclick="closeLightbox()" aria-label="닫기"></button>
<button class="lightbox-nav lightbox-prev" onclick="previousImage()" aria-label="이전 이미지">‹</button>
<button class="lightbox-nav lightbox-next" onclick="nextImage()" aria-label="다음 이미지">›</button>
<button class="lightbox-close" onclick="closeLightbox()" aria-label="${_t('gallery.js.close', '닫기')}"></button>
<button class="lightbox-nav lightbox-prev" onclick="previousImage()" aria-label="${_t('gallery.js.prevImage', '이전 이미지')}">‹</button>
<button class="lightbox-nav lightbox-next" onclick="nextImage()" aria-label="${_t('gallery.js.nextImage', '다음 이미지')}">›</button>
</div>
</div>
`;
@ -464,7 +467,7 @@ class Easy360Viewer {
loader.className = 'panorama-loader';
loader.innerHTML = `
<div class="spinner"></div>
<p>360° 이미지 로딩중...</p>
<p>${_t('gallery.js.panoramaLoading', '360° 이미지 로딩중...')}</p>
`;
loader.style.cssText = `
position: absolute;
@ -493,8 +496,8 @@ class Easy360Viewer {
errorElement.innerHTML = `
<div style="text-align: center; color: #ff6b6b; padding: 20px;">
<div style="font-size: 48px; margin-bottom: 10px;">😞</div>
<div style="font-size: 18px; margin-bottom: 10px;">이미지를 불러올 수 없습니다</div>
<div style="font-size: 14px; opacity: 0.8;">이미지 파일을 확인해주세요</div>
<div style="font-size: 18px; margin-bottom: 10px;">${_t('common.imageError', '이미지를 불러올 수 없습니다')}</div>
<div style="font-size: 14px; opacity: 0.8;">${_t('gallery.js.checkImageFile', '이미지 파일을 확인해주세요')}</div>
</div>
`;
errorElement.style.cssText = `
@ -807,23 +810,23 @@ function createPanoramaModal() {
<div class="panorama-control-buttons">
<button class="panorama-btn" id="panorama-reset-btn">
<i class="fas fa-home"></i>
<span>초기화</span>
<span>${_t('gallery.js.reset', '초기화')}</span>
</button>
<button class="panorama-btn" id="panorama-auto-btn">
<i class="fas fa-sync-alt"></i>
<span>자동회전</span>
<span>${_t('gallery.js.autoRotate', '자동회전')}</span>
</button>
<button class="panorama-btn" id="panorama-zoom-in-btn">
<i class="fas fa-search-plus"></i>
<span>확대</span>
<span>${_t('gallery.js.zoomIn', '확대')}</span>
</button>
<button class="panorama-btn" id="panorama-zoom-out-btn">
<i class="fas fa-search-minus"></i>
<span>축소</span>
<span>${_t('gallery.js.zoomOut', '축소')}</span>
</button>
<button class="panorama-btn" id="panorama-help-btn">
<i class="fas fa-question-circle"></i>
<span>도움말</span>
<span>${_t('gallery.js.help', '도움말')}</span>
</button>
</div>
</div>
@ -833,27 +836,27 @@ function createPanoramaModal() {
</button>
<div class="panorama-help-panel" id="panorama-help-panel">
<h3>360° 조작 가이드</h3>
<h3>${_t('gallery.js.helpTitle', '360° 조작 가이드')}</h3>
<div class="help-content">
<div class="help-item">
<i class="fas fa-mouse"></i>
<span>마우스 드래그로 화면을 회전시킬 수 있습니다</span>
<span>${_t('gallery.js.helpDrag', '마우스 드래그로 화면을 회전시킬 수 있습니다')}</span>
</div>
<div class="help-item">
<i class="fas fa-hand-pointer"></i>
<span>터치 스크린에서는 손가락으로 드래그하세요</span>
<span>${_t('gallery.js.helpTouch', '터치 스크린에서는 손가락으로 드래그하세요')}</span>
</div>
<div class="help-item">
<i class="fas fa-search"></i>
<span>마우스 휠이나 핀치로 확대/축소할 수 있습니다</span>
<span>${_t('gallery.js.helpZoom', '마우스 휠이나 핀치로 확대/축소할 수 있습니다')}</span>
</div>
<div class="help-item">
<i class="fas fa-sync-alt"></i>
<span>자동회전 버튼으로 자동으로 둘러볼 수 있습니다</span>
<span>${_t('gallery.js.helpAutoRotate', '자동회전 버튼으로 자동으로 둘러볼 수 있습니다')}</span>
</div>
<div class="help-item">
<i class="fas fa-keyboard"></i>
<span>ESC 키를 눌러 닫을 수 있습니다</span>
<span>${_t('gallery.js.helpEsc', 'ESC 키를 눌러 닫을 수 있습니다')}</span>
</div>
</div>
</div>
@ -903,12 +906,12 @@ function setupPanoramaModalEvents() {
if (current360Viewer) {
if (isAutoRotating) {
current360Viewer.stopAutoRotate();
autoBtn.innerHTML = '<i class="fas fa-sync-alt"></i><span>자동회전</span>';
autoBtn.innerHTML = `<i class="fas fa-sync-alt"></i><span>${_t('gallery.js.autoRotate', '자동회전')}</span>`;
autoBtn.classList.remove('active');
isAutoRotating = false;
} else {
current360Viewer.startAutoRotate();
autoBtn.innerHTML = '<i class="fas fa-pause"></i><span>정지</span>';
autoBtn.innerHTML = `<i class="fas fa-pause"></i><span>${_t('gallery.js.stop', '정지')}</span>`;
autoBtn.classList.add('active');
isAutoRotating = true;
}
@ -976,7 +979,7 @@ function closePanoramaModal() {
}
// UI 초기화
autoBtn.innerHTML = '<i class="fas fa-sync-alt"></i><span>자동회전</span>';
autoBtn.innerHTML = `<i class="fas fa-sync-alt"></i><span>${_t('gallery.js.autoRotate', '자동회전')}</span>`;
autoBtn.classList.remove('active');
helpBtn.classList.remove('active');
helpPanel.style.display = 'none';

338
js/i18n.js Normal file
View File

@ -0,0 +1,338 @@
/**
* i18n (국제화) 시스템
* 지원 언어: ko(한국어), en(영어), zh(중국어), ja(일본어)
*/
(function() {
'use strict';
const SUPPORTED_LANGS = ['ko', 'en', 'zh', 'ja'];
const DEFAULT_LANG = 'ko';
const STORAGE_KEY = 'mingle-lang';
const i18n = {
currentLang: DEFAULT_LANG,
translations: {},
cache: {},
ready: false,
/**
* 초기화: 언어 감지 → JSON 로드
*/
async init() {
const lang = this.detectLanguage();
if (lang !== DEFAULT_LANG) {
await this.loadLang(lang);
}
this.currentLang = lang;
document.documentElement.lang = lang;
this.ready = true;
},
/**
* 언어 감지 우선순위: localStorage → 브라우저 언어 → 기본값(ko)
*/
detectLanguage() {
// 1. localStorage에 저장된 언어
const saved = localStorage.getItem(STORAGE_KEY);
if (saved && SUPPORTED_LANGS.includes(saved)) {
return saved;
}
// 2. 브라우저 언어
const browserLang = (navigator.language || navigator.userLanguage || '').toLowerCase();
const langCode = browserLang.split('-')[0];
if (SUPPORTED_LANGS.includes(langCode) && langCode !== DEFAULT_LANG) {
return langCode;
}
// 3. 기본값
return DEFAULT_LANG;
},
/**
* JSON 번역 파일 로드
*/
async loadLang(lang) {
if (lang === DEFAULT_LANG) {
this.translations = {};
return;
}
// 캐시 확인
if (this.cache[lang]) {
this.translations = this.cache[lang];
return;
}
try {
const response = await fetch(`/i18n/${lang}.json`);
if (!response.ok) throw new Error(`HTTP ${response.status}`);
const data = await response.json();
this.cache[lang] = data;
this.translations = data;
} catch (error) {
console.warn(`[i18n] Failed to load ${lang}.json:`, error);
this.translations = {};
}
},
/**
* 번역 키로 텍스트 가져오기
* @param {string} key - 점(.) 구분 키 (예: "header.studioName")
* @param {string} fallback - 폴백 텍스트
* @returns {string}
*/
t(key, fallback) {
if (this.currentLang === DEFAULT_LANG) {
return fallback || key;
}
const keys = key.split('.');
let value = this.translations;
for (const k of keys) {
if (value && typeof value === 'object' && k in value) {
value = value[k];
} else {
return fallback || key;
}
}
return typeof value === 'string' ? value : (fallback || key);
},
/**
* DOM 전체 번역 적용
* @param {Element} root - 번역 대상 루트 (기본: document)
*/
translateDOM(root) {
const container = root || document;
const isKorean = this.currentLang === DEFAULT_LANG;
// data-i18n: 텍스트 콘텐츠 번역
container.querySelectorAll('[data-i18n]').forEach(el => {
const key = el.getAttribute('data-i18n');
// 원본 한국어 텍스트 저장 (최초 1회)
if (!el.hasAttribute('data-i18n-ko')) {
el.setAttribute('data-i18n-ko', el.innerHTML);
}
if (isKorean) {
el.innerHTML = el.getAttribute('data-i18n-ko');
} else {
const translated = this.t(key, null);
if (translated && translated !== key) {
if (translated.includes('<')) {
el.innerHTML = translated;
} else {
el.textContent = translated;
}
}
}
});
// data-i18n-html: HTML 콘텐츠 번역 (명시적)
container.querySelectorAll('[data-i18n-html]').forEach(el => {
const key = el.getAttribute('data-i18n-html');
if (!el.hasAttribute('data-i18n-ko')) {
el.setAttribute('data-i18n-ko', el.innerHTML);
}
if (isKorean) {
el.innerHTML = el.getAttribute('data-i18n-ko');
} else {
const translated = this.t(key, null);
if (translated && translated !== key) {
el.innerHTML = translated;
}
}
});
// data-i18n-placeholder: placeholder 번역
container.querySelectorAll('[data-i18n-placeholder]').forEach(el => {
const key = el.getAttribute('data-i18n-placeholder');
if (!el.hasAttribute('data-i18n-ko-placeholder')) {
el.setAttribute('data-i18n-ko-placeholder', el.placeholder);
}
if (isKorean) {
el.placeholder = el.getAttribute('data-i18n-ko-placeholder');
} else {
const translated = this.t(key, null);
if (translated && translated !== key) {
el.placeholder = translated;
}
}
});
// data-i18n-aria: aria-label 번역
container.querySelectorAll('[data-i18n-aria]').forEach(el => {
const key = el.getAttribute('data-i18n-aria');
if (!el.hasAttribute('data-i18n-ko-aria')) {
el.setAttribute('data-i18n-ko-aria', el.getAttribute('aria-label') || '');
}
if (isKorean) {
el.setAttribute('aria-label', el.getAttribute('data-i18n-ko-aria'));
} else {
const translated = this.t(key, null);
if (translated && translated !== key) {
el.setAttribute('aria-label', translated);
}
}
});
// data-i18n-title: title 속성 번역
container.querySelectorAll('[data-i18n-title]').forEach(el => {
const key = el.getAttribute('data-i18n-title');
if (!el.hasAttribute('data-i18n-ko-title')) {
el.setAttribute('data-i18n-ko-title', el.title || '');
}
if (isKorean) {
el.title = el.getAttribute('data-i18n-ko-title');
} else {
const translated = this.t(key, null);
if (translated && translated !== key) {
el.title = translated;
}
}
});
// 메타 태그 번역
this.translateMeta();
// 언어 스위처 활성 상태 업데이트
this.updateSwitcher();
},
/**
* 메타 태그 번역 (title, description, OG 등)
*/
translateMeta() {
const isKorean = this.currentLang === DEFAULT_LANG;
const pageName = this.getPageName();
// 원본 메타 저장 (최초 1회)
if (!this._metaOriginals) {
this._metaOriginals = {
title: document.title,
description: document.querySelector('meta[name="description"]')?.content || '',
ogTitle: document.querySelector('meta[property="og:title"]')?.content || '',
ogDescription: document.querySelector('meta[property="og:description"]')?.content || ''
};
}
if (isKorean) {
document.title = this._metaOriginals.title;
const metaDesc = document.querySelector('meta[name="description"]');
if (metaDesc) metaDesc.content = this._metaOriginals.description;
const ogTitleEl = document.querySelector('meta[property="og:title"]');
if (ogTitleEl) ogTitleEl.content = this._metaOriginals.ogTitle;
const ogDescEl = document.querySelector('meta[property="og:description"]');
if (ogDescEl) ogDescEl.content = this._metaOriginals.ogDescription;
return;
}
// title
const titleKey = `${pageName}.meta.title`;
const title = this.t(titleKey, null);
if (title && title !== titleKey) {
document.title = title;
}
// meta description
const descKey = `${pageName}.meta.description`;
const desc = this.t(descKey, null);
if (desc && desc !== descKey) {
const metaDesc = document.querySelector('meta[name="description"]');
if (metaDesc) metaDesc.content = desc;
}
// OG tags
const ogTitleKey = `${pageName}.meta.ogTitle`;
const ogTitle = this.t(ogTitleKey, null);
if (ogTitle && ogTitle !== ogTitleKey) {
const ogTitleEl = document.querySelector('meta[property="og:title"]');
if (ogTitleEl) ogTitleEl.content = ogTitle;
}
const ogDescKey = `${pageName}.meta.ogDescription`;
const ogDesc = this.t(ogDescKey, null);
if (ogDesc && ogDesc !== ogDescKey) {
const ogDescEl = document.querySelector('meta[property="og:description"]');
if (ogDescEl) ogDescEl.content = ogDesc;
}
},
/**
* 현재 페이지 이름 추출
*/
getPageName() {
const path = window.location.pathname;
const page = path.split('/').pop().replace('.html', '') || 'index';
return page;
},
/**
* 언어 전환
*/
async setLang(lang) {
if (!SUPPORTED_LANGS.includes(lang)) return;
if (lang === this.currentLang) return;
this.currentLang = lang;
localStorage.setItem(STORAGE_KEY, lang);
document.documentElement.lang = lang;
await this.loadLang(lang);
this.translateDOM();
},
/**
* 언어 스위처 UI 활성 상태 업데이트
*/
updateSwitcher() {
const currentEl = document.querySelector('.lang-current');
if (currentEl) {
currentEl.textContent = this.currentLang.toUpperCase();
}
document.querySelectorAll('.lang-dropdown button[data-lang]').forEach(btn => {
btn.classList.toggle('active', btn.getAttribute('data-lang') === this.currentLang);
});
},
/**
* 언어 스위처 이벤트 바인딩
*/
initSwitcher() {
const switcher = document.querySelector('.lang-switcher');
if (!switcher) return;
const btn = switcher.querySelector('.lang-btn');
const dropdown = switcher.querySelector('.lang-dropdown');
if (btn && dropdown) {
btn.addEventListener('click', (e) => {
e.stopPropagation();
dropdown.classList.toggle('open');
btn.classList.toggle('open');
});
dropdown.querySelectorAll('button[data-lang]').forEach(langBtn => {
langBtn.addEventListener('click', (e) => {
e.stopPropagation();
const lang = langBtn.getAttribute('data-lang');
this.setLang(lang);
dropdown.classList.remove('open');
btn.classList.remove('open');
});
});
// 외부 클릭 시 닫기
document.addEventListener('click', () => {
dropdown.classList.remove('open');
btn.classList.remove('open');
});
}
this.updateSwitcher();
}
};
window.i18n = i18n;
})();

7
js/main.js
View File

@ -13,6 +13,9 @@ document.addEventListener('DOMContentLoaded', function() {
initPortfolioTabs();
});
// i18n 헬퍼
const _t = (key, fallback) => window.i18n?.t(key, fallback) ?? fallback;
// ========================================
// 카운터 애니메이션
// ========================================
@ -177,7 +180,7 @@ function initVideoLazyLoading() {
if (!wrapper.querySelector('.video-loading')) {
const loadingDiv = document.createElement('div');
loadingDiv.className = 'video-loading';
loadingDiv.textContent = '비디오 로딩 중...';
loadingDiv.textContent = _t('common.videoLoading', '비디오 로딩 중...');
loadingDiv.style.cssText = `
position: absolute;
top: 50%;
@ -208,7 +211,7 @@ function loadVideo(wrapper) {
iframe.addEventListener('error', function() {
const loadingDiv = wrapper.querySelector('.video-loading');
if (loadingDiv) {
loadingDiv.textContent = '비디오를 로드할 수 없습니다';
loadingDiv.textContent = _t('common.videoError', '비디오를 로드할 수 없습니다');
loadingDiv.style.color = '#ef4444';
}
});

15
js/portfolio.js
View File

@ -10,6 +10,9 @@ document.addEventListener('DOMContentLoaded', function() {
initYouTubeAPI();
});
// i18n 헬퍼
const _t = (key, fallback) => window.i18n?.t(key, fallback) ?? fallback;
// ========================================
// 포트폴리오 탭 시스템
// ========================================
@ -86,7 +89,7 @@ function initVideoLazyLoading() {
if (!wrapper.querySelector('.video-loading')) {
const loadingDiv = document.createElement('div');
loadingDiv.className = 'video-loading';
loadingDiv.textContent = '비디오 로딩 중...';
loadingDiv.textContent = _t('common.videoLoading', '비디오 로딩 중...');
wrapper.appendChild(loadingDiv);
}
});
@ -112,7 +115,7 @@ function loadVideo(wrapper) {
iframe.addEventListener('error', function() {
const loadingDiv = wrapper.querySelector('.video-loading');
if (loadingDiv) {
loadingDiv.textContent = '비디오를 로드할 수 없습니다';
loadingDiv.textContent = _t('common.videoError', '비디오를 로드할 수 없습니다');
loadingDiv.style.color = '#ef4444';
}
});
@ -380,7 +383,7 @@ function onPlayerError(event) {
if (wrapper) {
const errorDiv = document.createElement('div');
errorDiv.className = 'video-error';
errorDiv.innerHTML = '비디오를 로드할 수 없습니다<br><small>네트워크 연결을 확인해주세요</small>';
errorDiv.innerHTML = `${_t('common.videoError', '비디오를 로드할 수 없습니다')}<br><small>${_t('portfolio.js.checkNetwork', '네트워크 연결을 확인해주세요')}</small>`;
errorDiv.style.cssText = `
position: absolute;
top: 50%;
@ -422,7 +425,7 @@ function trackVideoPlay(player) {
function shareVideo(videoUrl, title) {
if (navigator.share) {
navigator.share({
title: title || '밍글 스튜디오 포트폴리오',
title: title || _t('portfolio.js.shareTitle', '밍글 스튜디오 포트폴리오'),
url: videoUrl
});
} else {
@ -442,9 +445,9 @@ function shareVideo(videoUrl, title) {
return Promise.resolve();
};
copyText(videoUrl).then(() => {
showNotification('비디오 링크가 클립보드에 복사되었습니다.', 'success');
showNotification(_t('portfolio.js.linkCopied', '비디오 링크가 클립보드에 복사되었습니다.'), 'success');
}).catch(() => {
showNotification('링크 복사에 실패했습니다.', 'error');
showNotification(_t('portfolio.js.linkCopyFailed', '링크 복사에 실패했습니다.'), 'error');
});
}
}

53
portfolio.html
View File

@ -129,7 +129,7 @@
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-PPTNN6WD"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
<a href="#main-content" class="skip-to-content">본문 바로가기</a>
<a href="#main-content" class="skip-to-content" data-i18n="common.skipToContent">본문 바로가기</a>
<!-- 헤더 -->
<div id="header-placeholder"></div>
@ -138,8 +138,8 @@
<!-- 페이지 헤더 -->
<section class="page-header">
<div class="container">
<h1>Portfolio</h1>
<p>밍글 스튜디오에서 제작하고 협업한 모션캡쳐 콘텐츠</p>
<h1 data-i18n="portfolio.pageHeader.title">Portfolio</h1>
<p data-i18n="portfolio.pageHeader.desc">밍글 스튜디오에서 제작하고 협업한 모션캡쳐 콘텐츠</p>
</div>
</section>
@ -150,11 +150,11 @@
<div class="channel-info">
<div class="channel-icon">📺</div>
<div class="channel-details">
<h2>밍글 스튜디오 공식 채널</h2>
<p>최신 모션캡쳐 콘텐츠와 제작 과정을 YouTube에서 확인하세요</p>
<h2 data-i18n="portfolio.channel.title">밍글 스튜디오 공식 채널</h2>
<p data-i18n="portfolio.channel.desc">최신 모션캡쳐 콘텐츠와 제작 과정을 YouTube에서 확인하세요</p>
</div>
</div>
<a href="https://www.youtube.com/@minglestudio_mocap" target="_blank" class="btn btn-primary">
<a href="https://www.youtube.com/@minglestudio_mocap" target="_blank" class="btn btn-primary" data-i18n="portfolio.channel.btn">
YouTube 채널 방문하기
</a>
</div>
@ -166,8 +166,8 @@
<div class="container">
<div class="portfolio-tabs">
<div class="tab-buttons" role="tablist" aria-label="포트폴리오 카테고리">
<button class="tab-btn active" id="tab-individual" data-tab="individual" role="tab" aria-selected="true" aria-controls="individual">개인 크리에이터</button>
<button class="tab-btn" id="tab-corporate" data-tab="corporate" role="tab" aria-selected="false" aria-controls="corporate">기업 프로젝트</button>
<button class="tab-btn active" id="tab-individual" data-tab="individual" role="tab" aria-selected="true" aria-controls="individual" data-i18n="portfolio.tabs.individual">개인 크리에이터</button>
<button class="tab-btn" id="tab-corporate" data-tab="corporate" role="tab" aria-selected="false" aria-controls="corporate" data-i18n="portfolio.tabs.corporate">기업 프로젝트</button>
</div>
</div>
</div>
@ -179,8 +179,8 @@
<section class="section bg-light">
<div class="container">
<div class="section-header">
<h2>Long-Form 콘텐츠</h2>
<p>개인 크리에이터들의 모션캡쳐 프로젝트</p>
<h2 data-i18n="portfolio.longform.title">Long-Form 콘텐츠</h2>
<p data-i18n="portfolio.longform.desc">개인 크리에이터들의 모션캡쳐 프로젝트</p>
</div>
<div class="video-grid longform-grid">
@ -295,8 +295,8 @@
<section class="section">
<div class="container">
<div class="section-header">
<h2>Shorts 콘텐츠</h2>
<p>짧고 임팩트 있는 모션캡쳐 순간들</p>
<h2 data-i18n="portfolio.shorts.title">Shorts 콘텐츠</h2>
<p data-i18n="portfolio.shorts.desc">짧고 임팩트 있는 모션캡쳐 순간들</p>
</div>
<div class="video-grid shorts-grid">
@ -385,15 +385,15 @@
<section class="section bg-gradient">
<div class="container">
<div class="section-header">
<h2>실시간 방송 예시</h2>
<p>버튜버와 스트리머들의 실시간 모션캡쳐 방송</p>
<h2 data-i18n="portfolio.broadcast.title">실시간 방송 예시</h2>
<p data-i18n="portfolio.broadcast.desc">버튜버와 스트리머들의 실시간 모션캡쳐 방송</p>
</div>
<div class="broadcast-notice">
<div class="notice-icon"><i class="fa-solid fa-circle" aria-hidden="true" style="color: #ef4444;"></i></div>
<div class="notice-content">
<h3>실시간 모션캡쳐 방송</h3>
<p>밍글 스튜디오에서 진행되는 실시간 모션캡쳐 방송을 통해 고품질 버추얼 콘텐츠를 경험하세요</p>
<h3 data-i18n="portfolio.broadcast.noticeTitle">실시간 모션캡쳐 방송</h3>
<p data-i18n="portfolio.broadcast.noticeDesc">밍글 스튜디오에서 진행되는 실시간 모션캡쳐 방송을 통해 고품질 버추얼 콘텐츠를 경험하세요</p>
</div>
</div>
@ -499,8 +499,8 @@
<section class="section bg-light">
<div class="container">
<div class="section-header">
<h2>기업 프로젝트</h2>
<p>기업 및 상업적 모션캡쳐 프로젝트</p>
<h2 data-i18n="portfolio.corporate.title">기업 프로젝트</h2>
<p data-i18n="portfolio.corporate.desc">기업 및 상업적 모션캡쳐 프로젝트</p>
</div>
<!-- IXIA 기업 프로젝트 -->
@ -508,7 +508,7 @@
<div class="project-header">
<div class="project-logo">
<h3>아이시아(IXIA)</h3>
<p>버추얼 아이돌 그룹 모션캡쳐 제작</p>
<p data-i18n="portfolio.corporate.ixiaDesc">버추얼 아이돌 그룹 모션캡쳐 제작</p>
</div>
<div class="project-tags">
<span class="tag corporate">기업 프로젝트</span>
@ -519,7 +519,7 @@
<!-- Long-Form 콘텐츠 -->
<div class="project-section">
<h4>뮤직비디오 제작</h4>
<h4 data-i18n="portfolio.corporate.mvSection">뮤직비디오 제작</h4>
<div class="video-grid corporate-longform">
<div class="video-card featured">
<div class="video-wrapper">
@ -542,7 +542,7 @@
<!-- Shorts 콘텐츠 -->
<div class="project-section">
<h4>숏폼비디오 제작</h4>
<h4 data-i18n="portfolio.corporate.shortsSection">숏폼비디오 제작</h4>
<div class="video-grid corporate-shorts">
<div class="video-card shorts">
<div class="video-wrapper shorts-wrapper">
@ -572,7 +572,7 @@
<!-- 라이브 방송 -->
<div class="project-section">
<h4>라이브 방송 진행</h4>
<h4 data-i18n="portfolio.corporate.liveSection">라이브 방송 진행</h4>
<div class="video-grid corporate-live">
<div class="video-card broadcast">
<div class="video-wrapper">
@ -616,11 +616,11 @@
<!-- CTA -->
<section class="cta-section">
<div class="container text-center">
<h2>당신의 콘텐츠도 여기에</h2>
<p>밍글 스튜디오와 함께 다음 포트폴리오의 주인공이 되어보세요</p>
<h2 data-i18n="portfolio.cta.title">당신의 콘텐츠도 여기에</h2>
<p data-i18n="portfolio.cta.desc">밍글 스튜디오와 함께 다음 포트폴리오의 주인공이 되어보세요</p>
<div class="cta-buttons">
<a href="/contact" class="btn btn-primary btn-lg">프로젝트 문의하기</a>
<a href="/services" class="btn btn-outline btn-lg">서비스 알아보기</a>
<a href="/contact" class="btn btn-primary btn-lg" data-i18n="portfolio.cta.btnInquiry">프로젝트 문의하기</a>
<a href="/services" class="btn btn-outline btn-lg" data-i18n="portfolio.cta.btnServices">서비스 알아보기</a>
</div>
</div>
</section>
@ -665,6 +665,7 @@
</footer>
<!-- JavaScript -->
<script src="js/i18n.js"></script>
<script src="js/common.js"></script>
<script src="js/portfolio.js"></script>
</body>

93
qna.html
View File

@ -70,7 +70,7 @@
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-PPTNN6WD"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
<a href="#main-content" class="skip-to-content">본문 바로가기</a>
<a href="#main-content" class="skip-to-content" data-i18n="common.skipToContent">본문 바로가기</a>
<!-- 헤더 -->
<div id="header-placeholder"></div>
@ -79,8 +79,8 @@
<!-- 페이지 헤더 -->
<section class="page-header">
<div class="container">
<h1>자주하는 질문</h1>
<p>밍글 스튜디오 이용에 관한 자주 묻는 질문들을 확인하세요</p>
<h1 data-i18n="qna.pageHeader.title">자주하는 질문</h1>
<p data-i18n="qna.pageHeader.desc">밍글 스튜디오 이용에 관한 자주 묻는 질문들을 확인하세요</p>
</div>
</section>
@ -90,8 +90,8 @@
<div class="faq-search">
<div class="search-box">
<label for="faqSearch" class="sr-only">FAQ 검색</label>
<input type="text" id="faqSearch" placeholder="궁금한 내용을 검색해보세요..." autocomplete="off">
<button type="button" class="search-btn" aria-label="검색"><i class="fa-solid fa-magnifying-glass" aria-hidden="true"></i></button>
<input type="text" id="faqSearch" placeholder="궁금한 내용을 검색해보세요..." data-i18n-placeholder="qna.search.placeholder" autocomplete="off">
<button type="button" class="search-btn" aria-label="검색" data-i18n-aria="qna.search.btnLabel"><i class="fa-solid fa-magnifying-glass" aria-hidden="true"></i></button>
</div>
<div class="search-suggestions" id="searchSuggestions"></div>
</div>
@ -102,13 +102,13 @@
<section class="faq-category-section bg-light">
<div class="container">
<div class="faq-categories">
<button class="category-btn active" data-category="all">전체</button>
<button class="category-btn" data-category="booking">예약/대관</button>
<button class="category-btn" data-category="equipment">장비/기술</button>
<button class="category-btn" data-category="pricing">요금/결제</button>
<button class="category-btn" data-category="production">제작/촬영</button>
<button class="category-btn" data-category="streaming">스트리밍</button>
<button class="category-btn" data-category="etc">기타</button>
<button class="category-btn active" data-category="all" data-i18n="qna.categories.all">전체</button>
<button class="category-btn" data-category="booking" data-i18n="qna.categories.booking">예약/대관</button>
<button class="category-btn" data-category="equipment" data-i18n="qna.categories.equipment">장비/기술</button>
<button class="category-btn" data-category="pricing" data-i18n="qna.categories.pricing">요금/결제</button>
<button class="category-btn" data-category="production" data-i18n="qna.categories.production">제작/촬영</button>
<button class="category-btn" data-category="streaming" data-i18n="qna.categories.streaming">스트리밍</button>
<button class="category-btn" data-category="etc" data-i18n="qna.categories.etc">기타</button>
</div>
</div>
</section>
@ -121,10 +121,10 @@
<!-- 예약/대관 관련 -->
<div class="faq-item" data-category="booking">
<div class="faq-question">
<h3>스튜디오 대관은 어떻게 예약하나요?</h3>
<h3 data-i18n="qna.faq.q1">스튜디오 대관은 어떻게 예약하나요?</h3>
<span class="faq-toggle">+</span>
</div>
<div class="faq-answer">
<div class="faq-answer" data-i18n-html="qna.faq.a1">
<p>아래 방법으로 예약하실 수 있습니다:</p>
<ul>
<li><strong><i class="fa-solid fa-envelope" aria-hidden="true"></i> 이메일:</strong> <a href="mailto:help@minglestudio.co.kr?subject=[스튜디오 예약 문의] 밍글 스튜디오&body=안녕하세요. 밍글 스튜디오 대관 예약 문의 드립니다.%0A%0A■ 기본 정보%0A- 이용 예정일: (예: 2024년 12월 25일)%0A- 이용 시간: (예: 오후 2시 ~ 4시, 2시간)%0A- 참여 인원: 명%0A- 연락처: %0A- 이메일: %0A%0A■ 촬영 정보%0A- 촬영 목적: (예: 버튜버 방송, 게임 제작, 영상 콘텐츠 등)%0A- 예상 촬영 내용: %0A- 필요한 장비: (전신 모션캡쳐 / 페이셜 캡쳐 / 기타)%0A%0A■ 추가 요청사항%0A- 특별한 요구사항: %0A- 문의사항: %0A%0A■ 참고사항%0A- 최소 대관: 2시간 (220,000원, VAT 포함)%0A- 연장: 1시간당 110,000원%0A- 결제방법: 계좌이체 또는 현금 (카드결제 불가)%0A- 현금영수증/세금계산서 발행 가능%0A%0A빠른 시일 내에 답변 드리겠습니다.%0A감사합니다.">help@minglestudio.co.kr</a></li>
@ -178,10 +178,10 @@
<div class="faq-item" data-category="booking">
<div class="faq-question">
<h3>예약금 제도와 환불 규정이 있나요?</h3>
<h3 data-i18n="qna.faq.q2">예약금 제도와 환불 규정이 있나요?</h3>
<span class="faq-toggle">+</span>
</div>
<div class="faq-answer">
<div class="faq-answer" data-i18n-html="qna.faq.a2">
<p>아래는 환불 규정입니다:</p>
<div class="policy-table">
<div class="policy-row">
@ -206,10 +206,10 @@
<div class="faq-item" data-category="booking">
<div class="faq-question">
<h3>최소 대관 시간은 어떻게 되나요?</h3>
<h3 data-i18n="qna.faq.q3">최소 대관 시간은 어떻게 되나요?</h3>
<span class="faq-toggle">+</span>
</div>
<div class="faq-answer">
<div class="faq-answer" data-i18n-html="qna.faq.a3">
<p>최소 대관은 <strong>2시간</strong>부터 가능합니다.</p>
<p>연장은 1시간 단위로 가능합니다.</p>
</div>
@ -217,20 +217,20 @@
<div class="faq-item" data-category="booking">
<div class="faq-question">
<h3>대관은 얼마나 전에 예약해야 하나요?</h3>
<h3 data-i18n="qna.faq.q4">대관은 얼마나 전에 예약해야 하나요?</h3>
<span class="faq-toggle">+</span>
</div>
<div class="faq-answer">
<div class="faq-answer" data-i18n-html="qna.faq.a4">
<p>최소 2주 전에 연락주시면 원활하게 준비가 가능합니다.</p>
</div>
</div>
<div class="faq-item" data-category="pricing">
<div class="faq-question">
<h3>현장 결제가 가능한가요?</h3>
<h3 data-i18n="qna.faq.q5">현장 결제가 가능한가요?</h3>
<span class="faq-toggle">+</span>
</div>
<div class="faq-answer">
<div class="faq-answer" data-i18n-html="qna.faq.a5">
<p>현장에서는 현금 결제 또는 계좌이체가 가능합니다.</p>
<p>카드 결제는 현장에서 불가능하니 참고해 주세요.</p>
<p>현금영수증 및 세금계산서 발행 가능합니다.</p>
@ -239,10 +239,10 @@
<div class="faq-item" data-category="pricing">
<div class="faq-question">
<h3>세금계산서 발행이 가능한가요?</h3>
<h3 data-i18n="qna.faq.q6">세금계산서 발행이 가능한가요?</h3>
<span class="faq-toggle">+</span>
</div>
<div class="faq-answer">
<div class="faq-answer" data-i18n-html="qna.faq.a6">
<p>네 발행 가능합니다</p>
</div>
</div>
@ -250,10 +250,10 @@
<!-- 장비/기술 관련 -->
<div class="faq-item" data-category="equipment">
<div class="faq-question">
<h3>어떤 모션캡쳐 장비를 사용하나요?</h3>
<h3 data-i18n="qna.faq.q7">어떤 모션캡쳐 장비를 사용하나요?</h3>
<span class="faq-toggle">+</span>
</div>
<div class="faq-answer">
<div class="faq-answer" data-i18n-html="qna.faq.a7">
<p>밍글 스튜디오는 다음과 같은 전문 장비를 보유하고 있습니다:</p>
<ul>
<li><strong>OptiTrack 카메라:</strong> 30대</li>
@ -264,10 +264,10 @@
<div class="faq-item" data-category="equipment">
<div class="faq-question">
<h3>모션캡쳐 슈트는 제공되나요?</h3>
<h3 data-i18n="qna.faq.q8">모션캡쳐 슈트는 제공되나요?</h3>
<span class="faq-toggle">+</span>
</div>
<div class="faq-answer">
<div class="faq-answer" data-i18n-html="qna.faq.a8">
<p>네, 전문 모션캡쳐 슈트와 마커를 무료로 제공합니다.</p>
<ul>
<li>다양한 사이즈 (S, M, L, XL) 보유</li>
@ -280,10 +280,10 @@
<div class="faq-item" data-category="equipment">
<div class="faq-question">
<h3>몇 명까지 동시에 모션캡쳐가 가능한가요?</h3>
<h3 data-i18n="qna.faq.q9">몇 명까지 동시에 모션캡쳐가 가능한가요?</h3>
<span class="faq-toggle">+</span>
</div>
<div class="faq-answer">
<div class="faq-answer" data-i18n-html="qna.faq.a9">
<p>최대 <strong>5명</strong>까지 동시 모션캡쳐가 가능합니다.</p>
<p>인원별 상세 정보:</p>
<ul>
@ -298,10 +298,10 @@
<!-- 요금/결제 관련 -->
<div class="faq-item" data-category="pricing">
<div class="faq-question">
<h3>결제는 어떻게 하나요?</h3>
<h3 data-i18n="qna.faq.q10">결제는 어떻게 하나요?</h3>
<span class="faq-toggle">+</span>
</div>
<div class="faq-answer">
<div class="faq-answer" data-i18n-html="qna.faq.a10">
<p>다음과 같은 결제 방법을 지원합니다:</p>
<ul>
<li><strong>계좌이체:</strong> 예약 확정 후 24시간 내</li>
@ -317,10 +317,10 @@
<!-- 제작/촬영 관련 -->
<div class="faq-item" data-category="production">
<div class="faq-question">
<h3>촬영 준비물은 무엇이 필요한가요?</h3>
<h3 data-i18n="qna.faq.q11">촬영 준비물은 무엇이 필요한가요?</h3>
<span class="faq-toggle">+</span>
</div>
<div class="faq-answer">
<div class="faq-answer" data-i18n-html="qna.faq.a11">
<p>기본적으로 다음과 같은 준비가 필요합니다:</p>
<ul>
<li><strong>신발:</strong> 양말 필수 착용</li>
@ -335,10 +335,10 @@
<div class="faq-item" data-category="production">
<div class="faq-question">
<h3>데이터는 어떤 형태로 받을 수 있나요?</h3>
<h3 data-i18n="qna.faq.q12">데이터는 어떤 형태로 받을 수 있나요?</h3>
<span class="faq-toggle">+</span>
</div>
<div class="faq-answer">
<div class="faq-answer" data-i18n-html="qna.faq.a12">
<p>다음과 같은 형태의 데이터를 제공합니다:</p>
<ul>
<li><strong>FBX 파일:</strong> Unity, Unreal Engine 호환</li>
@ -352,10 +352,10 @@
<!-- 스트리밍 관련 -->
<div class="faq-item" data-category="streaming">
<div class="faq-question">
<h3>실시간 스트리밍이 가능한가요?</h3>
<h3 data-i18n="qna.faq.q13">실시간 스트리밍이 가능한가요?</h3>
<span class="faq-toggle">+</span>
</div>
<div class="faq-answer">
<div class="faq-answer" data-i18n-html="qna.faq.a13">
<p><strong>네, 스트리밍글 서비스를 통해 실시간 스트리밍이 가능합니다.</strong></p>
<p>모션캡쳐 데이터를 실시간으로 송출하여 라이브 방송에 활용하실 수 있습니다.</p>
<p>자세한 내용은 Services 페이지의 스트리밍글 서비스 항목을 참고해주세요.</p>
@ -365,10 +365,10 @@
<!-- 기타 -->
<div class="faq-item" data-category="etc">
<div class="faq-question">
<h3>주차는 가능한가요?</h3>
<h3 data-i18n="qna.faq.q14">주차는 가능한가요?</h3>
<span class="faq-toggle">+</span>
</div>
<div class="faq-answer">
<div class="faq-answer" data-i18n-html="qna.faq.a14">
<p>네, 주차가 가능합니다:</p>
<ul>
<li><strong>기본:</strong> 2시간 무료</li>
@ -380,10 +380,10 @@
<div class="faq-item" data-category="etc">
<div class="faq-question">
<h3>견학이나 시설 투어는 가능한가요?</h3>
<h3 data-i18n="qna.faq.q15">견학이나 시설 투어는 가능한가요?</h3>
<span class="faq-toggle">+</span>
</div>
<div class="faq-answer">
<div class="faq-answer" data-i18n-html="qna.faq.a15">
<p>견학 및 투어는 미리 문의를 통해 가능 여부를 확인해야 합니다:</p>
<ul>
<li><strong>사전 문의:</strong> 필수 (스튜디오 사정에 따라 거절될 수 있음)</li>
@ -403,11 +403,11 @@
<!-- 추가 문의 -->
<section class="section bg-gradient">
<div class="container text-center">
<h2>원하는 답변을 찾지 못하셨나요?</h2>
<p>궁금한 점이 있으시면 언제든지 문의해 주세요</p>
<h2 data-i18n="qna.cta.title">원하는 답변을 찾지 못하셨나요?</h2>
<p data-i18n="qna.cta.desc">궁금한 점이 있으시면 언제든지 문의해 주세요</p>
<div class="cta-buttons">
<a href="contact.html" class="btn btn-primary btn-lg">문의하기</a>
<a href="tel:010-9288-9190" class="btn btn-outline btn-lg">전화 상담</a>
<a href="contact.html" class="btn btn-primary btn-lg" data-i18n="qna.cta.btnContact">문의하기</a>
<a href="tel:010-9288-9190" class="btn btn-outline btn-lg" data-i18n="qna.cta.btnCall">전화 상담</a>
</div>
</div>
</section>
@ -452,6 +452,7 @@
</footer>
<!-- JavaScript -->
<script src="js/i18n.js"></script>
<script src="js/common.js"></script>
<script src="js/qna.js"></script>
</body>

389
services.html
View File

@ -71,7 +71,7 @@
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-PPTNN6WD"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
<a href="#main-content" class="skip-to-content">본문 바로가기</a>
<a href="#main-content" class="skip-to-content" data-i18n="common.skipToContent">본문 바로가기</a>
<!-- 헤더 -->
<div id="header-placeholder"></div>
@ -80,8 +80,8 @@
<!-- 페이지 헤더 -->
<section class="page-header">
<div class="container">
<h1>Services</h1>
<p>최첨단 모션캡쳐 시설과 전문 서비스를 제공합니다</p>
<h1 data-i18n="services.pageHeader.title">Services</h1>
<p data-i18n="services.pageHeader.desc">최첨단 모션캡쳐 시설과 전문 서비스를 제공합니다</p>
</div>
</section>
@ -89,17 +89,17 @@
<section class="section">
<div class="container">
<div class="section-header">
<h2>서비스 패키지</h2>
<p>용도와 규모에 맞는 최적의 모션캡처 녹화 서비스를 제공합니다</p>
<p class="vat-notice-inline">※ 모든 가격은 부가세 별도입니다</p>
<h2 data-i18n="services.packages.title">서비스 패키지</h2>
<p data-i18n="services.packages.desc">용도와 규모에 맞는 최적의 모션캡처 녹화 서비스를 제공합니다</p>
<p class="vat-notice-inline" data-i18n="services.packages.vatNotice">※ 모든 가격은 부가세 별도입니다</p>
</div>
<!-- 서비스 1: 모션캡처 녹화 서비스 -->
<div class="service-package">
<div class="package-header">
<span class="package-icon"><i class="fa-solid fa-bullseye" aria-hidden="true"></i></span>
<h3>서비스 1: 모션캡처 녹화 서비스</h3>
<span class="package-badge">기본형</span>
<h3 data-i18n="services.service1.title">서비스 1: 모션캡처 녹화 서비스</h3>
<span class="package-badge" data-i18n="services.service1.badge">기본형</span>
</div>
<!-- 가격 카드들 -->
@ -108,18 +108,18 @@
<div class="pricing-card team reveal" data-reveal="up">
<div class="card-header">
<span class="person-icon"><i class="fa-solid fa-user-group" aria-hidden="true"></i></span>
<h4>2인 이용</h4>
<span class="popular-badge">인기</span>
<h4 data-i18n="services.service1.team">2인 이용</h4>
<span class="popular-badge" data-i18n="services.service1.teamPopular">인기</span>
</div>
<div class="price-display">
<span class="price-amount">200,000원</span>
<span class="price-unit">/시간</span>
<span class="price-amount" data-i18n="services.service1.teamPrice">200,000원</span>
<span class="price-unit" data-i18n="services.service1.teamUnit">/시간</span>
</div>
<div class="card-features">
<ul>
<li>2인 동시 모션 녹화</li>
<li>캐릭터 간 인터랙션 수록</li>
<li>팀 프로젝트 협업</li>
<li data-i18n="services.service1.teamFeature1">2인 동시 모션 녹화</li>
<li data-i18n="services.service1.teamFeature2">캐릭터 간 인터랙션 수록</li>
<li data-i18n="services.service1.teamFeature3">팀 프로젝트 협업</li>
</ul>
</div>
</div>
@ -127,17 +127,17 @@
<div class="pricing-card extended reveal" data-reveal="up">
<div class="card-header">
<span class="person-icon"><i class="fa-solid fa-people-group" aria-hidden="true"></i></span>
<h4>추가 인원</h4>
<h4 data-i18n="services.service1.additional">추가 인원</h4>
</div>
<div class="price-display">
<span class="price-amount">+100,000원</span>
<span class="price-unit">/명/시간</span>
<span class="price-amount" data-i18n="services.service1.additionalPrice">+100,000원</span>
<span class="price-unit" data-i18n="services.service1.additionalUnit">/명/시간</span>
</div>
<div class="card-features">
<ul>
<li>최대 5인 동시 녹화</li>
<li>다인원 모션 캡쳐</li>
<li>그룹 안무·연기 수록</li>
<li data-i18n="services.service1.additionalFeature1">최대 5인 동시 녹화</li>
<li data-i18n="services.service1.additionalFeature2">다인원 모션 캡쳐</li>
<li data-i18n="services.service1.additionalFeature3">그룹 안무·연기 수록</li>
</ul>
</div>
</div>
@ -146,34 +146,34 @@
<div class="service-info">
<div class="info-card">
<span class="info-icon"><i class="fa-solid fa-users" aria-hidden="true"></i></span>
<p><strong>최소 이용 인원:</strong> 2인</p>
<p data-i18n-html="services.service1.minPerson"><strong>최소 이용 인원:</strong> 2인</p>
</div>
<div class="info-card">
<span class="info-icon"><i class="fa-solid fa-clock" aria-hidden="true"></i></span>
<p><strong>최소 이용시간:</strong> 2시간</p>
<p data-i18n-html="services.service1.minTime"><strong>최소 이용시간:</strong> 2시간</p>
</div>
<div class="info-card">
<span class="info-icon"><i class="fa-solid fa-users" aria-hidden="true"></i></span>
<p><strong>최대 동시 이용:</strong> 5인</p>
<p data-i18n-html="services.service1.maxPerson"><strong>최대 동시 이용:</strong> 5인</p>
</div>
</div>
</div>
<!-- 기술 사양 (컴팩트) -->
<div class="tech-specs-compact">
<h5>제공 기술 및 서비스</h5>
<h5 data-i18n="services.service1.techTitle">제공 기술 및 서비스</h5>
<div class="specs-list">
<div class="spec-tag"><span><i class="fa-solid fa-video" aria-hidden="true"></i></span> OptiTrack 30대 카메라</div>
<div class="spec-tag"><span><i class="fa-solid fa-robot" aria-hidden="true"></i></span> 실시간 아바타 녹화</div>
<div class="spec-tag"><span><i class="fa-solid fa-user" aria-hidden="true"></i></span> 전신/페이셜 캡처</div>
<div class="spec-tag"><span><i class="fa-solid fa-chart-bar" aria-hidden="true"></i></span> 실시간 모니터링</div>
<div class="spec-tag"><span><i class="fa-solid fa-user-gear" aria-hidden="true"></i></span> 전문 오퍼레이터</div>
<div class="spec-tag"><span><i class="fa-solid fa-floppy-disk" aria-hidden="true"></i></span> 모션 데이터 제공</div>
<div class="spec-tag"><span><i class="fa-solid fa-video" aria-hidden="true"></i></span> <span data-i18n="services.service1.tech1">OptiTrack 30대 카메라</span></div>
<div class="spec-tag"><span><i class="fa-solid fa-robot" aria-hidden="true"></i></span> <span data-i18n="services.service1.tech2">실시간 아바타 녹화</span></div>
<div class="spec-tag"><span><i class="fa-solid fa-user" aria-hidden="true"></i></span> <span data-i18n="services.service1.tech3">전신/페이셜 캡처</span></div>
<div class="spec-tag"><span><i class="fa-solid fa-chart-bar" aria-hidden="true"></i></span> <span data-i18n="services.service1.tech4">실시간 모니터링</span></div>
<div class="spec-tag"><span><i class="fa-solid fa-user-gear" aria-hidden="true"></i></span> <span data-i18n="services.service1.tech5">전문 오퍼레이터</span></div>
<div class="spec-tag"><span><i class="fa-solid fa-floppy-disk" aria-hidden="true"></i></span> <span data-i18n="services.service1.tech6">모션 데이터 제공</span></div>
</div>
</div>
<div class="service-note">
<p><strong>참고:</strong> 아바타 리타게팅 서비스는 기본 제공되지 않으며, 후속 작업 연계 시 별도 상담을 통해 제공합니다.</p>
<p data-i18n-html="services.service1.note"><strong>참고:</strong> 아바타 리타게팅 서비스는 기본 제공되지 않으며, 후속 작업 연계 시 별도 상담을 통해 제공합니다.</p>
</div>
</div>
@ -181,46 +181,46 @@
<div class="service-package">
<div class="package-header">
<span class="package-icon"><i class="fa-solid fa-clapperboard" aria-hidden="true"></i></span>
<h3>결합상품</h3>
<span class="package-badge">특화서비스</span>
<h3 data-i18n="services.combo.title">결합상품</h3>
<span class="package-badge" data-i18n="services.combo.badge">특화서비스</span>
</div>
<div class="combo-services">
<div class="combo-card">
<h4>뮤직비디오/숏폼 영상 실시간 촬영</h4>
<h4 data-i18n="services.combo.mvTitle">뮤직비디오/숏폼 영상 실시간 촬영</h4>
<div class="combo-pricing">
<span class="price">모션캡처와 동일 요금</span>
<span class="price" data-i18n="services.combo.mvPrice">모션캡처와 동일 요금</span>
</div>
<div class="combo-features">
<h5>추가 요구사항</h5>
<h5 data-i18n="services.combo.mvReqTitle">추가 요구사항</h5>
<ul>
<li>기획서 사전 협의 필수</li>
<li>캐릭터/배경/프랍 사전 협의</li>
<li>액터 섭외 필요 시: 100,000원 (1명당 시간당)</li>
<li data-i18n="services.combo.mvReq1">기획서 사전 협의 필수</li>
<li data-i18n="services.combo.mvReq2">캐릭터/배경/프랍 사전 협의</li>
<li data-i18n="services.combo.mvReq3">액터 섭외 필요 시: 100,000원 (1명당 시간당)</li>
</ul>
<div class="portfolio-preview">
<button class="portfolio-btn" onclick="openPortfolioPopup()">
<i class="fa-solid fa-film" aria-hidden="true"></i> 포트폴리오 보기
<i class="fa-solid fa-film" aria-hidden="true"></i> <span data-i18n="services.combo.mvPortfolio">포트폴리오 보기</span>
</button>
</div>
</div>
</div>
<div class="combo-card">
<h4>원격 촬영</h4>
<h4 data-i18n="services.combo.remoteTitle">원격 촬영</h4>
<div class="combo-pricing">
<span class="price">모션캡처와 동일 요금</span>
<span class="price" data-i18n="services.combo.remotePrice">모션캡처와 동일 요금</span>
</div>
<div class="combo-features">
<h5>서비스 내용</h5>
<h5 data-i18n="services.combo.remoteServiceTitle">서비스 내용</h5>
<ul>
<li>원격 실시간 촬영 지원</li>
<li>온라인 디렉션 가능</li>
<li>실시간 스트리밍 송출</li>
<li data-i18n="services.combo.remoteService1">원격 실시간 촬영 지원</li>
<li data-i18n="services.combo.remoteService2">온라인 디렉션 가능</li>
<li data-i18n="services.combo.remoteService3">실시간 스트리밍 송출</li>
</ul>
<h5>추가 요금</h5>
<h5 data-i18n="services.combo.remoteExtraTitle">추가 요금</h5>
<ul>
<li>액터 섭외비: 100,000원 (1명당 시간당)</li>
<li data-i18n="services.combo.remoteExtra1">액터 섭외비: 100,000원 (1명당 시간당)</li>
</ul>
</div>
</div>
@ -231,8 +231,8 @@
<div class="service-package featured">
<div class="package-header">
<span class="package-icon"><i class="fa-solid fa-star" aria-hidden="true"></i></span>
<h3>서비스 2: 스트리밍글 서비스</h3>
<span class="package-badge featured">대표상품</span>
<h3 data-i18n="services.service2.title">서비스 2: 스트리밍글 서비스</h3>
<span class="package-badge featured" data-i18n="services.service2.badge">대표상품</span>
</div>
<!-- 스트리밍글 패키지 선택 -->
@ -241,18 +241,18 @@
<div class="pricing-card team reveal" data-reveal="up">
<div class="card-header">
<span class="person-icon"><i class="fa-solid fa-clock" aria-hidden="true"></i></span>
<h4>4시간 패키지</h4>
<span class="popular-badge">NEW</span>
<h4 data-i18n="services.service2.pkg4h">4시간 패키지</h4>
<span class="popular-badge" data-i18n="services.service2.pkg4hBadge">NEW</span>
</div>
<div class="price-display">
<span class="price-amount">1,400,000원</span>
<span class="price-unit">/ 1~5인 사용</span>
<span class="price-amount" data-i18n="services.service2.pkg4hPrice">1,400,000원</span>
<span class="price-unit" data-i18n="services.service2.pkg4hUnit">/ 1~5인 사용</span>
</div>
<div class="card-features">
<ul>
<li>총 4시간 이용</li>
<li>대관 2시간 + 촬영 준비 2시간</li>
<li>6시간 패키지와 동일한 혜택</li>
<li data-i18n="services.service2.pkg4hFeature1">총 4시간 이용</li>
<li data-i18n="services.service2.pkg4hFeature2">대관 2시간 + 촬영 준비 2시간</li>
<li data-i18n="services.service2.pkg4hFeature3">6시간 패키지와 동일한 혜택</li>
</ul>
</div>
</div>
@ -260,17 +260,17 @@
<div class="pricing-card extended reveal" data-reveal="up">
<div class="card-header">
<span class="person-icon"><i class="fa-solid fa-clock" aria-hidden="true"></i></span>
<h4>6시간 패키지</h4>
<h4 data-i18n="services.service2.pkg6h">6시간 패키지</h4>
</div>
<div class="price-display">
<span class="price-amount">2,000,000원</span>
<span class="price-unit">/ 1~5인 사용</span>
<span class="price-amount" data-i18n="services.service2.pkg6hPrice">2,000,000원</span>
<span class="price-unit" data-i18n="services.service2.pkg6hUnit">/ 1~5인 사용</span>
</div>
<div class="card-features">
<ul>
<li>총 6시간 이용</li>
<li>대관 4시간 + 촬영 준비 2시간</li>
<li>대규모 프로젝트에 적합</li>
<li data-i18n="services.service2.pkg6hFeature1">총 6시간 이용</li>
<li data-i18n="services.service2.pkg6hFeature2">대관 4시간 + 촬영 준비 2시간</li>
<li data-i18n="services.service2.pkg6hFeature3">대규모 프로젝트에 적합</li>
</ul>
</div>
</div>
@ -278,35 +278,35 @@
</div>
<div class="streaming-package">
<p class="streaming-common-label"><i class="fa-solid fa-circle-info" aria-hidden="true"></i> 아래 혜택은 4시간·6시간 패키지 모두에 포함됩니다</p>
<p class="streaming-common-label"><i class="fa-solid fa-circle-info" aria-hidden="true"></i> <span data-i18n="services.service2.commonLabel">아래 혜택은 4시간·6시간 패키지 모두에 포함됩니다</span></p>
<div class="package-features">
<div class="feature-column">
<h5>공통 포함 혜택</h5>
<h5 data-i18n="services.service2.benefitsTitle">공통 포함 혜택</h5>
<ul>
<li>1인당 1벌 캐릭터 무료 세팅</li>
<li>기존 보유 배경 중 2개 무료 세팅</li>
<li>프랍 무료 세팅 (신규 프랍 최대 6개, 보유 프랍 무제한)</li>
<li>모션캡처 녹화 서비스</li>
<li>실시간 영상 촬영</li>
<li><strong>라이브 방송 서비스</strong></li>
<li data-i18n="services.service2.benefit1">1인당 1벌 캐릭터 무료 세팅</li>
<li data-i18n="services.service2.benefit2">기존 보유 배경 중 2개 무료 세팅</li>
<li data-i18n="services.service2.benefit3">프랍 무료 세팅 (신규 프랍 최대 6개, 보유 프랍 무제한)</li>
<li data-i18n="services.service2.benefit4">모션캡처 녹화 서비스</li>
<li data-i18n="services.service2.benefit5">실시간 영상 촬영</li>
<li data-i18n="services.service2.benefit6"><strong>라이브 방송 서비스</strong></li>
</ul>
</div>
<div class="feature-column">
<h5>서비스 특징</h5>
<h5 data-i18n="services.service2.featuresTitle">서비스 특징</h5>
<ul>
<li>대규모 프로젝트 지원</li>
<li>복합적 촬영 환경 제공</li>
<li>실시간 스트리밍 (스트리밍글 전용)</li>
<li>전문 스태프 풀 서비스</li>
<li>1~5인 자유롭게 선택 가능</li>
<li data-i18n="services.service2.feature1">대규모 프로젝트 지원</li>
<li data-i18n="services.service2.feature2">복합적 촬영 환경 제공</li>
<li data-i18n="services.service2.feature3">실시간 스트리밍 (스트리밍글 전용)</li>
<li data-i18n="services.service2.feature4">전문 스태프 풀 서비스</li>
<li data-i18n="services.service2.feature5">1~5인 자유롭게 선택 가능</li>
</ul>
</div>
</div>
<div class="portfolio-preview">
<button class="portfolio-btn" onclick="openStreamingPortfolioPopup()">
<i class="fa-solid fa-circle" style="color: #ff0000" aria-hidden="true"></i> 라이브 방송 포트폴리오 보기
<i class="fa-solid fa-circle" style="color: #ff0000" aria-hidden="true"></i> <span data-i18n="services.service2.livePortfolio">라이브 방송 포트폴리오 보기</span>
</button>
</div>
</div>
@ -316,56 +316,56 @@
<div class="service-package mv-production">
<div class="package-header">
<span class="package-icon"><i class="fa-solid fa-clapperboard" aria-hidden="true"></i></span>
<h3>서비스 3: 뮤직비디오 제작 서비스</h3>
<span class="package-badge">프리미엄</span>
<h3 data-i18n="services.service3.title">서비스 3: 뮤직비디오 제작 서비스</h3>
<span class="package-badge" data-i18n="services.service3.badge">프리미엄</span>
</div>
<div class="mv-intro">
<p>기획부터 납품까지, 전문적인 뮤직비디오 제작의 전 과정을 지원합니다.</p>
<p data-i18n="services.service3.intro">기획부터 납품까지, 전문적인 뮤직비디오 제작의 전 과정을 지원합니다.</p>
<div class="mv-price-summary">
<span class="price-range">총 예상 비용: 2,000,000원 ~ 4,000,000원</span>
<span class="price-note">※ 위 비용은 대략적인 예상 금액이며, 프로젝트 규모와 요구사항에 따라 견적이 변경될 수 있습니다.</span>
<span class="price-note">※ 배경 제작 범위, 스토리보드 작가 비용, 아바타/프랍 개수, 연출 난이도에 따라 변동됩니다.</span>
<span class="price-range" data-i18n="services.service3.priceRange">총 예상 비용: 2,000,000원 ~ 4,000,000원</span>
<span class="price-note" data-i18n="services.service3.priceNote1">※ 위 비용은 대략적인 예상 금액이며, 프로젝트 규모와 요구사항에 따라 견적이 변경될 수 있습니다.</span>
<span class="price-note" data-i18n="services.service3.priceNote2">※ 배경 제작 범위, 스토리보드 작가 비용, 아바타/프랍 개수, 연출 난이도에 따라 변동됩니다.</span>
</div>
</div>
<!-- 제작 프로세스 -->
<div class="mv-process">
<h4>제작 프로세스 (7단계)</h4>
<h4 data-i18n="services.service3.processTitle">제작 프로세스 (7단계)</h4>
<div class="process-steps">
<div class="mv-step">
<div class="step-icon">1</div>
<div class="step-details">
<h5>기획 상담 (무료)</h5>
<p>뮤직비디오 제작의 시작 단계로, 콘셉트와 분위기를 정리합니다.</p>
<p class="detail-note">※ 방향성이 명확해야 이후 제작이 원활하게 진행됩니다.</p>
<h5 data-i18n="services.service3.step1Title">기획 상담 (무료)</h5>
<p data-i18n="services.service3.step1Desc">뮤직비디오 제작의 시작 단계로, 콘셉트와 분위기를 정리합니다.</p>
<p class="detail-note" data-i18n="services.service3.step1Note">※ 방향성이 명확해야 이후 제작이 원활하게 진행됩니다.</p>
</div>
</div>
<div class="mv-step">
<div class="step-icon">2</div>
<div class="step-details">
<h5>배경 제작</h5>
<p>저작권 귀속 여부에 따라 옵션을 선택할 수 있습니다.</p>
<h5 data-i18n="services.service3.step2Title">배경 제작</h5>
<p data-i18n="services.service3.step2Desc">저작권 귀속 여부에 따라 옵션을 선택할 수 있습니다.</p>
<div class="pricing-options">
<div class="pricing-option">
<span class="option-type">보유 배경 사용</span>
<span class="option-price">30,000원/개</span>
<span class="option-note">저작권: 회사 귀속</span>
<span class="option-type" data-i18n="services.service3.step2Opt1Type">보유 배경 사용</span>
<span class="option-price" data-i18n="services.service3.step2Opt1Price">30,000원/개</span>
<span class="option-note" data-i18n="services.service3.step2Opt1Note">저작권: 회사 귀속</span>
</div>
<div class="pricing-option">
<span class="option-type">신규 제작 (회사 귀속)</span>
<span class="option-price">100,000원/개</span>
<span class="option-note">저작권: 회사 귀속 (대형 또는 특수 배경은 제한될 수 있음)</span>
<span class="option-type" data-i18n="services.service3.step2Opt2Type">신규 제작 (회사 귀속)</span>
<span class="option-price" data-i18n="services.service3.step2Opt2Price">100,000원/개</span>
<span class="option-note" data-i18n="services.service3.step2Opt2Note">저작권: 회사 귀속 (대형 또는 특수 배경은 제한될 수 있음)</span>
</div>
<div class="pricing-option">
<span class="option-type">신규 제작 (클라이언트 귀속)</span>
<span class="option-price">200,000원 ~ 1,000,000원/개</span>
<span class="option-note">저작권: 클라이언트 소유 (규모와 디테일에 따라 변동)</span>
<span class="option-type" data-i18n="services.service3.step2Opt3Type">신규 제작 (클라이언트 귀속)</span>
<span class="option-price" data-i18n="services.service3.step2Opt3Price">200,000원 ~ 1,000,000원/개</span>
<span class="option-note" data-i18n="services.service3.step2Opt3Note">저작권: 클라이언트 소유 (규모와 디테일에 따라 변동)</span>
</div>
</div>
<div class="process-note">
<p><i class="fa-solid fa-thumbtack" aria-hidden="true"></i> Unity 빌드로 전달되어 카메라 시점 확인 가능</p>
<p><i class="fa-solid fa-thumbtack" aria-hidden="true"></i> <span data-i18n="services.service3.step2ProcessNote">Unity 빌드로 전달되어 카메라 시점 확인 가능</span></p>
</div>
</div>
</div>
@ -373,90 +373,90 @@
<div class="mv-step">
<div class="step-icon">3</div>
<div class="step-details">
<h5>스토리보드 작성</h5>
<h5 data-i18n="services.service3.step3Title">스토리보드 작성</h5>
<div class="step-pricing">
<span class="price-amount">100,000원~</span>
<span class="price-amount" data-i18n="services.service3.step3Price">100,000원~</span>
</div>
<p>외부 전문 작가가 뮤직비디오의 흐름을 구체화합니다.</p>
<p class="detail-note">※ 고객과 공유하여 연출과 카메라 컷을 사전 확인 및 컨펌</p>
<p data-i18n="services.service3.step3Desc">외부 전문 작가가 뮤직비디오의 흐름을 구체화합니다.</p>
<p class="detail-note" data-i18n="services.service3.step3Note">※ 고객과 공유하여 연출과 카메라 컷을 사전 확인 및 컨펌</p>
</div>
</div>
<div class="mv-step">
<div class="step-icon">4</div>
<div class="step-details">
<h5>아바타 세팅 및 프랍 제작</h5>
<h5 data-i18n="services.service3.step4Title">아바타 세팅 및 프랍 제작</h5>
<div class="step-pricing">
<span class="price-label">아바타 세팅:</span>
<span class="price-amount">50,000원/개</span>
<span class="price-label" data-i18n="services.service3.step4AvatarLabel">아바타 세팅:</span>
<span class="price-amount" data-i18n="services.service3.step4AvatarPrice">50,000원/개</span>
</div>
<div class="step-pricing">
<span class="price-label">스토리 진행용 프랍:</span>
<span class="price-amount">20,000원/개</span>
<span class="price-label" data-i18n="services.service3.step4PropLabel">스토리 진행용 프랍:</span>
<span class="price-amount" data-i18n="services.service3.step4PropPrice">20,000원/개</span>
</div>
<p>아바타를 뮤직비디오 환경에 맞게 최적화합니다.</p>
<p class="detail-note">※ 아바타 수정 및 최적화 작업 가능</p>
<p data-i18n="services.service3.step4Desc">아바타를 뮤직비디오 환경에 맞게 최적화합니다.</p>
<p class="detail-note" data-i18n="services.service3.step4Note">※ 아바타 수정 및 최적화 작업 가능</p>
</div>
</div>
<div class="mv-step">
<div class="step-icon">5</div>
<div class="step-details">
<h5>모션 캡처</h5>
<h5 data-i18n="services.service3.step5Title">모션 캡처</h5>
<div class="mv-mocap-pricing">
<h6>모션캡처 스튜디오 대관 비용</h6>
<h6 data-i18n="services.service3.step5StudioLabel">모션캡처 스튜디오 대관 비용</h6>
<div class="step-pricing">
<span class="price-label">1인 이용:</span>
<span class="price-amount">150,000원/시간</span>
<span class="price-label" data-i18n="services.service3.step5Solo">1인 이용:</span>
<span class="price-amount" data-i18n="services.service3.step5SoloPrice">150,000원/시간</span>
</div>
<div class="step-pricing">
<span class="price-label">2인 이용:</span>
<span class="price-amount">200,000원/시간</span>
<span class="price-label" data-i18n="services.service3.step5Duo">2인 이용:</span>
<span class="price-amount" data-i18n="services.service3.step5DuoPrice">200,000원/시간</span>
</div>
<div class="step-pricing">
<span class="price-label">추가 인원:</span>
<span class="price-amount">+100,000원/명/시간</span>
<span class="price-note">(최대 5인까지)</span>
<span class="price-label" data-i18n="services.service3.step5Extra">추가 인원:</span>
<span class="price-amount" data-i18n="services.service3.step5ExtraPrice">+100,000원/명/시간</span>
<span class="price-note" data-i18n="services.service3.step5ExtraNote">(최대 5인까지)</span>
</div>
</div>
<div class="mv-mocap-pricing">
<h6>액터 섭외 비용</h6>
<h6 data-i18n="services.service3.step5ActorLabel">액터 섭외 비용</h6>
<div class="step-pricing">
<span class="price-label">액터 섭외:</span>
<span class="price-amount">100,000원/명/시간</span>
<span class="price-label" data-i18n="services.service3.step5Actor">액터 섭외:</span>
<span class="price-amount" data-i18n="services.service3.step5ActorPrice">100,000원/명/시간</span>
</div>
</div>
<p>스토리보드를 기반으로 모션을 녹화합니다.</p>
<p class="detail-note">※ 촬영 기간: 1~2일 소요</p>
<p class="detail-note">※ 최소 이용: 2시간</p>
<p data-i18n="services.service3.step5Desc">스토리보드를 기반으로 모션을 녹화합니다.</p>
<p class="detail-note" data-i18n="services.service3.step5Note1">※ 촬영 기간: 1~2일 소요</p>
<p class="detail-note" data-i18n="services.service3.step5Note2">※ 최소 이용: 2시간</p>
</div>
</div>
<div class="mv-step">
<div class="step-icon">6</div>
<div class="step-details">
<h5>룩 개발 & 연출</h5>
<h5 data-i18n="services.service3.step6Title">룩 개발 & 연출</h5>
<div class="step-pricing">
<span class="price-amount">500,000원~</span>
<span class="price-amount" data-i18n="services.service3.step6Price">500,000원~</span>
</div>
<p>Unity에서 포스트 프로세싱, 아트워크, 카메라 워킹 등을 진행합니다.</p>
<p class="detail-note">※ 연출 복잡도와 퀄리티에 따라 변동</p>
<p data-i18n="services.service3.step6Desc">Unity에서 포스트 프로세싱, 아트워크, 카메라 워킹 등을 진행합니다.</p>
<p class="detail-note" data-i18n="services.service3.step6Note">※ 연출 복잡도와 퀄리티에 따라 변동</p>
</div>
</div>
<div class="mv-step">
<div class="step-icon">7</div>
<div class="step-details">
<h5>최종 피드백 & 납품</h5>
<p>완성된 영상을 고객 피드백 반영 후 수정하여 최종 납품합니다.</p>
<p class="detail-note">※ 납품 형식: mp4/mov 등</p>
<h5 data-i18n="services.service3.step7Title">최종 피드백 & 납품</h5>
<p data-i18n="services.service3.step7Desc">완성된 영상을 고객 피드백 반영 후 수정하여 최종 납품합니다.</p>
<p class="detail-note" data-i18n="services.service3.step7Note">※ 납품 형식: mp4/mov 등</p>
</div>
</div>
</div>
</div>
<div class="service-note">
<p><strong><i class="fa-solid fa-lightbulb" aria-hidden="true"></i> 제작 프로세스:</strong> 기획 상담(무료) → 전체 견적 제시 → 견적 승인 후 제작 시작 (2단계~7단계 순차 진행)</p>
<p data-i18n-html="services.service3.processNote"><strong><i class="fa-solid fa-lightbulb" aria-hidden="true"></i> 제작 프로세스:</strong> 기획 상담(무료) → 전체 견적 제시 → 견적 승인 후 제작 시작 (2단계~7단계 순차 진행)</p>
</div>
</div>
@ -467,12 +467,12 @@
<section class="section bg-light">
<div class="container">
<div class="section-header">
<h2>추가 옵션 요금</h2>
<p>모든 서비스 패키지에 공통으로 적용되는 추가 옵션입니다</p>
<h2 data-i18n="services.options.title">추가 옵션 요금</h2>
<p data-i18n="services.options.desc">모든 서비스 패키지에 공통으로 적용되는 추가 옵션입니다</p>
</div>
<div class="vat-notice-header">
<p><em>*부가세 별도</em></p>
<p><em data-i18n="services.options.vatNote">*부가세 별도</em></p>
</div>
<div class="options-grid stagger-children">
@ -480,14 +480,14 @@
<div class="option-card reveal" data-reveal="up">
<div class="option-header">
<span class="option-icon"><i class="fa-solid fa-palette" aria-hidden="true"></i></span>
<h3>캐릭터 세팅</h3>
<h3 data-i18n="services.options.charSetup">캐릭터 세팅</h3>
</div>
<div class="option-pricing">
<div class="price">
<span class="price-amount">50,000원~</span>
<span class="price-unit">/ 1인 1벌</span>
<span class="price-amount" data-i18n="services.options.charPrice">50,000원~</span>
<span class="price-unit" data-i18n="services.options.charUnit">/ 1인 1벌</span>
</div>
<p class="option-description">신규 캐릭터 세팅 작업</p>
<p class="option-description" data-i18n="services.options.charDesc">신규 캐릭터 세팅 작업</p>
</div>
</div>
@ -495,24 +495,24 @@
<div class="option-card reveal" data-reveal="up">
<div class="option-header">
<span class="option-icon"><i class="fa-solid fa-mountain-sun" aria-hidden="true"></i></span>
<h3>배경 세팅</h3>
<h3 data-i18n="services.options.bgSetup">배경 세팅</h3>
</div>
<div class="option-content">
<div class="option-item">
<h4>기존 보유 배경 사용</h4>
<h4 data-i18n="services.options.bgExisting">기존 보유 배경 사용</h4>
<div class="price">
<span class="price-amount">30,000원~</span>
<span class="price-unit">/ 1개</span>
<span class="price-amount" data-i18n="services.options.bgExistingPrice">30,000원~</span>
<span class="price-unit" data-i18n="services.options.bgExistingUnit">/ 1개</span>
</div>
<p class="option-note">세팅비만 부과</p>
<p class="option-note" data-i18n="services.options.bgExistingNote">세팅비만 부과</p>
</div>
<div class="option-item">
<h4>신규 배경 제작</h4>
<h4 data-i18n="services.options.bgNew">신규 배경 제작</h4>
<div class="price">
<span class="price-amount">100,000원~</span>
<span class="price-unit">/ 1개</span>
<span class="price-amount" data-i18n="services.options.bgNewPrice">100,000원~</span>
<span class="price-unit" data-i18n="services.options.bgNewUnit">/ 1개</span>
</div>
<p class="option-note">세팅비 + 제작비/구입비 별도<br>
<p class="option-note" data-i18n-html="services.options.bgNewNote">세팅비 + 제작비/구입비 별도<br>
밍글스튜디오 또는 의뢰자 귀속 선택 가능합니다</p>
</div>
</div>
@ -522,40 +522,40 @@
<div class="option-card reveal" data-reveal="up">
<div class="option-header">
<span class="option-icon"><i class="fa-solid fa-masks-theater" aria-hidden="true"></i></span>
<h3>프랍 세팅</h3>
<h3 data-i18n="services.options.propSetup">프랍 세팅</h3>
</div>
<div class="option-pricing">
<div class="price">
<span class="price-amount">20,000원</span>
<span class="price-unit">/ 1개</span>
<span class="price-amount" data-i18n="services.options.propPrice">20,000원</span>
<span class="price-unit" data-i18n="services.options.propUnit">/ 1개</span>
</div>
<p class="option-description">프랍 세팅 작업<br>(스트리밍글 서비스: 신규 프랍 최대 6개, 보유 프랍 무제한 무료 제공)</p>
<p class="option-description" data-i18n-html="services.options.propDesc">프랍 세팅 작업<br>(스트리밍글 서비스: 신규 프랍 최대 6개, 보유 프랍 무제한 무료 제공)</p>
</div>
</div>
</div>
<!-- 이용 안내사항 -->
<div class="usage-notes">
<h3>이용 안내사항</h3>
<h3 data-i18n="services.usage.title">이용 안내사항</h3>
<div class="notes-grid">
<div class="note-item">
<h4>운영 시간</h4>
<p>기본 운영 시간: 10:00 ~ 22:00<br>
<h4 data-i18n="services.usage.hours">운영 시간</h4>
<p data-i18n-html="services.usage.hoursDesc">기본 운영 시간: 10:00 ~ 22:00<br>
야간 이용 시 요금 1.5배 적용</p>
</div>
<div class="note-item">
<h4>최소 이용 시간</h4>
<p>모든 서비스 최소 2시간<br>
<h4 data-i18n="services.usage.minTime">최소 이용 시간</h4>
<p data-i18n-html="services.usage.minTimeDesc">모든 서비스 최소 2시간<br>
(스트리밍글 서비스 제외)</p>
</div>
<div class="note-item">
<h4>사전 준비 사항</h4>
<p>뮤직비디오/숏폼 촬영 시<br>
<h4 data-i18n="services.usage.preparation">사전 준비 사항</h4>
<p data-i18n-html="services.usage.preparationDesc">뮤직비디오/숏폼 촬영 시<br>
기획서 및 준비물 사전 협의 필수</p>
</div>
<div class="note-item">
<h4>후속 서비스</h4>
<p>아바타 리타게팅은 후속 작업 연계 시에만<br>
<h4 data-i18n="services.usage.followUp">후속 서비스</h4>
<p data-i18n-html="services.usage.followUpDesc">아바타 리타게팅은 후속 작업 연계 시에만<br>
제공됩니다 (별도 상담)</p>
</div>
</div>
@ -567,55 +567,55 @@
<section class="section bg-light">
<div class="container">
<div class="section-header">
<h2>서비스 이용 안내</h2>
<h2 data-i18n="services.guide.title">서비스 이용 안내</h2>
</div>
<!-- 스튜디오 대관 절차 -->
<div class="card card--flat reveal" data-reveal="fade">
<h3>스튜디오 대관 절차</h3>
<h3 data-i18n="services.guide.processTitle">스튜디오 대관 절차</h3>
<div class="process-flow">
<div class="process-step">
<div class="step-number">1</div>
<div class="step-content">
<h4>이메일 문의</h4>
<p>예약 양식을 작성하여 문의</p>
<h4 data-i18n="services.guide.step1">이메일 문의</h4>
<p data-i18n="services.guide.step1Desc">예약 양식을 작성하여 문의</p>
</div>
</div>
<div class="process-arrow">→</div>
<div class="process-step">
<div class="step-number">2</div>
<div class="step-content">
<h4>담당자 확인 및 협의</h4>
<p>세부사항 조율</p>
<h4 data-i18n="services.guide.step2">담당자 확인 및 협의</h4>
<p data-i18n="services.guide.step2Desc">세부사항 조율</p>
</div>
</div>
<div class="process-arrow">→</div>
<div class="process-step">
<div class="step-number">3</div>
<div class="step-content">
<h4>전액 결제</h4>
<p>결제 완료</p>
<h4 data-i18n="services.guide.step3">전액 결제</h4>
<p data-i18n="services.guide.step3Desc">결제 완료</p>
</div>
</div>
<div class="process-arrow">→</div>
<div class="process-step">
<div class="step-number">4</div>
<div class="step-content">
<h4>예약 확정</h4>
<p>최종 예약 완료</p>
<h4 data-i18n="services.guide.step4">예약 확정</h4>
<p data-i18n="services.guide.step4Desc">최종 예약 완료</p>
</div>
</div>
</div>
<div class="booking-buttons">
<button id="showEmailForm" class="btn btn-primary">
<span><i class="fa-solid fa-envelope" aria-hidden="true"></i></span> 이메일 문의하기
<span><i class="fa-solid fa-envelope" aria-hidden="true"></i></span> <span data-i18n="services.guide.btnEmail">이메일 문의하기</span>
</button>
<a href="https://m.booking.naver.com/booking/10/bizes/1468174/items/6949481" target="_blank" class="btn btn-secondary">
<span><i class="fa-solid fa-calendar" aria-hidden="true"></i></span> 네이버 예약 바로가기
<span><i class="fa-solid fa-calendar" aria-hidden="true"></i></span> <span data-i18n="services.guide.btnNaver">네이버 예약 바로가기</span>
</a>
</div>
<p class="booking-note">※ 네이버 플레이스를 통해 실시간 일정 확인 및 예약이 가능합니다</p>
<p class="booking-note" data-i18n="services.guide.naverNote">※ 네이버 플레이스를 통해 실시간 일정 확인 및 예약이 가능합니다</p>
<!-- 이메일 양식 -->
<div id="emailForm" class="email-form" style="display:none;">
@ -673,49 +673,49 @@
<!-- 예약 및 취소 규정 -->
<div class="grid grid-2">
<div class="card card--flat reveal" data-reveal="fade">
<h3>예약 안내</h3>
<h3 data-i18n="services.policy.reservationTitle">예약 안내</h3>
<ul class="info-list">
<li>스튜디오 예약은 이용 희망일로부터 최소 2주 전에 신청하시는 것을 권장합니다.</li>
<li>예약 확정 후 고객의 사정으로 인한 예약 취소 시 일정 기준에 따른 위약금이 발생합니다.</li>
<li data-i18n="services.policy.reservation1">스튜디오 예약은 이용 희망일로부터 최소 2주 전에 신청하시는 것을 권장합니다.</li>
<li data-i18n="services.policy.reservation2">예약 확정 후 고객의 사정으로 인한 예약 취소 시 일정 기준에 따른 위약금이 발생합니다.</li>
</ul>
</div>
<div class="card card--flat reveal" data-reveal="fade">
<h3>방문 안내</h3>
<h3 data-i18n="services.policy.visitTitle">방문 안내</h3>
<ul class="info-list">
<li>본 촬영 전 모션캡쳐 수트 착용 등의 준비시간이 소요되므로 촬영예정 시간 최소 30분 전에 방문 부탁드립니다. (준비시간은 이용시간에 포함되지 않습니다.)</li>
<li>안경, 귀걸이 등 반사가 잘 되는 재질의 악세사리는 촬영 시 가급적 착용을 자제하여 주시기 바랍니다.</li>
<li data-i18n="services.policy.visit1">본 촬영 전 모션캡쳐 수트 착용 등의 준비시간이 소요되므로 촬영예정 시간 최소 30분 전에 방문 부탁드립니다. (준비시간은 이용시간에 포함되지 않습니다.)</li>
<li data-i18n="services.policy.visit2">안경, 귀걸이 등 반사가 잘 되는 재질의 악세사리는 촬영 시 가급적 착용을 자제하여 주시기 바랍니다.</li>
</ul>
</div>
</div>
<!-- 취소 환불 규정 -->
<div class="card card--flat reveal" data-reveal="fade">
<h3>취소 환불 규정</h3>
<h3 data-i18n="services.policy.refundTitle">취소 환불 규정</h3>
<div class="table-responsive">
<table class="refund-table">
<thead>
<tr>
<th scope="col">취소 시점</th>
<th scope="col">환불 비율</th>
<th scope="col" data-i18n="services.policy.refundColTime">취소 시점</th>
<th scope="col" data-i18n="services.policy.refundColRate">환불 비율</th>
</tr>
</thead>
<tbody>
<tr>
<td>예약일로부터 7일 전</td>
<td class="refund-100">100% 환불</td>
<td data-i18n="services.policy.refund7days">예약일로부터 7일 전</td>
<td class="refund-100" data-i18n="services.policy.refund100">100% 환불</td>
</tr>
<tr>
<td>예약일로부터 3일 전</td>
<td class="refund-70">70% 환불</td>
<td data-i18n="services.policy.refund3days">예약일로부터 3일 전</td>
<td class="refund-70" data-i18n="services.policy.refund70">70% 환불</td>
</tr>
<tr>
<td>예약일로부터 1일 전</td>
<td class="refund-50">50% 환불</td>
<td data-i18n="services.policy.refund1day">예약일로부터 1일 전</td>
<td class="refund-50" data-i18n="services.policy.refund50">50% 환불</td>
</tr>
<tr>
<td>당일 취소</td>
<td class="refund-0">환불 불가</td>
<td data-i18n="services.policy.refundSameDay">당일 취소</td>
<td class="refund-0" data-i18n="services.policy.refundNone">환불 불가</td>
</tr>
</tbody>
</table>
@ -971,6 +971,7 @@
</div>
<!-- JavaScript -->
<script src="js/i18n.js"></script>
<script src="js/common.js"></script>
<script src="js/services.js"></script>
</body>