@jjlmoya/utils-audiovisual 1.6.0 → 1.8.0

package/src/tool/collageMaker/i18n/ja.ts

@@ -0,0 +1,233 @@
+import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dts';
+import type { CollageMakerUI, CollageMakerLocaleContent } from '../index';
+
+const slug = 'free-online-photo-collage-maker-professional-compositions';
+const title = 'オンライン コラージュ作成ツール：プロ仕様のデザイン';
+const description = '数秒で無料のフォトコラージュを作成。複数のレイアウトから選択し、境界線を調整して、ウォーターマークなしの高画質でダウンロードできます。';
+
+const ui: CollageMakerUI = {
+    dropTitle: "ここに画像をドラッグ",
+    dropSub: "または {link} - 最小2、最大9枚",
+    dropLink: "ファイルを選択",
+    imgsLoaded: "読み込まれた画像",
+    layoutLabel: "レイアウト",
+    settingsLabel: "設定",
+    borderLabel: "境界線",
+    borderColorLabel: "境界線の色",
+    bgColorLabel: "背景",
+    downloadBtn: "ダウンロード",
+    previewTitle: "プレビュー",
+    needsImgs: "あと {n} 枚の画像が必要です",
+    errorMin: "少なくとも2枚の画像が必要です",
+    errorMax: "最大9枚まで許可されています",
+    errorLoad: "画像の読み込み中にエラーが発生しました",
+    faqTitle: "よくある質問",
+    bibliographyTitle: "リファレンス"
+};
+
+const faq: CollageMakerLocaleContent['faq'] = [
+    {
+        question: "写真の順序を変更するにはどうすればよいですか？",
+        answer: "写真は、読み込まれた画像リストに表示される順序でコラージュに配置されます。一度削除してから再度アップロードすることで、位置を調整できます。",
+    },
+    {
+        question: "コラージュの出力形式は何ですか？",
+        answer: "コラージュは高解像度WebP形式でダウンロードされます。これは鮮明さを維持したままSNSで共有するのに最適です。",
+    },
+];
+
+const howTo: CollageMakerLocaleContent['howTo'] = [
+    {
+        name: "写真をアップロード",
+        text: "ファイルエクスプローラーから2枚から9枚の画像を選択します。",
+    },
+    {
+        name: "レイアウトを選択",
+        text: "アップロードした写真の数に最適なグリッドを選択します。",
+    },
+    {
+        name: "スタイルをカスタマイズ",
+        text: "境界線の太さと色を調整して、プロフェッショナルな仕上がりにします。",
+    },
+    {
+        name: "ダウンロードして共有",
+        text: "作成ボタンを押し、完成した作品を即座にダウンロードします。",
+    },
+];
+
+const bibliography: CollageMakerLocaleContent['bibliography'] = [
+    {
+        name: "写真の構図：コラージュの芸術",
+        url: "https://ja.wikipedia.org/wiki/%E3%82%B3%E3%83%A9%E3%83%BC%E3%82%B8%E3%83%A5",
+    },
+];
+
+const seo: CollageMakerLocaleContent['seo'] = [
+    {
+        type: 'summary',
+        title: 'プロ仕様のオンラインコラージュ作成ツール',
+        items: [
+            '複数のレイアウトと定義済みグリッド',
+            '境界線と背景色のカスタマイズ',
+            'SNSに最適な1200pxの高解像度',
+            '使用制限なしの即時処理'
+        ]
+    },
+    { type: 'title', text: 'コラージュデザイン：物語を語る構図', level: 2 },
+    { type: 'paragraph', html: 'コラージュは単なる写真の混ぜ合わせではありません。感情や文脈を伝える視覚的な物語です。当社のツールを使えば、Photoshopや高価なソフトウェアを必要とせず、Instagram、Facebook、Pinterest、または個人プロジェクト用のプロフェッショナルな幾何学的構成を作成できます。' },
+
+    { type: 'stats', items: [
+        { value: '2-9', label: '枚の画像', icon: 'mdi:image-multiple' },
+        { value: '1200px', label: 'HD解像度', icon: 'mdi:video-high-definition' },
+        { value: '即時', label: '生成', icon: 'mdi:lightning-bolt' }
+    ], columns: 3 },
+
+    { type: 'title', text: '視覚的構成：デザインの原則', level: 3 },
+    { type: 'paragraph', html: '構成とは、見る人の視線を誘導し、意図を伝えるように視覚要素を整理する技術です。優れたコラージュは以下のバランスを取ります：' },
+    { type: 'list', items: [
+        '<strong>均衡：</strong> 視覚的な重みの分配（明るい画像対暗い画像、大きい対小さい）。',
+        '<strong>視線の流れ：</strong> 視線が不自然な空白なく、構成内を自然に移動するようにします。',
+        '<strong>対比：</strong> 注意を引くための色、サイズ、形状の変化。',
+        '<strong>統一：</strong> テーマの一貫性 - 画像同士が同じ物語について「共に語る」必要があります。'
+    ], icon: 'mdi:check' },
+
+    { type: 'card', title: 'スマートで適応性のあるデザイン', html: '当社のシステムは、写真の数に基づいて最適な空間配分を自動的に計算します。2枚なら対称グリッド、5枚ならバランスの取れた非対称配分。各グリッドは視覚的インパクトを最大化するように設計されています。' },
+
+    { type: 'comparative', items: [
+        {
+            title: 'SNS用',
+            description: 'Instagram、TikTok、Facebook - 正方形フォーマット',
+            icon: 'mdi:share-all',
+            points: [
+                '1200pxはInstagramフィードに最適',
+                '正方形フォーマットにより投稿時の切り抜きを回避',
+                'ブランディングのためのカスタマイズ可能な境界線'
+            ],
+            highlight: true
+        },
+        {
+            title: 'ポートフォリオ用',
+            description: '写真家やデザイナーのための視覚的ショーケース',
+            icon: 'mdi:briefcase-outline',
+            points: [
+                'プロジェクトの複数の角度を表示',
+                'まとまりのある視覚的物語',
+                'プロ仕様のデジタルブック印刷'
+            ]
+        },
+        {
+            title: '個人的なギフト用',
+            description: 'プリント、フレーム、デジタルアルバム',
+            icon: 'mdi:gift-outline',
+            points: [
+                'イベントの思い出（結婚式、旅行）',
+                '印刷に対応した高解像度',
+                '手作業なしの即時デザイン'
+            ]
+        }
+    ], columns: 3 },
+
+    { type: 'title', text: 'カスタマイズ：境界線と色', level: 3 },
+    { type: 'table', headers: ['要素', '視覚効果', '推奨事項'], rows: [
+        ['白い境界線', 'クリーン、ミニマル、モダン', 'SNS、デジタルポートフォリオ'],
+        ['黒い境界線', 'ドラマチック、プロフェッショナル、芸術的', '芸術写真、ファッション、高級感'],
+        ['ニュートラルな境界線（グレー）', '多用途、アカデミック、コーポレート', 'ビジネス、教育、中立性'],
+        ['境界線なし', '融合、継続、没入感', '均一な背景、流れるような写真']
+    ] },
+
+    { type: 'proscons', items: [
+        {
+            pro: '定義済みのプロ仕様デザイン - 構成の知識は不要',
+            con: 'オプションは事前設定されたグリッドに限定されます'
+        },
+        {
+            pro: 'リサイズなしでSNSにそのまま使える1200px解像度',
+            con: 'Photoshopほど自由にカスタマイズはできません'
+        },
+        {
+            pro: '100%ローカル処理 - プライバシー、スピード、無制限',
+            con: '最新のブラウザが必要です'
+        },
+        {
+            pro: '完全無料、ウォーターマークなし、広告なし',
+            con: '個別の編集オプション（切り抜き、回転）はありません'
+        }
+    ], proTitle: 'メリット', conTitle: '制限事項' },
+
+    { type: 'diagnostic', variant: 'success', title: 'SNSに対応', icon: 'mdi:check-circle-outline', badge: '最適化済み', html: '1200x1200pxはInstagramに最適な解像度です。あらゆるアスペクト比をサポートしますが、正方形の出力はフィードでのインパクトを最大化し、自動的な切り抜きを排除し、デスクトップ、タブレット、モバイルのどこでも美しく見えます。' },
+
+    { type: 'glossary', items: [
+        {
+            term: '視覚的構成',
+            definition: '見る人の視線を誘導し、感情的な意図を伝えるために要素（色、形状、空間）を整理する技術。'
+        },
+        {
+            term: '三分割法',
+            definition: '構図の原則：画像を9つの等しい領域（3x3）に分割します。被写体を交点に配置することで、最大のインパクトを与えます。'
+        },
+        {
+            term: '対称グリッド',
+            definition: '等間隔の分割。安心感があり、秩序だっています。写真のペアや偶数枚に最適です。'
+        },
+        {
+            term: '非対称グリッド',
+            definition: '不等間隔の分割。ダイナミックで面白く、視覚的です。サイズの異なる5枚以上の写真に最適です。'
+        },
+        {
+            term: '視覚的均衡',
+            definition: '視覚的な重みの知覚的な均等。明るい画像＋暗い画像＝バランス、大きい＋小さい＝バランス。'
+        }
+    ] },
+
+    { type: 'message', title: '即座に視覚的物語を', ariaLabel: '構成とコラージュに関する情報', html: 'すべてのコラージュには物語があります。当社の自動デザイナーは、あなたの視覚的な物語がバランスよく、プロフェッショナルで、世界に向けて発信できる状態であることを保証します。グラフィックデザイナーの作業を待つ必要はありません。' },
+
+    { type: 'title', text: '作り、共有し、刺激を与える', level: 3 },
+    { type: 'paragraph', html: 'よくできたコラージュは、忘れ去られる投稿と、フォロワーが記憶し、共有する投稿との違いを生みます。インパクトを与えるために、視覚的な物語にスマートな構成を取り入れましょう。' }
+];
+
+const faqSchema: WithContext<FAQPage> = {
+    '@context': 'https://schema.org',
+    '@type': 'FAQPage',
+    mainEntity: faq.map((item) => ({
+        '@type': 'Question',
+        name: item.question,
+        acceptedAnswer: { '@type': 'Answer', text: item.answer },
+    })),
+};
+
+const howToSchema: WithContext<HowTo> = {
+    '@context': 'https://schema.org',
+    '@type': 'HowTo',
+    name: title,
+    description,
+    step: howTo.map((step) => ({
+        '@type': 'HowToStep',
+        name: step.name,
+        text: step.text,
+    })),
+};
+
+const appSchema: WithContext<SoftwareApplication> = {
+    '@context': 'https://schema.org',
+    '@type': 'SoftwareApplication',
+    name: title,
+    description,
+    applicationCategory: 'UtilitiesApplication',
+    operatingSystem: 'Web',
+    offers: { '@type': 'Offer', price: '0', priceCurrency: 'EUR' },
+    inLanguage: 'ja',
+};
+
+export const content: CollageMakerLocaleContent = {
+    slug,
+    title,
+    description,
+    ui,
+    seo,
+    faqTitle: "よくある質問",
+    faq,
+    bibliographyTitle: "リファレンス",
+    bibliography,
+    howTo,
+    schemas: [faqSchema as any, howToSchema as any, appSchema],
+};

package/src/tool/collageMaker/i18n/ko.ts

@@ -0,0 +1,233 @@
+import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dts';
+import type { CollageMakerUI, CollageMakerLocaleContent } from '../index';
+
+const slug = 'free-online-photo-collage-maker-professional-compositions';
+const title = '온라인 콜라주 메이커: 전문적인 구도 디자인';
+const description = '몇 초 만에 무료로 사진 콜라주를 만드세요. 다양한 레이아웃 중에서 선택하고, 테두리를 조정하며, 워터마크 없이 고화질로 다운로드하세요.';
+
+const ui: CollageMakerUI = {
+    dropTitle: "여기에 이미지를 드래그하세요",
+    dropSub: "또는 {link} - 최소 2개, 최대 9개",
+    dropLink: "파일 선택",
+    imgsLoaded: "로드된 이미지",
+    layoutLabel: "레이아웃",
+    settingsLabel: "설정",
+    borderLabel: "테두리",
+    borderColorLabel: "테두리 색상",
+    bgColorLabel: "배경",
+    downloadBtn: "다운로드",
+    previewTitle: "미리보기",
+    needsImgs: "이미지 {n}개가 더 필요합니다",
+    errorMin: "최소 2개의 이미지가 필요합니다",
+    errorMax: "최대 9개까지만 허용됩니다",
+    errorLoad: "이미지를 로드하는 중 오류가 발생했습니다",
+    faqTitle: "자주 묻는 질문",
+    bibliographyTitle: "참고 문헌"
+};
+
+const faq: CollageMakerLocaleContent['faq'] = [
+    {
+        question: "사진 순서를 어떻게 바꿀 수 있나요?",
+        answer: "사진은 로드된 이미지 목록에 표시된 순서대로 콜라주에 배치됩니다. 하나를 삭제하고 다시 업로드하여 위치를 조정할 수 있습니다.",
+    },
+    {
+        question: "콜라주의 출력 형식은 무엇인가요?",
+        answer: "콜라주는 고해상도 WebP 형식으로 다운로드됩니다. 이는 선명도를 유지하면서 소셜 네트워크에 공유하기에 이상적입니다.",
+    },
+];
+
+const howTo: CollageMakerLocaleContent['howTo'] = [
+    {
+        name: "사진 업로드",
+        text: "파일 탐색기에서 2개 이상 9개 이하의 이미지를 선택하세요.",
+    },
+    {
+        name: "레이아웃 선택",
+        text: "업로드한 사진 수에 가장 적합한 그리드를 선택하세요.",
+    },
+    {
+        name: "스타일 맞춤 설정",
+        text: "전문적인 마무리를 위해 테두리 두께와 색상을 조정하세요.",
+    },
+    {
+        name: "다운로드 및 공유",
+        text: "만들기 버튼을 누르고 완성된 결과물을 즉시 다운로드하세요.",
+    },
+];
+
+const bibliography: CollageMakerLocaleContent['bibliography'] = [
+    {
+        name: "사진 구도: 콜라주의 예술",
+        url: "https://ko.wikipedia.org/wiki/%EC%BD%9C%EB%9D%BC%EC%A3%BC",
+    },
+];
+
+const seo: CollageMakerLocaleContent['seo'] = [
+    {
+        type: 'summary',
+        title: '전문 온라인 콜라주 메이커',
+        items: [
+            '다양한 레이아웃과 미리 정의된 그리드',
+            '테두리 및 배경색 맞춤 설정',
+            '소셜 네트워크에 적합한 1200px 고해상도',
+            '사용 제한 없는 즉각적인 처리'
+        ]
+    },
+    { type: 'title', text: '콜라주 디자인: 이야기를 담은 구도', level: 2 },
+    { type: 'paragraph', html: '콜라주는 단순한 사진의 조합 이상입니다. 감정과 맥락을 전달하는 시각적 서사입니다. 당사의 도구를 사용하면 Photoshop이나 비싼 소프트웨어 없이도 Instagram, Facebook, Pinterest 또는 개인 프로젝트를 위한 전문적인 기하학적 구도를 만들 수 있습니다.' },
+
+    { type: 'stats', items: [
+        { value: '2-9', label: '장당 이미지 수', icon: 'mdi:image-multiple' },
+        { value: '1200px', label: 'HD 해상도', icon: 'mdi:video-high-definition' },
+        { value: '즉시', label: '생성', icon: 'mdi:lightning-bolt' }
+    ], columns: 3 },
+
+    { type: 'title', text: '시각적 구도: 디자인 원칙', level: 3 },
+    { type: 'paragraph', html: '구도는 보는 이의 시선을 유도하고 의도를 전달하는 방식으로 시각적 요소를 구성하는 예술입니다. 좋은 콜라주는 다음의 균형을 유지합니다.' },
+    { type: 'list', items: [
+        '<strong>균형:</strong> 시각적 무게감의 분배 (밝은 이미지 vs 어두운 이미지, 큰 것 vs 작은 것).',
+        '<strong>시각적 흐름:</strong> 시선이 끊김 없이 구도 안에서 자연스럽게 이동해야 합니다.',
+        '<strong>대비:</strong> 주의를 끄는 색상, 크기, 모양의 변화.',
+        '<strong>통일성:</strong> 주제적 일관성 - 이미지들이 같은 이야기에 대해 함께 \"말해야\" 합니다.'
+    ], icon: 'mdi:check' },
+
+    { type: 'card', title: '스마트하고 유연한 디자인', html: '당사의 시스템은 사진 수에 따라 최적의 공간 배분을 자동으로 계산합니다. 사진 2장은 대칭 그리드, 5장은 균형 잡힌 비대칭 배분으로 구성됩니다. 각 그리드는 시각적 임팩트를 극대화하도록 설계되었습니다.' },
+
+    { type: 'comparative', items: [
+        {
+            title: '소셜 네트워크용',
+            description: 'Instagram, TikTok, Facebook - 정사각형 형식',
+            icon: 'mdi:share-all',
+            points: [
+                '1200px는 Instagram 피드에 완벽합니다',
+                '정사각형 형식은 게시 시 잘리는 현상을 방지합니다',
+                '브랜딩을 위한 맞춤형 테두리'
+            ],
+            highlight: true
+        },
+        {
+            title: '포트폴리오용',
+            description: '사진가 및 디자이너를 위한 시각적 쇼케이스',
+            icon: 'mdi:briefcase-outline',
+            points: [
+                '프로젝트의 다양한 각도 표시',
+                '응집력 있는 시각적 서사',
+                '전문적인 디지털 북 인쇄'
+            ]
+        },
+        {
+            title: '개인용 선물',
+            description: '인쇄물, 액자 및 디지털 앨범',
+            icon: 'mdi:gift-outline',
+            points: [
+                '이벤트 추억 (결혼식, 여행)',
+                '인쇄 가능한 고해상도',
+                '수작업 없는 즉각적인 디자인'
+            ]
+        }
+    ], columns: 3 },
+
+    { type: 'title', text: '맞춤 설정: 테두리 및 색상', level: 3 },
+    { type: 'table', headers: ['요소', '시각적 효과', '권장 사항'], rows: [
+        ['흰색 테두리', '깔끔함, 미니멀함, 모던함', '소셜 네트워크, 디지털 포트폴리오'],
+        ['검은색 테두리', '극적임, 전문적임, 예술적임', '예술 사진, 패션, 럭셔리'],
+        ['중성색 테두리 (회색)', '다재다능함, 학술적임, 기업용', '비즈니스, 교육, 중립성'],
+        ['테두리 없음', '융합, 연속성, 몰입감', '균일한 배경, 흐르는 듯한 사진']
+    ] },
+
+    { type: 'proscons', items: [
+        {
+            pro: '전문적이고 미리 정의된 디자인 - 구도 지식이 필요 없음',
+            con: '옵션이 미리 설정된 그리드에 한정됨'
+        },
+        {
+            pro: '리사이징 없이 소셜 네트워크에 바로 쓰는 1200px 해상도',
+            con: 'Photoshop만큼 자유로운 맞춤 설정은 불가함'
+        },
+        {
+            pro: '100% 로컬 처리 - 개인정보 보호, 속도, 무제한',
+            con: '최신 브라우저가 필요함'
+        },
+        {
+            pro: '완전 무료, 워터마크 없음, 광고 없음',
+            con: '개별 편집 옵션(자르기, 회전) 없음'
+        }
+    ], proTitle: '장점', conTitle: '제한 사항' },
+
+    { type: 'diagnostic', variant: 'success', title: '소셜 네트워크 준비 완료', icon: 'mdi:check-circle-outline', badge: '최적화됨', html: '1200x1200px는 Instagram에 가장 이상적인 해상도입니다. 모든 화면 비율을 지원하지만, 정사각형 출력은 피드 임팩트를 극대화하고 자동 자르기를 방지하며 데스크톱, 태블릿, 모바일 어디에서나 멋지게 보입니다.' },
+
+    { type: 'glossary', items: [
+        {
+            term: '시각적 구도',
+            definition: '보는 이의 시선을 유도하고 감정적 의도를 전달하기 위해 요소(색상, 모양, 공간)를 구성하는 예술입니다.'
+        },
+        {
+            term: '3분할 법칙',
+            definition: '구도 원칙: 이미지를 9개의 동일한 영역(3x3)으로 나눕니다. 피사체를 교차선에 배치하여 임팩트를 극대화합니다.'
+        },
+        {
+            term: '대칭 그리드',
+            definition: '동일한 공간 분할입니다. 안정적이고 질서 정연합니다. 사진 두 장 또는 짝수 장에 이상적입니다.'
+        },
+        {
+            term: '비대칭 그리드',
+            definition: '불균등한 분할입니다. 역동적이고 흥미로우며 시각적인 재미를 줍니다. 다양한 크기의 사진 5장 이상에 이상적입니다.'
+        },
+        {
+            term: '시각적 균형',
+            definition: '시각적 무게감의 지각적 평형입니다. 밝은 이미지 + 어두운 이미지 = 균형, 큰 것 + 작은 것 = 균형.'
+        }
+    ] },
+
+    { type: 'message', title: '즉각적인 시각적 서사', ariaLabel: '구도 및 콜라주에 관한 정보', html: '모든 콜라주는 이야기를 담고 있습니다. 당사의 자동 디자이너는 여러분의 시각적 서사가 균형 잡히고 전문적이며 세상에 나갈 준비가 되도록 보장합니다. 그래픽 디자이너를 기다릴 필요가 없습니다.' },
+
+    { type: 'title', text: '만들고, 공유하고, 영감을 주세요', level: 3 },
+    { type: 'paragraph', html: '잘 만들어진 콜라주는 잊혀질 게시물과 팔로워가 기억하고 공유할 게시물의 차이를 만듭니다. 여러분의 시각적 서사가 임팩트를 줄 수 있도록 스마트한 구도를 사용하세요.' }
+];
+
+const faqSchema: WithContext<FAQPage> = {
+    '@context': 'https://schema.org',
+    '@type': 'FAQPage',
+    mainEntity: faq.map((item) => ({
+        '@type': 'Question',
+        name: item.question,
+        acceptedAnswer: { '@type': 'Answer', text: item.answer },
+    })),
+};
+
+const howToSchema: WithContext<HowTo> = {
+    '@context': 'https://schema.org',
+    '@type': 'HowTo',
+    name: title,
+    description,
+    step: howTo.map((step) => ({
+        '@type': 'HowToStep',
+        name: step.name,
+        text: step.text,
+    })),
+};
+
+const appSchema: WithContext<SoftwareApplication> = {
+    '@context': 'https://schema.org',
+    '@type': 'SoftwareApplication',
+    name: title,
+    description,
+    applicationCategory: 'UtilitiesApplication',
+    operatingSystem: 'Web',
+    offers: { '@type': 'Offer', price: '0', priceCurrency: 'EUR' },
+    inLanguage: 'ko',
+};
+
+export const content: CollageMakerLocaleContent = {
+    slug,
+    title,
+    description,
+    ui,
+    seo,
+    faqTitle: "자주 묻는 질문",
+    faq,
+    bibliographyTitle: "참고 문헌",
+    bibliography,
+    howTo,
+    schemas: [faqSchema as any, howToSchema as any, appSchema],
+};