import type { SolutionLocaleCopy } from './types';

export const UK: SolutionLocaleCopy = {
  prototype: {
    title: 'Створюйте інтерактивні прототипи з Open Design + Claude Code',
    description:
      'Перетворіть підказку на клікабельний багатоекранний прототип, не виходячи з терміналу. Open Design дає вашому агенту з кодування навички дизайну, шаблони та дизайн-систему, щоб випускати справжні прототипи, які можна відкрити в браузері.',
    breadcrumb: 'Прототип',
    label: 'Сценарій · Прототип',
    heading: 'Прототипуйте зі швидкістю підказки',
    lead: 'Опишіть потік, який маєте на думці, і дайте агенту зібрати справжній клікабельний прототип — кілька екранів, спільні стилі та живі взаємодії — відрендерений одразу в HTML, який можна відкрити, поділитися й передати інженерії.',
    heroImageAlt:
      'Редакційна ілюстрація руки, що малює каркас, який перетворюється на клікабельний багатоекранний прототип застосунку',
    tldrTitle: 'Одним рядком',
    tldrBody:
      'Open Design — це шар дизайну для агента з кодування, який ви вже використовуєте. Для прототипування це означає перехід від ідеї в один абзац до навігованого, стилізованого прототипу за один сеанс — без інструмента дизайну, без кроку експорту, без розриву передачі.',
    stepsTitle: 'Як працює прототипування з Open Design',
    steps: [
      {
        title: 'Опишіть потік',
        body: 'Розкажіть агенту простою мовою, що ви будуєте — «потік онбордингу з екраном привітання, вибором тарифу та екраном підтвердження». Open Design завантажує навичку прототипу, тож агент знає, що треба створити екрани, а не одну сторінку.',
        imageAlt:
          'Ілюстрація людини, яка вводить простою мовою опис потоку застосунку в термінал',
      },
      {
        title: 'Згенеруйте стилізовані екрани',
        body: 'Агент застосовує дизайн-систему та шаблони прототипів з Open Design, тож кожен екран має спільну типографіку, відступи й компоненти, а не виглядає чернеткою. Ви отримуєте узгоджений набір екранів, а не розрізнені макети.',
        imageAlt:
          'Ілюстрація кількох екранів застосунку, що з’являються послідовно й мають один узгоджений візуальний стиль',
      },
      {
        title: 'Підключіть взаємодії',
        body: 'Кнопки переходять, вкладки перемикаються, модальні вікна відкриваються. Прототип рендериться в самодостатній HTML, тож поводиться як справжній продукт у будь-якому браузері — для перегляду не потрібен жоден акаунт інструмента прототипування.',
        imageAlt:
          'Ілюстрація курсора, що клікає по пов’язаних екранах, зі стрілками, що показують навігацію між ними',
      },
      {
        title: 'Ітеруйте та передайте',
        body: 'Удосконалюйте, розмовляючи з агентом — «зроби вибір тарифу тристовпцевим макетом». Оскільки артефакт живе у вашому проєкті, дизайн і кінцевий код мають одне джерело істини, закриваючи звичний розрив передачі від дизайнера до інженера.',
        imageAlt:
          'Ілюстрація прототипу, який переглядають і передають інженеру, з дизайном і кодом, що зливаються в один файл',
      },
    ],
    tableTitle: 'Прототипування з Open Design проти старого способу',
    tableColCapability: 'Що вам потрібно',
    tableColWithOd: 'З Open Design',
    tableColWithout: 'Традиційні інструменти прототипування',
    tableRows: [
      {
        capability: 'Від ідеї до першого екрана',
        withOd: 'Одна підказка в агенті, який у вас уже відкритий',
        without: 'Відкрити окремий інструмент, почати файл, перетягувати блоки вручну',
      },
      {
        capability: 'Кілька пов’язаних екранів',
        withOd: 'Генеруються як набір зі спільними стилями та робочою навігацією',
        without: 'Кожен кадр малюється й пов’язується вручну',
      },
      {
        capability: 'Узгоджена візуальна система',
        withOd: 'Береться з повторно використовуваної дизайн-системи, яку застосовує агент',
        without: 'Відтворюється для кожного файлу або підтримується вручну',
      },
      {
        capability: 'Результат, яким можна поділитися',
        withOd: 'Самодостатній HTML — відкривається в будь-якому браузері, без акаунта',
        without: 'Глядачу потрібне місце або посилання для спільного доступу в інструменті постачальника',
      },
      {
        capability: 'Шлях до справжнього коду',
        withOd: 'Артефакт живе у вашому репозиторії; дизайн і код мають одне джерело',
        without: 'Перебудовується з нуля після окремої передачі',
      },
      {
        capability: 'Вартість і прив’язка',
        withOd: 'Відкритий код, власні ключі, працює локально',
        without: 'Передплата за місце, хостинг постачальника, обмежений експорт',
      },
    ],
    featuresTitle: 'Що ви можете прототипувати',
    features: [
      {
        title: 'Багатоекранні вебзастосунки',
        body: 'Повні потоки зі спільною навігацією — онбординг, панелі, налаштування — а не окремі сторінки.',
        thumb: 'example-web-prototype',
      },
      {
        title: 'Потоки мобільних застосунків',
        body: 'Мобільні подорожі екран за екраном з переходами й станами, що відчуваються нативно.',
        thumb: 'example-mobile-app',
      },
      {
        title: 'Цільові сторінки',
        body: 'Маркетингові сторінки та SaaS-лендінги, якими можна клікати й випускати.',
        thumb: 'example-saas-landing',
      },
      {
        title: 'Будь-який візуальний смак',
        body: 'Редакційний, м’який чи бруталістський — прототип несе узгоджений стиль від початку до кінця.',
        thumb: 'example-web-prototype-taste-editorial',
      },
      {
        title: 'Список очікування та ціни',
        body: 'Поверхні конверсії — списки очікування, цінові таблиці — підключені й у стилі бренду.',
        thumb: 'example-waitlist-page',
      },
      {
        title: 'Гейміфіковане та грайливе',
        body: 'Насичені взаємодією концепти, де рух і стан — частина презентації.',
        thumb: 'example-gamified-app',
      },
    ],
    galleryTitle: 'Прототипи, які люди створили з Open Design',
    galleryLead:
      'Кожен із них починався як підказка й перетворився на клікабельний артефакт. Виберіть шаблон, близький до вашої ідеї, опишіть свою варіацію, і агент її адаптує.',
    gallery: [
      { thumb: "example-dating-web", caption: "Вебзастосунок для знайомств — багатоекранний потік" },
      { thumb: "example-hr-onboarding", caption: "Потік онбордингу HR" },
      { thumb: "example-kami-landing", caption: "Цільова сторінка продукту" },
      { thumb: "example-web-prototype-taste-soft", caption: "Вебпрототип у м’якому стилі" },
    ],
    exampleHref: '/plugins/templates/',
    exampleLinkLabel: 'Переглянути шаблони прототипів',
    faqTitle: 'Поширені запитання про прототипування',
    faq: [
      {
        q: 'Чи потрібен мені інструмент дизайну на кшталт Figma для прототипування з Open Design?',
        a: 'Ні. Open Design працює всередині вашого агента з кодування й рендерить прототипи в HTML. Ви описуєте потік словами; агент створює екрани. Немає окремого полотняного інструмента, який треба вчити чи оплачувати.',
      },
      {
        q: 'Прототипи інтерактивні чи це лише статичні макети?',
        a: 'Інтерактивні. Навігація, вкладки й модальні вікна працюють, бо вивід — це справжній HTML і CSS. Ви можете клікати по ньому в будь-якому браузері точно так, як це робив би користувач.',
      },
      {
        q: 'Яких агентів я можу використовувати?',
        a: 'Open Design працює з Claude Code, Codex, Cursor Agent, Gemini CLI та десятком інших вбудованих адаптерів. Ви приносите власні ключі провайдера; нічого не хоститься за вас.',
      },
      {
        q: 'Чи може прототип стати справжнім продуктом?',
        a: 'Саме в цьому суть. Артефакт живе у вашому проєкті, тож та сама дизайн-система й компоненти переходять у продакшн-код, а не викидаються після передачі.',
      },
    ],
    ctaTitle: 'Прототипуйте свою наступну ідею вже сьогодні ввечері',
    ctaBody:
      'Поставте зірку репозиторію, установіть Open Design і перетворіть своє наступне «а що, якби» на щось клікабельне — в агенті, який ви вже використовуєте.',
  },
  dashboard: {
    title: 'Генеруйте інформаційні панелі з Open Design + Claude Code',
    description:
      'Опишіть метрики, які відстежуєте, і дайте агенту з кодування побудувати стилізовану, адаптивну панель — діаграми, KPI-картки й таблиці, відрендерені в HTML, який можна хостити будь-де. Без місця в BI-інструменті, без конструктора з перетягуванням.',
    breadcrumb: 'Панель',
    label: 'Сценарій · Панель',
    heading: 'Панелі з опису, а не з конструктора перетягування',
    lead: 'Скажіть агенту, що показати й як це має відчуватися. Open Design постачає патерни діаграм, систему макета й візуальну мову, тож ви отримуєте узгоджену, презентабельну панель — а не стіну віджетів зі стандартними стилями.',
    heroImageAlt:
      'Редакційна ілюстрація необроблених чисел ліворуч, що перетікають у чисту панель діаграм і KPI-карток праворуч',
    tldrTitle: 'Одним рядком',
    tldrBody:
      'Open Design перетворює опис ваших метрик простою мовою на стилізовану панель, яку агент рендерить у HTML — версіонується у вашому репозиторії, хоститься будь-де, без передплати BI за місце.',
    stepsTitle: 'Як працюють панелі з Open Design',
    steps: [
      {
        title: 'Опишіть метрики',
        body: 'Перелічіть те, що важливо — «щотижневі активні користувачі, дохід за тарифом, відтік і 30-денний тренд». Агент завантажує навичку панелі, тож знає, що треба розмістити KPI-картки, діаграми й таблицю, а не один блок тексту.',
        imageAlt: 'Ілюстрація людини, яка перелічує метрики, що її цікавлять',
      },
      {
        title: 'Виберіть патерни діаграм',
        body: 'Open Design постачає шаблони діаграм і макетів, тож тренди стають лінійними діаграмами, розбивки — стовпчиками, а співвідношення — правильним візуалом — узгоджена типографіка й відступи всюди, а не невідповідні стандарти.',
        imageAlt: 'Ілюстрація кількох типів діаграм, упорядкованих в узгоджену сітку',
      },
      {
        title: 'Підключіть свої дані',
        body: 'Спрямуйте панель на CSV, кінцеву точку JSON або вставте зразкові рядки. Вона рендериться в самодостатній HTML, що оновлюється разом із даними — відкрийте її в будь-якому браузері, покладіть на будь-який статичний хостинг.',
        imageAlt: 'Ілюстрація файлу даних, що підключається до панелі з оновленням у реальному часі',
      },
      {
        title: 'Удоскональте та випустіть',
        body: 'Налаштовуйте, розмовляючи з агентом — «згрупуй дохід за регіоном, перемісти рядок KPI нагору». Артефакт живе у вашому проєкті, тож панель можна переглядати й версіонувати, як будь-який код.',
        imageAlt: 'Ілюстрація панелі, яку вдосконалюють і потім розгортають',
      },
    ],
    tableTitle: 'Панелі з Open Design проти старого способу',
    tableColCapability: 'Що вам потрібно',
    tableColWithOd: 'З Open Design',
    tableColWithout: 'BI-інструменти / написано вручну',
    tableRows: [
      { capability: 'Від списку метрик до макета', withOd: 'Одна підказка; агент розміщує картки, діаграми й таблиці', without: 'Перетягувати віджети по одному або писати код діаграм з нуля' },
      { capability: 'Узгоджена візуальна система', withOd: 'Патерни діаграм і відступи з повторно використовуваної дизайн-системи', without: 'Стандартні стилі віджетів або стилізація вручну для кожної діаграми' },
      { capability: 'Підключення даних', withOd: 'CSV / JSON / вставлені рядки, відрендерені в живий HTML', without: 'Конектори постачальника або власна обв’язка даних' },
      { capability: 'Хостинг і поширення', withOd: 'Самодостатній HTML на будь-якому статичному хостингу, без акаунта', without: 'Глядачу потрібне місце в BI-постачальника' },
      { capability: 'Перегляд і версіонування', withOd: 'Живе у вашому репозиторії; порівнюється як код', without: 'Замкнено всередині постачальника, без справжнього порівняння' },
      { capability: 'Вартість і прив’язка', withOd: 'Відкритий код, власні ключі, працює локально', without: 'Передплата за місце, хостинг постачальника' },
    ],
    featuresTitle: 'Що ви можете побудувати',
    features: [
      { title: "Продуктова аналітика", body: "Активні користувачі, воронки, утримання — метрики, якими живе продуктова команда.", thumb: "example-dashboard" },
      { title: "Метрики репозиторію та розробки", body: "Зірки, PR, стан CI — інженерні панелі з ваших власних даних.", thumb: "example-github-dashboard" },
      { title: "Фінансові звіти", body: "Дохід, витрати, запас часу, викладені як звіт, яким можна поділитися.", thumb: "example-finance-report" },
      { title: "Живі операції", body: "Метрики в реальному часі, що оновлюються в міру руху базових даних.", thumb: "example-live-dashboard" },
      { title: "Соцмережі та маркетинг", body: "Ефективність каналів і відстеження кампаній в одному поданні.", thumb: "example-social-media-dashboard" },
      { title: "Галузеві звіти", body: "Структуровані звіти для будь-якої галузі — від клінічної до трейдингу.", thumb: "example-clinical-case-report" },
    ],
    galleryTitle: 'Панелі, які люди створили з Open Design',
    galleryLead:
      'Справжні панелі, відрендерені з підказки й джерела даних. Почніть з тієї, що близька до вашої, і опишіть метрики, які відстежуєте.',
    gallery: [
      { thumb: "example-data-report", caption: "Звіт даних" },
      { thumb: "example-flowai-live-dashboard-template", caption: "Панель живих операцій" },
      { thumb: "example-trading-analysis-dashboard-template", caption: "Панель аналізу трейдингу" },
      { thumb: "example-frame-data-chart-nyt", caption: "Редакційна діаграма даних" },
    ],
    exampleHref: '/plugins/templates/',
    exampleLinkLabel: 'Переглянути шаблони панелей',
    faqTitle: 'Поширені запитання про панелі',
    faq: [
      { q: 'Чи потрібен мені BI-інструмент на кшталт Tableau чи Looker?', a: 'Ні. Open Design рендерить панелі в HTML усередині вашого агента з кодування. Ви описуєте метрики й спрямовуєте його на свої дані; немає окремої BI-платформи, яку треба ліцензувати чи вчити.' },
      { q: 'Звідки беруться дані?', a: 'З CSV, кінцевої точки JSON або рядків, які ви вставляєте. Панель — це чистий HTML і JavaScript, тож ви повністю контролюєте, звідки вона читає — ніщо не проходить через хостинговий сервіс.' },
      { q: 'Чи можуть переглядати нетехнічні колеги?', a: 'Так. Вивід — це самодостатня вебсторінка. Будь-хто з посиланням чи файлом може відкрити її в браузері — без акаунта, без місця.' },
      { q: 'Яких агентів я можу використовувати?', a: 'Claude Code, Codex, Cursor Agent, Gemini CLI та десяток інших вбудованих адаптерів. Ви приносите власні ключі провайдера.' },
    ],
    ctaTitle: 'Побудуйте свою панель уже сьогодні ввечері',
    ctaBody:
      'Поставте зірку репозиторію, установіть Open Design і перетворіть свої метрики на панель, яку можна хостити будь-де — в агенті, який ви вже використовуєте.',
  },
  slides: {
    title: 'Генеруйте презентаційні колоди з Open Design + Claude Code',
    description:
      'Перетворіть план на спроєктовану, у стилі бренду колоду слайдів, не відкриваючи застосунок для презентацій. Open Design дає вашому агенту з кодування шаблони колод і візуальну систему, рендерячи слайди в HTML, який можна показувати, експортувати чи поширювати.',
    breadcrumb: 'Слайди',
    label: 'Сценарій · Слайди',
    heading: 'Колоди, що виглядають спроєктованими, написані підказкою',
    lead: 'Передайте агенту план і тон. Open Design застосовує шаблон колоди й візуальну систему, тож кожен слайд викладений, набраний і в стилі бренду — а не список пунктів на порожньому фоні.',
    heroImageAlt:
      'Редакційна ілюстрація плану ліворуч, що перетворюється на послідовність спроєктованих презентаційних слайдів праворуч',
    tldrTitle: 'Одним рядком',
    tldrBody:
      'Open Design перетворює план на спроєктовану HTML-колоду, яку агент рендерить за один сеанс — показуйте її в браузері, експортуйте в PDF чи PPTX і тримайте джерело у своєму репозиторії.',
    stepsTitle: 'Як працюють колоди з Open Design',
    steps: [
      { title: 'Дайте йому план', body: 'Вставте свої тези чи приблизну структуру. Агент завантажує навичку колоди, тож створює послідовність викладених слайдів, а не один довгий документ.', imageAlt: 'Ілюстрація текстового плану, який передають агенту' },
      { title: 'Виберіть стиль колоди', body: 'Open Design постачає шаблони колод — редакційний, швейцарсько-міжнародний, темний технічний тощо. Агент застосовує один, тож типографіка, сітка й акценти лишаються узгодженими на кожному слайді.', imageAlt: 'Ілюстрація кількох варіантів стилів колод, викладених поруч' },
      { title: 'Згенеруйте слайди', body: 'Кожна теза стає спроєктованим слайдом із правильною ієрархією — заголовки, допоміжні візуали, акценти даних. Рендериться в HTML, тож показується на весь екран у будь-якому браузері.', imageAlt: 'Ілюстрація послідовності завершених слайдів з узгодженим стилем' },
      { title: 'Показуйте, експортуйте, ітеруйте', body: 'Показуйте з браузера або експортуйте в PDF / PPTX для поширення. Удосконалюйте, розмовляючи з агентом — «стисни слайд даних, додай фінальний заклик до дії». Джерело колоди лишається у вашому проєкті.', imageAlt: 'Ілюстрація колоди, яку показують і експортують у кілька форматів' },
    ],
    tableTitle: 'Колоди з Open Design проти старого способу',
    tableColCapability: 'Що вам потрібно',
    tableColWithOd: 'З Open Design',
    tableColWithout: 'PowerPoint / Keynote / ШІ-інструменти для слайдів',
    tableRows: [
      { capability: 'Від плану до слайдів', withOd: 'Одна підказка; агент викладає кожен слайд', without: 'Будувати кожен слайд вручну або боротися з шаблоном' },
      { capability: 'Узгоджений дизайн', withOd: 'Шаблони колод зі справжньою сіткою й системою шрифтів', without: 'Дрейф теми, ручне вирівнювання, стандарти поза стилем бренду' },
      { capability: 'Дані й діаграми', withOd: 'Діаграми й акценти рендеряться як частина слайда', without: 'Вставляти статичні зображення або перебудовувати діаграми щоразу' },
      { capability: 'Формати експорту', withOd: 'HTML для показу, плюс експорт у PDF / PPTX', without: 'Замкнено у форматі одного застосунку' },
      { capability: 'Перегляд і версіонування', withOd: 'Джерело живе у вашому репозиторії, порівнюється', without: 'Бінарний файл, без змістовного порівняння' },
      { capability: 'Вартість і прив’язка', withOd: 'Відкритий код, власні ключі, працює локально', without: 'Ліцензія застосунку або ШІ-надбудова за місце' },
    ],
    featuresTitle: 'Що ви можете показати',
    features: [
      { title: "Пітч-колоди", body: "Колоди для інвесторів і продажів із сильним наративом і чистими слайдами даних.", thumb: "example-html-ppt-pitch-deck" },
      { title: "Швейцарський / редакційний", body: "Колоди на основі сітки, типографічні, що виглядають художньо керованими.", thumb: "example-deck-swiss-international" },
      { title: "Модулі курсів", body: "Навчальні колоди з чіткими кроками, акцентами й темпом.", thumb: "example-html-ppt-course-module" },
      { title: "Колоди з діаграмами даних", body: "Темні колоди з акцентом на діаграми для аналітики й оглядів.", thumb: "example-html-ppt-graphify-dark-graph" },
      { title: "Режим доповідача", body: "Колоди у стилі reveal, створені для живого показу в браузері.", thumb: "example-html-ppt-presenter-mode-reveal" },
      { title: "Технічні схеми", body: "Архітектурні й знаннєві колоди, що картографують складні системи.", thumb: "example-html-ppt-knowledge-arch-blueprint" },
    ],
    galleryTitle: 'Колоди, які люди створили з Open Design',
    galleryLead:
      'Справжні колоди, відрендерені з плану. Виберіть стиль, близький до вашого виступу, і опишіть зміст.',
    gallery: [
      { thumb: "example-deck-guizang-editorial", caption: "Редакційна журнальна колода" },
      { thumb: "example-guizang-ppt", caption: "Ілюстрований кейноут" },
      { thumb: "example-deck-open-slide-canvas", caption: "Колода open slide canvas" },
      { thumb: "example-html-ppt-obsidian-claude-gradient", caption: "Колода з градієнтною темою" },
    ],
    exampleHref: '/plugins/templates/',
    exampleLinkLabel: 'Переглянути шаблони колод',
    faqTitle: 'Поширені запитання про слайди',
    faq: [
      { q: 'Чи потрібен мені PowerPoint або Keynote?', a: 'Ні. Open Design рендерить колоди в HTML усередині вашого агента з кодування й може експортувати в PDF чи PPTX. Ви показуєте з браузера або передаєте файл — для створення не потрібен жоден застосунок для презентацій.' },
      { q: 'Це лише згенеровані ШІ пункти?', a: 'Ні. Агент застосовує справжній шаблон колоди із сіткою, шкалою шрифтів і візуальною ієрархією, тож слайди виглядають спроєктованими, а не автозаповненими.' },
      { q: 'Чи можу я експортувати в PowerPoint для клієнта?', a: 'Так. Колоди експортуються в PPTX і PDF на додачу до HTML, з якого ви показуєте, тож вони підходять під будь-які очікування аудиторії.' },
      { q: 'Яких агентів я можу використовувати?', a: 'Claude Code, Codex, Cursor Agent, Gemini CLI та інші вбудовані адаптери, з вашими власними ключами провайдера.' },
    ],
    ctaTitle: 'Побудуйте свою наступну колоду вже сьогодні ввечері',
    ctaBody:
      'Поставте зірку репозиторію, установіть Open Design і перетворіть свій план на спроєктовану колоду — в агенті, який ви вже використовуєте.',
  },
  image: {
    title: 'Генеруйте графіку в стилі бренду з Open Design + Claude Code',
    description:
      'Створюйте соціальні картки, обкладинки статей і маркетингову графіку з підказки — викладену зі справжньою типографікою й вашою системою бренду, відрендерену в чіткий HTML, який можна експортувати в PNG. Без застосунку дизайну, без передплати на шаблони.',
    breadcrumb: 'Зображення',
    label: 'Сценарій · Зображення',
    heading: 'Графіка в стилі бренду, згенерована й викладена за вас',
    lead: 'Опишіть картку чи обкладинку, яка вам потрібна. Open Design компонує її зі справжнім шрифтом, сіткою й кольорами вашого бренду — а потім рендерить у HTML, який можна експортувати як зображення, замість боротьби з застосунком дизайну чи загальним шаблоном.',
    heroImageAlt:
      'Редакційна ілюстрація підказки, що перетворюється на набір викладених соціальних карток і обкладинок статей',
    tldrTitle: 'Одним рядком',
    tldrBody:
      'Open Design перетворює підказку на набрану графіку в стилі бренду, яку агент рендерить у HTML і експортує в PNG — повторювану, версіоновану й вільну від інструментів дизайну за місце.',
    stepsTitle: 'Як працює графіка з Open Design',
    steps: [
      { title: 'Опишіть графіку', body: 'Скажіть, що це — «картка Twitter для нашого запуску із заголовком і цитатою». Агент завантажує потрібну навичку, тож компонує викладену графіку, а не простий блок тексту.', imageAlt: 'Ілюстрація людини, яка описує потрібну їй соціальну картку' },
      { title: 'Застосуйте систему бренду', body: 'Open Design бере ваші кольори, шрифт і відступи з повторно використовуваної дизайн-системи, тож кожна картка відповідає решті вашого бренду, а не виглядає одноразовою.', imageAlt: 'Ілюстрація кольорів бренду й шрифту, що застосовуються до макета картки' },
      { title: 'Відрендеріть і експортуйте', body: 'Графіка рендериться в HTML у точних розмірах, які вам потрібні — соціальна картка, обкладинка, банер — а потім експортується в PNG. Чіткий текст, справжній макет, без ручного підлаштування.', imageAlt: 'Ілюстрація графіки, що рендериться й експортується у файл зображення' },
      { title: 'Повторно використовуйте рецепт', body: 'Оскільки це шаблон, наступна графіка — за одну підказку: змініть заголовок, збережіть макет. Серії карток лишаються бездоганно узгодженими.', imageAlt: 'Ілюстрація одного шаблону картки, що створює узгоджену серію графіки' },
    ],
    tableTitle: 'Графіка з Open Design проти старого способу',
    tableColCapability: 'Що вам потрібно',
    tableColWithOd: 'З Open Design',
    tableColWithout: 'Застосунки дизайну / загальні шаблони',
    tableRows: [
      { capability: 'Від ідеї до викладеної графіки', withOd: 'Одна підказка; агент компонує шрифт і макет', without: 'Відкрити застосунок, розмістити кожен елемент вручну' },
      { capability: 'Лишатися в стилі бренду', withOd: 'Кольори й шрифт з повторно використовуваної дизайн-системи', without: 'Перевибирати стилі бренду для кожного файлу або відхилятися від нього' },
      { capability: 'Узгоджена серія', withOd: 'Той самий шаблон, новий текст — бездоганно вирівняний набір', without: 'Вирівнювати кожен варіант вручну' },
      { capability: 'Експорт', withOd: 'HTML у точних розмірах, експортований у PNG', without: 'Ручне визначення розміру полотна й налаштування експорту' },
      { capability: 'Повторюваність', withOd: 'Рецепт на основі підказок у вашому репозиторії', without: 'Одноразовий файл, який ви відтворюєте щоразу' },
      { capability: 'Вартість і прив’язка', withOd: 'Відкритий код, власні ключі, працює локально', without: 'Інструмент дизайну за місце або маркетплейс шаблонів' },
    ],
    featuresTitle: 'Що ви можете створити',
    features: [
      { title: "Соціальні картки", body: "Картки X / Twitter, скомпоновані з вашим заголовком і брендом.", thumb: "example-card-twitter" },
      { title: "Обкладинки статей", body: "Редакційні обкладинки в журнальному стилі для дописів і розсилок.", thumb: "example-article-magazine" },
      { title: "Картки Xiaohongshu", body: "Картки у стилі RedNote, налаштовані під цю стрічку.", thumb: "example-card-xiaohongshu" },
      { title: "Графіка Hero", body: "Плинні, градієнтні візуали hero для сайтів і запусків.", thumb: "example-frame-liquid-bg-hero" },
      { title: "Каруселі", body: "Багатослайдові соціальні каруселі, що лишаються узгодженими між кадрами.", thumb: "example-social-carousel" },
      { title: "Макетні UI-кадри", body: "Кадри сповіщень і пристроїв для розповіді про продукт.", thumb: "example-frame-macos-notification" },
    ],
    galleryTitle: 'Графіка, яку люди створили з Open Design',
    galleryLead:
      'Справжні картки й обкладинки, відрендерені з підказки. Виберіть ту, що близька до потрібного, і вставте свій текст.',
    gallery: [
      { thumb: "example-html-ppt-xhs-pastel-card", caption: "Пастельна соціальна картка" },
      { thumb: "example-html-ppt-zhangzara-editorial-tri-tone", caption: "Редакційний тритональний постер" },
      { thumb: "example-magazine-poster", caption: "Постер у журнальному стилі" },
      { thumb: "example-html-ppt-zhangzara-biennale-yellow", caption: "Смілива редакційна обкладинка" },
    ],
    exampleHref: '/plugins/templates/',
    exampleLinkLabel: 'Переглянути шаблони графіки',
    faqTitle: 'Поширені запитання про зображення',
    faq: [
      { q: 'Це ШІ-генератор зображень на кшталт Midjourney?', a: 'Ні. Open Design компонує графіку зі справжнім макетом і типографікою — ваш заголовок, ваш бренд, точні розміри — і рендерить у HTML, який ви експортуєте як PNG. Це компонування дизайну, а не генерація пікселів.' },
      { q: 'Чи можу я зробити узгоджену серію карток?', a: 'Так. Оскільки кожна графіка — це шаблон, ви зберігаєте макет і змінюєте текст, тож ціла серія лишається бездоганно вирівняною й у стилі бренду.' },
      { q: 'Які розміри вона може створити?', a: 'Будь-які — графіка рендериться в точних розмірах, які ви вказуєте, від квадратної соціальної картки до широкого банера, а потім експортується в PNG.' },
      { q: 'Яких агентів я можу використовувати?', a: 'Claude Code, Codex, Cursor Agent, Gemini CLI та інші вбудовані адаптери, з вашими власними ключами провайдера.' },
    ],
    ctaTitle: 'Створіть свою наступну графіку вже сьогодні ввечері',
    ctaBody:
      'Поставте зірку репозиторію, установіть Open Design і перетворіть підказку на графіку в стилі бренду — в агенті, який ви вже використовуєте.',
  },
  video: {
    title: 'Генеруйте моушн-графіку та короткі відео з Open Design + Claude Code',
    description:
      'Перетворіть сценарій на анімовані кадри й коротке відео — титульні картки, рухомі фони й заставки, скомпоновані з вашою системою бренду й відрендерені з HTML. Без пакета моушн-графіки, без перемотування таймлайну.',
    breadcrumb: 'Відео',
    label: 'Сценарій · Відео',
    heading: 'Моушн-графіка зі сценарію, а не з таймлайну',
    lead: 'Опишіть момент, який хочете — розкриття заголовка, анімацію даних, заставку логотипа. Open Design компонує анімовані кадри з вашою системою бренду й рендерить їх у відео, без потреби в пакеті моушн-графіки.',
    heroImageAlt:
      'Редакційна ілюстрація сценарію, що перетворюється на послідовність анімованих відеокадрів',
    tldrTitle: 'Одним рядком',
    tldrBody:
      'Open Design перетворює сценарій на анімовані кадри в стилі бренду, які агент рендерить у коротке відео — скомпоновані з HTML, версіоновані у вашому репозиторії, без таймлайн-редактора, який треба вчити.',
    stepsTitle: 'Як працює моушн з Open Design',
    steps: [
      { title: 'Опишіть момент', body: 'Скажіть, що має статися — «глітч-заголовок, що розчиняється в наш логотип, потім фінальна картка». Агент завантажує навичку моушну, тож створює анімовані кадри, а не статичне зображення.', imageAlt: 'Ілюстрація людини, яка описує моушн-послідовність' },
      { title: 'Застосуйте стиль бренду й моушну', body: 'Open Design постачає шаблони кадрів — кінематографічні засвітки, глітч-заголовки, заставки логотипа — і застосовує ваші кольори й шрифт, тож моушн виглядає навмисним і в стилі бренду.', imageAlt: 'Ілюстрація стилізації бренду, застосованої до анімованих кадрів' },
      { title: 'Відрендеріть кадри у відео', body: 'Кадри компонуються в HTML і рендеряться у відео, тож тайминг і макет точні й повторювані — без ручного встановлення ключових кадрів на таймлайні.', imageAlt: 'Ілюстрація HTML-кадрів, що рендеряться у відеокліп' },
      { title: 'Ітеруйте та експортуйте', body: 'Удосконалюйте, розмовляючи з агентом — «уповільни розкриття заголовка, додай підпис». Експортуйте короткі кліпи для соцмереж чи продукту. Джерело лишається у вашому проєкті.', imageAlt: 'Ілюстрація відеокліпу, який удосконалюють і експортують для соцмереж' },
    ],
    tableTitle: 'Моушн з Open Design проти старого способу',
    tableColCapability: 'Що вам потрібно',
    tableColWithOd: 'З Open Design',
    tableColWithout: 'After Effects / моушн-пакети',
    tableRows: [
      { capability: 'Від сценарію до анімованих кадрів', withOd: 'Одна підказка; агент компонує послідовність', without: 'Ставити ключові кадри для кожного елемента на таймлайні вручну' },
      { capability: 'Лишатися в стилі бренду', withOd: 'Шаблони кадрів + ваші кольори й шрифт', without: 'Перебудовувати стилізацію бренду для кожного проєкту' },
      { capability: 'Точний, повторюваний тайминг', withOd: 'Компонується в HTML, рендериться детерміновано', without: 'Ручне перемотування, важко відтворити' },
      { capability: 'Експорт для соцмереж', withOd: 'Короткі кліпи, відрендерені у відео', without: 'Пресети експорту й боротьба з кодеками' },
      { capability: 'Перегляд і версіонування', withOd: 'Джерело кадрів живе у вашому репозиторії, порівнюється', without: 'Бінарний файл проєкту, без справжнього порівняння' },
      { capability: 'Вартість і прив’язка', withOd: 'Відкритий код, власні ключі, працює локально', without: 'Дорогий пакет, крута крива навчання' },
    ],
    featuresTitle: 'Що ви можете анімувати',
    features: [
      { title: "Hyperframes", body: "Покадрові моушн-послідовності, скомпоновані з HTML.", thumb: "example-video-hyperframes" },
      { title: "Короткий формат для соцмереж", body: "Вертикальні кліпи, створені для соціальних стрічок.", thumb: "example-video-shortform" },
      { title: "Набори моушн-кадрів", body: "Повторно використовувані анімовані кадри, які ви компонуєте в кліп.", thumb: "example-motion-frames" },
      { title: "Кінематографічні засвітки", body: "Кіноподібні переходи й атмосферні фони.", thumb: "example-frame-light-leak-cinema" },
      { title: "Глітч-заголовки", body: "Розкриття заголовків із рухом і текстурою.", thumb: "example-frame-glitch-title" },
      { title: "Заставки логотипа", body: "Брендовані фінальні анімації для будь-якого кліпу.", thumb: "example-frame-logo-outro" },
    ],
    galleryTitle: 'Моушн, який люди створили з Open Design',
    galleryLead:
      'Справжні анімовані кадри й кліпи, відрендерені з підказки. Виберіть той, що близький до вашої ідеї, і опишіть моушн.',
    gallery: [
      { thumb: "example-hyperframes", caption: "Послідовність Hyperframes" },
      { thumb: "example-frame-liquid-bg-hero", caption: "Плинний моушн-фон" },
      { thumb: "example-frame-macos-notification", caption: "Анімований UI-кадр" },
      { thumb: "example-frame-data-chart-nyt", caption: "Анімована діаграма даних" },
    ],
    exampleHref: '/plugins/templates/',
    exampleLinkLabel: 'Переглянути шаблони моушну',
    faqTitle: 'Поширені запитання про відео',
    faq: [
      { q: 'Чи потрібен мені After Effects або пакет моушн-графіки?', a: 'Ні. Open Design компонує анімовані кадри в HTML і рендерить їх у відео всередині вашого агента з кодування. Немає таймлайн-редактора, який треба вчити чи ліцензувати.' },
      { q: 'Для якого відео це добре підходить?', a: 'Короткий моушн — титульні картки, анімації даних, заставки логотипа, соціальні кліпи. Створено для моушну бренду й продукту, а не для повнометражного монтажу.' },
      { q: 'Чи відтворюваний тайминг?', a: 'Так. Оскільки кадри компонуються в коді й рендеряться детерміновано, ви отримуєте той самий результат щоразу й можете точно налаштувати його підказкою.' },
      { q: 'Яких агентів я можу використовувати?', a: 'Claude Code, Codex, Cursor Agent, Gemini CLI та інші вбудовані адаптери, з вашими власними ключами провайдера.' },
    ],
    ctaTitle: 'Анімуйте свою наступну ідею вже сьогодні ввечері',
    ctaBody:
      'Поставте зірку репозиторію, установіть Open Design і перетворіть сценарій на моушн — в агенті, який ви вже використовуєте.',
  },
  designSystem: {
    title: 'Створіть і застосуйте дизайн-систему з Open Design + Claude Code',
    description:
      'Зафіксуйте свій бренд як повторно використовувану дизайн-систему, яку ваш агент з кодування застосовує до кожного артефакту — кольори, шрифт, компоненти й тон в одному DESIGN.md. Визначте раз; кожен прототип, колода й панель лишаються в стилі бренду.',
    breadcrumb: 'Дизайн-система',
    label: 'Сценарій · Дизайн-система',
    heading: 'Одна дизайн-система, застосована до всього, що робить ваш агент',
    lead: 'Визначте свій бренд раз, і Open Design перенесе його в кожен вивід — прототипи, колоди, панелі, графіку. Система живе у вашому репозиторії як DESIGN.md, який читає агент, тож узгодженість автоматична, а не ручна.',
    heroImageAlt:
      'Редакційна ілюстрація однієї дизайн-системи, що випромінюється в багато артефактів у стилі бренду',
    tldrTitle: 'Одним рядком',
    tldrBody:
      'Open Design фіксує ваш бренд як переносну дизайн-систему, яку агент застосовує до кожного артефакту — визначену раз у вашому репозиторії, застосовану всюди, без центрального інструмента дизайну, що її контролює.',
    stepsTitle: 'Як працюють дизайн-системи з Open Design',
    steps: [
      { title: 'Зафіксуйте систему', body: 'Опишіть свій бренд — кольори, шрифт, відступи, голос — або спрямуйте агента на наявний сайт, щоб витягти її. Open Design записує це в DESIGN.md, який живе у вашому проєкті.', imageAlt: 'Ілюстрація бренду, що фіксується в один файл дизайн-системи' },
      { title: 'Почніть з перевіреної основи', body: 'Open Design постачає понад 140 еталонних дизайн-систем — від Apple і Linear до редакційної й бруталістської. Відгалузіть ту, що близька до вашого бренду, замість починати з порожньої сторінки.', imageAlt: 'Ілюстрація перегляду галереї еталонних дизайн-систем' },
      { title: 'Застосовуйте всюди', body: 'Кожна інша навичка читає ту саму систему, тож прототип, колода й панель мають одну візуальну мову — без потреби заново вказувати її щоразу.', imageAlt: 'Ілюстрація однієї системи, застосованої узгоджено до багатьох типів артефактів' },
      { title: 'Розвивайте в одному місці', body: 'Змініть систему, і наступний рендер відобразить це всюди. Оскільки це файл у вашому репозиторії, рішення дизайну переглядаються й версіонуються, як код.', imageAlt: 'Ілюстрація дизайн-системи, яку оновлюють і поширюють на всі виводи' },
    ],
    tableTitle: 'Дизайн-системи з Open Design проти старого способу',
    tableColCapability: 'Що вам потрібно',
    tableColWithOd: 'З Open Design',
    tableColWithout: 'Бібліотеки інструментів дизайну / гайдлайни стилю',
    tableRows: [
      { capability: 'Визначити систему', withOd: 'DESIGN.md, який читає агент, відгалужений від понад 140 еталонів', without: 'Статичний гайдлайн стилю або бібліотека, прив’язана до інструмента' },
      { capability: 'Застосовувати між типами артефактів', withOd: 'Та сама система живить прототипи, колоди, панелі, графіку', without: 'Перевпроваджується для кожного інструмента й кожного файлу' },
      { capability: 'Тримати все узгодженим', withOd: 'Автоматично — кожна навичка читає одне джерело', without: 'Ручна дисципліна; дрейфує з часом' },
      { capability: 'Розвивати бренд', withOd: 'Відредагуйте раз; наступний рендер оновлюється всюди', without: 'Пошук-заміна між файлами й інструментами' },
      { capability: 'Перегляд і версіонування', withOd: 'Живе у вашому репозиторії, порівнюється як код', without: 'Поховано в інструменті дизайну, важко аудитувати' },
      { capability: 'Вартість і прив’язка', withOd: 'Відкритий код, переносна, працює локально', without: 'Прив’язано до передплати інструмента дизайну' },
    ],
    featuresTitle: 'Системи, з яких можна почати',
    features: [
      { title: "Apple", body: "Чиста, стримана естетика із системним шрифтом.", thumb: "design-system-apple" },
      { title: "Linear", body: "Чіткий вигляд продуктового інструмента з тісними відступами.", thumb: "design-system-linear-app" },
      { title: "Notion", body: "М’який, орієнтований на документи, доступний.", thumb: "design-system-notion" },
      { title: "Figma", body: "Грайлива, барвиста енергія творчого інструмента.", thumb: "design-system-figma" },
      { title: "OpenAI", body: "Мінімальний, нейтральний, дослідницького рівня.", thumb: "design-system-openai" },
      { title: "GitHub", body: "Щільний, технічний, рідний для розробників.", thumb: "design-system-github" },
    ],
    galleryTitle: 'Дизайн-системи в Open Design',
    galleryLead:
      'Кілька з понад 140 еталонних систем, які можна відгалузити як відправну точку. Виберіть ту, що близька до вашого бренду, і адаптуйте її.',
    gallery: [
      { thumb: "design-system-airbnb", caption: "Система у стилі Airbnb" },
      { thumb: "design-system-vercel", caption: "Система у стилі Vercel" },
      { thumb: "design-system-stripe", caption: "Система у стилі Stripe" },
      { thumb: "design-system-spotify", caption: "Система у стилі Spotify" },
    ],
    exampleHref: '/plugins/systems/',
    exampleLinkLabel: 'Переглянути дизайн-системи',
    faqTitle: 'Поширені запитання про дизайн-систему',
    faq: [
      { q: 'Що саме тут є дизайн-системою?', a: 'Файл DESIGN.md у вашому репозиторії, що фіксує кольори, шрифт, відступи, компоненти й голос. Кожна навичка Open Design читає його, тож ваш бренд автоматично застосовується до всього, що створює агент.' },
      { q: 'Чи мушу я починати з нуля?', a: 'Ні. Open Design постачає понад 140 еталонних дизайн-систем, які можна відгалузити — від Apple і Linear до редакційної й бруталістської — а потім адаптувати до вашого бренду.' },
      { q: 'Як вона лишається узгодженою між колодами, панелями й прототипами?', a: 'Тому що всі ці навички читають той самий DESIGN.md. Визначте систему раз, і узгодженість стане автоматичною, а не тим, що ви контролюєте вручну.' },
      { q: 'Яких агентів я можу використовувати?', a: 'Claude Code, Codex, Cursor Agent, Gemini CLI та інші вбудовані адаптери, з вашими власними ключами провайдера.' },
    ],
    ctaTitle: 'Визначте свою дизайн-систему вже сьогодні ввечері',
    ctaBody:
      'Поставте зірку репозиторію, установіть Open Design і дайте своєму агенту один бренд, щоб застосовувати всюди — в агенті, який ви вже використовуєте.',
  },
  roleSoloBuilder: {
    title: 'Open Design для соло-розробників та інді-хакерів',
    description:
      'Випускайте продукт, наче ціла команда, будучи самі. Open Design перетворює ваш кодувальний agent на дизайнерську половину вашого стартапу — прототипи, лендінги, дашборди й брендові візуали, усе з одного запиту, усе в межах бренду, усе у вашому репозиторії.',
    breadcrumb: 'Соло-розробник',
    label: 'Для · Соло-розробників',
    heading: 'Ваша дизайн-команда — це agent, який ви вже запускаєте',
    lead: 'Без дизайнера, без бюджету, без передавання. Опишіть, що вам потрібно, і ваш agent це відрендерить — лендінг зранку, дашборд по обіді, соціальні картки перед релізом — усе спирається на одну дизайн-систему, яку ви визначили один раз.',
    heroImageAlt:
      'Редакційна ілюстрація однієї людини за столом, оточеної лендінгом, застосунком, дашбордом і соціальними картками в одному узгодженому стилі',
    tldrTitle: 'В одному рядку',
    tldrBody:
      'Open Design — це дизайн-відділ, якого соло-засновник ніколи не мав: від запиту до артефакту на кожній поверхні, потрібній вашому продукту, в одному бренді, без передавання й без додаткових інструментів.',
    stepsTitle: 'Як соло-розробник користується Open Design',
    steps: [
      {
        title: 'Визначте бренд один раз',
        body: 'Зафіксуйте кольори, шрифт і тон у файлі DESIGN.md (або зробіть форк однієї зі 140+ референсних систем). Кожен артефакт, який ви згенеруєте далі, автоматично в межах бренду.',
        imageAlt: 'Ілюстрація єдиного файлу визначення бренду',
      },
      {
        title: 'Генеруйте те, що потрібно далі',
        body: 'Прототип, лендінг, дашборд, презентація, соціальна картка — той самий agent, той самий бренд, по одному запиту на кожне. Без перемикання інструментів і повторної купівлі місць.',
        imageAlt: 'Ілюстрація багатьох типів артефактів, що походять з одного запиту',
      },
      {
        title: 'Випускайте — воно вже справжнє',
        body: 'Усе рендериться у HTML / код у вашому репозиторії, тож прототип стає продуктом, а лендінг виходить наживо. Жодних одноразових макетів.',
        imageAlt: 'Ілюстрація артефакта, що йде прямо від запиту до релізу наживо',
      },
    ],
    tableTitle: 'Соло-розробка з Open Design проти важкого шляху',
    tableColCapability: 'Що вам потрібно',
    tableColWithOd: 'З Open Design',
    tableColWithout: 'Самотужки сьогодні',
    tableRows: [
      { capability: 'Покрити кожну дизайн-поверхню', withOd: 'Один agent робить прототип, лендінг, дашборд, бренд', without: 'Зшивати докупи п’ять SaaS-інструментів і туторіалів' },
      { capability: 'Лишатися в межах бренду', withOd: 'Один DESIGN.md застосовується всюди автоматично', without: 'Відтворювати вигляд у кожному інструменті, з часом — дрейф' },
      { capability: 'Рухатися зі швидкістю соло', withOd: 'Від ідеї до артефакту одним запитом', without: 'Вчити дизайн-інструмент, на який немає часу' },
      { capability: 'Реліз, а не макет', withOd: 'HTML / код у вашому репозиторії, готовий до деплою', without: 'Макет, який ще комусь треба зібрати' },
      { capability: 'Вартість', withOd: 'Відкритий код, власні ключі, працює локально', without: 'Стос підписок із оплатою за місце' },
    ],
    featuresTitle: 'Що може випустити соло-розробник',
    features: [
      { title: 'Лендінги', body: 'Маркетингові та SaaS-лендінги, клікабельні й наживо.', thumb: 'example-saas-landing' },
      { title: 'Прототипи продукту', body: 'Багатоекранні вебзастосунки для перевірки ідеї.', thumb: 'example-web-prototype' },
      { title: 'Дашборди', body: 'Метрики й адмін-вʼюшки для вашого продукту.', thumb: 'example-dashboard' },
      { title: 'Брендова графіка', body: 'Обкладинки й постери в межах бренду.', thumb: 'example-magazine-poster' },
      { title: 'Мобільні флоу', body: 'Екрани застосунку, коли виходите за межі вебу.', thumb: 'example-mobile-app' },
      { title: 'Соціальні картки', body: 'Картки релізів та оновлень для кожного каналу.', thumb: 'example-card-twitter' },
    ],
    galleryTitle: 'Зроблено соло з Open Design',
    galleryLead:
      'Кожна поверхня, потрібна стартапу однієї людини, з одного запиту. Оберіть близьку до вашого наступного кроку й опишіть її.',
    gallery: [
      { thumb: 'example-saas-landing', caption: 'SaaS-лендінг' },
      { thumb: 'example-web-prototype', caption: 'Прототип продукту' },
      { thumb: 'example-dashboard', caption: 'Дашборд продукту' },
      { thumb: 'example-card-twitter', caption: 'Соціальна картка релізу' },
    ],
    exampleHref: '/plugins/templates/',
    exampleLinkLabel: 'Переглянути шаблони',
    faqTitle: 'Поширені запитання соло-розробника',
    faq: [
      { q: 'Я не дизайнер — чи справді я зможу цим користуватися?', a: 'Так. Ви описуєте, що хочете, простою мовою; agent застосовує дизайн-систему й рендерить це. Уміння — у написанні запиту, а не в пересуванні пікселів.' },
      { q: 'Це покриває все чи лише одне?', a: 'Усе, що потрібно невеликому продукту — прототипи, лендінги, дашборди, презентації, графіку — від того самого agent і того самого бренду.' },
      { q: 'На що перетворюються результати?', a: 'Справжній HTML / код у вашому репозиторії, тож прототип може стати продуктом, а лендінг — вийти наживо, замість макета, який ви викидаєте.' },
      { q: 'Які agent я можу використовувати?', a: 'Claude Code, Codex, Cursor Agent, Gemini CLI та інші вбудовані адаптери, з вашими власними ключами провайдерів.' },
    ],
    ctaTitle: 'Зберіть увесь свій проєкт сьогодні ввечері',
    ctaBody:
      'Поставте зірку репозиторію, встановіть Open Design і дозвольте одному agent бути вашою дизайн-командою — у agent, який ви вже використовуєте.',
  },
  roleDesigner: {
    title: 'Open Design для дизайнерів',
    description:
      'Витрачайте час на смак, а не на рутину. Open Design дозволяє вашому agent брати на себе повторювану виробничу роботу — варіанти, стани, цілі дизайн-системи — поки ви керуєте виглядом і лишаєте за собою останнє слово.',
    breadcrumb: 'Дизайнер',
    label: 'Для · Дизайнерів',
    heading: 'Керуйте дизайном — нехай agent робить виробництво',
    lead: 'Ви задаєте систему й стандарт; agent рендерить екрани, стани, варіанти, високоточні макети. Менше пересування прямокутників, більше рішень про те, який вигляд хороший.',
    heroImageAlt:
      'Редакційна ілюстрація дизайнера, який керує, поки agent заповнює екрани, варіанти й дизайн-систему',
    tldrTitle: 'В одному рядку',
    tldrBody:
      'Open Design — це виробничий помічник, який ніколи не втомлюється: ви визначаєте дизайн-систему й задаєте смак; agent генерує решту, у межах системи, у вашому репозиторії.',
    stepsTitle: 'Як дизайнер користується Open Design',
    steps: [
      {
        title: 'Закодуйте свою систему',
        body: 'Перетворіть бренд на файл DESIGN.md — шкала шрифтів, колір, відступи, компоненти, тон. Це джерело істини, якого дотримується agent.',
        imageAlt: 'Ілюстрація дизайн-системи, зафіксованої як файл',
      },
      {
        title: 'Згенеруйте довгий хвіст',
        body: 'Кожен екран, стан і варіант, який ви інакше робили б вручну — agent рендерить їх у межах системи, тож нудні 80% готові за хвилини.',
        imageAlt: 'Ілюстрація багатьох системних екранів, згенерованих одразу',
      },
      {
        title: 'Керуйте й шліфуйте',
        body: 'Критикуйте мовою — «стисни відступи, зроби порожній стан теплішим». Останнє слово лишається за вами; ітерації робить agent.',
        imageAlt: 'Ілюстрація дизайнера, що дає напрям, і дизайну, що оновлюється',
      },
    ],
    tableTitle: 'Дизайн з Open Design проти ручного способу',
    tableColCapability: 'Що вам потрібно',
    tableColWithOd: 'З Open Design',
    tableColWithout: 'Ручні дизайн-інструменти',
    tableRows: [
      { capability: 'Побудувати дизайн-систему', withOd: 'DESIGN.md, який agent застосовує всюди', without: 'Бібліотека, яку ви ведете вручну в кожному інструменті' },
      { capability: 'Виробляти варіанти й стани', withOd: 'Генеруються в межах системи з запиту', without: 'Дублювати фрейми й правити кожен' },
      { capability: 'Високоточні макети', withOd: 'Рендеряться у справжній HTML, а не плаский макет', without: 'Піксельна робота, яку інженерія все одно переробляє' },
      { capability: 'Лишатися послідовним', withOd: 'Одна система, автоматично примусово', without: 'Ручна дисципліна; з часом дрейфує' },
      { capability: 'Передавання', withOd: 'Артефакт — це код, без розриву на переклад', without: 'Документи специфікацій і розмітка' },
    ],
    featuresTitle: 'Чим може керувати дизайнер',
    features: [
      { title: 'Редакційні версти', body: 'Композиції з арт-дирекшеном на сітці.', thumb: 'example-web-prototype-taste-editorial' },
      { title: 'Обкладинки статей', body: 'Обкладинки й матеріали в журнальному стилі.', thumb: 'example-article-magazine' },
      { title: 'Постери', body: 'Сміливі типографічні постери в межах бренду.', thumb: 'example-magazine-poster' },
      { title: 'Соціальні набори', body: 'Узгоджені багатокадрові каруселі.', thumb: 'example-social-carousel' },
      { title: 'Екрани застосунку', body: 'Високоточні мобільні та вебекрани.', thumb: 'example-mobile-app' },
      { title: 'Дашборди', body: 'Інтерфейс даних, що поважає вашу систему.', thumb: 'example-dashboard' },
    ],
    galleryTitle: 'Скеровано з Open Design',
    galleryLead:
      'Високоточна, системна робота, яку agent створив за напрямом. Оберіть близьку до вашого стилю й відшліфуйте її.',
    gallery: [
      { thumb: 'example-web-prototype-taste-editorial', caption: 'Редакційна верстка' },
      { thumb: 'example-article-magazine', caption: 'Журнальна обкладинка' },
      { thumb: 'example-social-carousel', caption: 'Соціальна карусель' },
      { thumb: 'example-magazine-poster', caption: 'Типографічний постер' },
    ],
    exampleHref: '/plugins/templates/',
    exampleLinkLabel: 'Переглянути шаблони',
    faqTitle: 'Поширені запитання дизайнера',
    faq: [
      { q: 'Чи замінить це мене?', a: 'Ні — воно замінює рутину. Ви задаєте систему й смак; agent робить повторюване виробництво, тож ви витрачаєте час на рішення, які можете ухвалити лише ви.' },
      { q: 'Як мені зберегти контроль над виглядом?', a: 'Ваш DESIGN.md — це контракт. Agent рендерить у його межах, а ви критикуєте мовою, поки не стане правильно.' },
      { q: 'Чи результат редагований / справжній?', a: 'Це справжній HTML/CSS, а не плаский експорт — тож він іде прямо у виробництво, замість того щоб його переробляли.' },
      { q: 'Які agent я можу використовувати?', a: 'Claude Code, Codex, Cursor Agent, Gemini CLI та інші вбудовані адаптери, з вашими власними ключами провайдерів.' },
    ],
    ctaTitle: 'Скеруйте свій наступний дизайн сьогодні ввечері',
    ctaBody:
      'Поставте зірку репозиторію, встановіть Open Design і дозвольте agent робити виробництво, поки ви задаєте смак — у agent, який ви вже використовуєте.',
  },
  roleEngineering: {
    title: 'Open Design для інженерів',
    description:
      'Пропустіть передавання дизайну. Open Design перетворює DESIGN.md на справжній фронтенд, який ваш кодувальний agent пише напряму — системний інтерфейс, прототипи й дашборди, у репозиторії, без поїздок туди-сюди до Figma.',
    breadcrumb: 'Інженерія',
    label: 'Для · Інженерії',
    heading: 'Від специфікації до фронтенду, без передавання посередині',
    lead: 'Наведіть свій agent на DESIGN.md та опис; він напише системний, справжній фронтенд-код — компоненти, екрани, дашборди — прямо у вашому проєкті. Без розмітки, без «чекаємо на дизайн».',
    heroImageAlt:
      'Редакційна ілюстрація DESIGN.md, що тече напряму у фронтенд-код і відрендерений інтерфейс, оминаючи крок передавання',
    tldrTitle: 'В одному рядку',
    tldrBody:
      'Open Design закриває розрив між дизайнером та інженером, роблячи дизайн-систему машиночитаною: той самий agent, що пише ваш код, застосовує систему й рендерить справжній інтерфейс.',
    stepsTitle: 'Як інженер користується Open Design',
    steps: [
      {
        title: 'Читайте систему, а не розмітку',
        body: 'DESIGN.md живе в репозиторії. Ваш agent читає його так само, як читає решту кодової бази — без експортованих специфікацій для тлумачення.',
        imageAlt: 'Ілюстрація agent, що читає DESIGN.md поряд із кодом',
      },
      {
        title: 'Генеруйте системний інтерфейс',
        body: 'Опишіть екран чи компонент; agent пише фронтенд, який уже відповідає системі. Прототипи, адмін-дашборди, внутрішні інструменти — за хвилини.',
        imageAlt: 'Ілюстрація коду інтерфейсу, згенерованого відповідно до дизайн-системи',
      },
      {
        title: 'Це вже ваш код',
        body: 'Результат — це HTML / код фреймворку у вашому репозиторії, придатний до рев’ю в PR. Жодного кроку перекладу між «дизайном» і «збіркою».',
        imageAlt: 'Ілюстрація згенерованого інтерфейсу, що приходить як придатний до рев’ю PR',
      },
    ],
    tableTitle: 'Фронтенд з Open Design проти способу з передаванням',
    tableColCapability: 'Що вам потрібно',
    tableColWithOd: 'З Open Design',
    tableColWithout: 'Передавання від дизайну до розробки',
    tableRows: [
      { capability: 'Отримати дизайн, з якого будувати', withOd: 'DESIGN.md, який ваш agent читає напряму', without: 'Файл Figma, який ви тлумачите вручну' },
      { capability: 'Відповідати системі', withOd: 'Примусово автоматично під час генерації', without: 'Звіряти на око зі специфікацією, дрейф підкрадається' },
      { capability: 'Будувати внутрішні інструменти / дашборди', withOd: 'Запит → системний фронтенд у репозиторії', without: 'Чекати на дизайнера, потім будувати двічі' },
      { capability: 'Рев’ю', withOd: 'Це код — дифте в PR', without: 'Піксельне порівняння з макетом' },
      { capability: 'Вартість і прив’язка', withOd: 'Відкритий код, у вашому репозиторії, працює локально', without: 'Дизайн-інструмент, який має ліцензувати вся команда' },
    ],
    featuresTitle: 'Що може згенерувати інженер',
    features: [
      { title: 'Інтерфейс вебзастосунку', body: 'Багатоекранні фронтенди з опису.', thumb: 'example-web-prototype' },
      { title: 'Дашборди розробки', body: 'Дашборди репозиторію, CI та метрик.', thumb: 'example-github-dashboard' },
      { title: 'Звіти за даними', body: 'Структуровані звіти з ваших даних.', thumb: 'example-data-report' },
      { title: 'Адмін-дашборди', body: 'Внутрішні інструменти й адмін-вʼюшки.', thumb: 'example-dashboard' },
      { title: 'Лендінги', body: 'Маркетингові сторінки без очікування на дизайн.', thumb: 'example-saas-landing' },
      { title: 'Kanban / дошки', body: 'Внутрішні інтерфейси робочих процесів.', thumb: 'example-kanban-board' },
    ],
    galleryTitle: 'Зроблено інженерами з Open Design',
    galleryLead:
      'Справжній, системний фронтенд, згенерований прямо в репозиторії. Оберіть близький до того, що ви будуєте, й опишіть його.',
    gallery: [
      { thumb: 'example-web-prototype', caption: 'Інтерфейс вебзастосунку' },
      { thumb: 'example-github-dashboard', caption: 'Дашборд розробки' },
      { thumb: 'example-data-report', caption: 'Звіт за даними' },
      { thumb: 'example-kanban-board', caption: 'Інтерфейс внутрішньої дошки' },
    ],
    exampleHref: '/plugins/templates/',
    exampleLinkLabel: 'Переглянути шаблони',
    faqTitle: 'Поширені запитання інженерії',
    faq: [
      { q: 'Чи все ще потрібен дизайнер?', a: 'Для бренду й напряму — так. Але щоб будувати системний інтерфейс і внутрішні інструменти, agent читає DESIGN.md і пише фронтенд — без поїздок на передавання.' },
      { q: 'Що воно видає?', a: 'Справжній HTML / код фреймворку у вашому репозиторії, придатний до рев’ю в PR — а не макет, який ви переписуєте.' },
      { q: 'Як воно лишається в межах системи?', a: 'DESIGN.md — джерело істини; agent застосовує його під час генерації, тож результат відповідає без ручної піксельної звірки.' },
      { q: 'Які agent я можу використовувати?', a: 'Claude Code, Codex, Cursor Agent, Gemini CLI та інші вбудовані адаптери, з вашими власними ключами провайдерів.' },
    ],
    ctaTitle: 'Згенеруйте свій наступний інтерфейс сьогодні ввечері',
    ctaBody:
      'Поставте зірку репозиторію, встановіть Open Design і перетворіть DESIGN.md на фронтенд — у agent, який ви вже використовуєте.',
  },
  roleProductManagers: {
    title: 'Open Design для продакт-менеджерів',
    description:
      'Перестаньте чекати на дизайнерські ресурси, щоб донести ідею. Open Design дозволяє продакт-менеджеру перетворити запит на клікабельний прототип чи вайрфрейм — щоб узгодити стейкхолдерів і дати брифінг команді, без дизайн-тікета.',
    breadcrumb: 'Продакт-менеджери',
    label: 'Для · Продакт-менеджерів',
    heading: 'Зробіть ідею клікабельною ще до кікофу',
    lead: 'Опишіть флоу, і ваш agent відрендерить справжній клікабельний прототип, який ви вже сьогодні поставите перед стейкхолдерами — щоб рев’ю обговорювали реальну річ, а не абзац у документі.',
    heroImageAlt:
      'Редакційна ілюстрація продакт-менеджера, який перетворює письмову ідею на клікабельний прототип, показаний стейкхолдерам',
    tldrTitle: 'В одному рядку',
    tldrBody:
      'Open Design дає продакт-менеджеру спосіб без дизайну зробити ідеї відчутними: від запиту до прототипу для узгодження й брифінгів, не витрачаючи дизайнерський бюджет команди.',
    stepsTitle: 'Як продакт-менеджер користується Open Design',
    steps: [
      {
        title: 'Опишіть флоу',
        body: 'Напишіть користувацький шлях простою мовою — екрани, стани, щасливий шлях. Інструмент вайрфреймів не потрібен.',
        imageAlt: 'Ілюстрація продакт-менеджера, що описує користувацький флоу',
      },
      {
        title: 'Отримайте клікабельний прототип',
        body: 'Agent рендерить навіговні екрани, якими можна реально клікати — значно зрозуміліше за слайд чи документ для рев’ю стейкхолдерів.',
        imageAlt: 'Ілюстрація клікабельного прототипу, створеного з опису',
      },
      {
        title: 'Узгодьте й передайте',
        body: 'Поділіться посиланням, зберіть відгуки на реальну річ, потім передайте прототип дизайну/інженерії як точну, спільну стартову точку.',
        imageAlt: 'Ілюстрація прототипу, що ним поділилися для узгодження, а потім передали команді',
      },
    ],
    tableTitle: 'Робота продакт-менеджера з Open Design проти очікування на дизайн',
    tableColCapability: 'Що вам потрібно',
    tableColWithOd: 'З Open Design',
    tableColWithout: 'Сьогодні без нього',
    tableRows: [
      { capability: 'Зробити ідею відчутною', withOd: 'Запит → клікабельний прототип самотужки', without: 'Завести дизайн-тікет і чекати на ресурси' },
      { capability: 'Узгодити стейкхолдерів', withOd: 'Вони клікають реальний флоу', without: 'Вони читають документ і кожен уявляє по-своєму' },
      { capability: 'Дати брифінг команді', withOd: 'Конкретний прототип як специфікація', without: 'Стіна тексту й нескінченні узгодження' },
      { capability: 'Ітерувати до збірки', withOd: 'Змініть запитом, поділіться знову', without: 'Ще один раунд у дизайн-черзі' },
      { capability: 'Вартість', withOd: 'Відкритий код, у agent, який ви вже використовуєте', without: 'Дизайнерські години на одноразові концепти' },
    ],
    featuresTitle: 'Що продакт-менеджер може поставити перед людьми',
    features: [
      { title: 'Мобільні флоу', body: 'Наскрізні шляхи застосунку, клікабельні.', thumb: 'example-mobile-app' },
      { title: 'Флоу онбордингу', body: 'Привітання → налаштування → перший запуск.', thumb: 'example-mobile-onboarding' },
      { title: 'Дошки й робочі процеси', body: 'Kanban і процесні інтерфейси для специфікацій.', thumb: 'example-kanban-board' },
      { title: 'Дашборди', body: 'Метричні вʼюшки, щоб окреслити проблему.', thumb: 'example-dashboard' },
      { title: 'Вебпрототипи', body: 'Багатоекранні вебфлоу для рев’ю.', thumb: 'example-web-prototype' },
      { title: 'Вʼюшки трендів', body: '30-денні й трендові знімки для контексту.', thumb: 'example-last30days' },
    ],
    galleryTitle: 'Прототиповано продакт-менеджерами з Open Design',
    galleryLead:
      'Клікабельні флоу, відрендерені з опису, готові до рев’ю стейкхолдерів. Оберіть близький до вашої ідеї й опишіть його.',
    gallery: [
      { thumb: 'example-mobile-app', caption: 'Мобільний флоу' },
      { thumb: 'example-mobile-onboarding', caption: 'Флоу онбордингу' },
      { thumb: 'example-kanban-board', caption: 'Дошка робочого процесу' },
      { thumb: 'example-web-prototype', caption: 'Вебпрототип' },
    ],
    exampleHref: '/plugins/templates/',
    exampleLinkLabel: 'Переглянути шаблони',
    faqTitle: 'Поширені запитання продакт-менеджера',
    faq: [
      { q: 'Я не вмію проєктувати — це для мене?', a: 'Так. Ви описуєте флоу словами; agent робить його клікабельним. Це для комунікації й узгодження, без дизайн-інструмента.' },
      { q: 'Це справжній прототип чи макет?', a: 'Справжній і клікабельний — навігація й стани працюють, тож стейкхолдери реагують на реальний досвід.' },
      { q: 'Чи замінює це дизайн?', a: 'Ні — воно дає дизайну й інженерії точну, спільну стартову точку замість текстової специфікації й береже дизайнерські ресурси для роботи, яка їх потребує.' },
      { q: 'Які agent я можу використовувати?', a: 'Claude Code, Codex, Cursor Agent, Gemini CLI та інші вбудовані адаптери, з вашими власними ключами провайдерів.' },
    ],
    ctaTitle: 'Зробіть свою ідею клікабельною сьогодні ввечері',
    ctaBody:
      'Поставте зірку репозиторію, встановіть Open Design і перетворіть свою наступну специфікацію на щось, що люди можуть клікнути — у agent, який ви вже використовуєте.',
  },
  roleMarketing: {
    title: 'Open Design для маркетингових команд',
    description:
      'Випускайте кампанії зі швидкістю контенту. Open Design дозволяє вашому agent створювати лендінги, соціальні картки й візуали кампаній з запиту — у межах бренду, на вимогу, без черги до дизайну.',
    breadcrumb: 'Маркетинг',
    label: 'Для · Маркетингу',
    heading: 'Візуали кампаній зі швидкістю запиту',
    lead: 'Лендінги, соціальні картки, обкладинки, анонсна графіка — описані мовою, відрендерені в межах бренду, випущені того ж дня. Без дизайн-тікета, без боротьби з шаблонами.',
    heroImageAlt:
      'Редакційна ілюстрація маркетолога, який перетворює бриф на лендінг і набір брендових соціальних карток',
    tldrTitle: 'В одному рядку',
    tldrBody:
      'Open Design — це завжди доступний дизайн-ресурс для маркетингу: від запиту до ассета для лендінгів і соцмереж, у межах бренду, тож кампанії виходять зі швидкістю, з якою ви пишете текст.',
    stepsTitle: 'Як маркетингова команда користується Open Design',
    steps: [
      {
        title: 'Зафіксуйте бренд',
        body: 'Ваш DESIGN.md тримає кольори, шрифт і тон. Кожен ассет, який робить agent, автоматично в межах бренду — без перестилізації кожного ассета.',
        imageAlt: 'Ілюстрація бренд-системи, застосованої до маркетингових ассетів',
      },
      {
        title: 'Згенеруйте кампанію',
        body: 'Лендінг, соціальні картки, обкладинки, анонсна графіка — по одному запиту на кожне, узгоджений набір на кожному каналі.',
        imageAlt: 'Ілюстрація повного набору кампанії, згенерованого з запитів',
      },
      {
        title: 'Випускайте й ітеруйте',
        body: 'Лендінги рендеряться у HTML, який можна задеплоїти; графіка експортується у PNG. Змініть заголовок, перерендеріть набір — без очікування в черзі.',
        imageAlt: 'Ілюстрація ассетів кампанії, що швидко виходять і ітеруються',
      },
    ],
    tableTitle: 'Маркетинг з Open Design проти звичної метушні',
    tableColCapability: 'Що вам потрібно',
    tableColWithOd: 'З Open Design',
    tableColWithout: 'Сьогодні без нього',
    tableRows: [
      { capability: 'Запустити лендінг', withOd: 'Запит → брендова сторінка, придатна до деплою', without: 'Брифувати дизайн або боротися з конструктором сайтів' },
      { capability: 'Узгоджений соціальний набір', withOd: 'Той самий шаблон, новий текст, ідеально вирівняно', without: 'Вирівнювати кожну картку вручну' },
      { capability: 'Лишатися в межах бренду', withOd: 'Один DESIGN.md застосовано до кожного ассета', without: 'Сподіватися, що кожен ассет відповідає гайдлайнам' },
      { capability: 'Рухатися зі швидкістю кампанії', withOd: 'Ассет з запиту, того ж дня', without: 'Стояти в черзі за беклогом дизайну' },
      { capability: 'Вартість', withOd: 'Відкритий код, без дизайн-інструмента з оплатою за місце', without: 'Підписки плюс дизайнерські години' },
    ],
    featuresTitle: 'Що може випустити маркетингова команда',
    features: [
      { title: 'Лендінги', body: 'Лендінги кампаній і продуктів, придатні до деплою.', thumb: 'example-saas-landing' },
      { title: 'Соціальні картки', body: 'Брендові картки X / Twitter.', thumb: 'example-card-twitter' },
      { title: 'Каруселі', body: 'Узгоджені багатослайдові соціальні набори.', thumb: 'example-social-carousel' },
      { title: 'Постери', body: 'Анонсні й подієві постери.', thumb: 'example-magazine-poster' },
      { title: 'Обкладинки статей', body: 'Обкладинки блогів і розсилок.', thumb: 'example-article-magazine' },
      { title: 'Вебсторінки', body: 'Мікросайти й сторінки кампаній.', thumb: 'example-web-prototype' },
    ],
    galleryTitle: 'Випущено маркетингом з Open Design',
    galleryLead:
      'Брендові ассети кампаній, відрендерені з запиту. Оберіть близький до вашої кампанії й підставте свій текст.',
    gallery: [
      { thumb: 'example-saas-landing', caption: 'Лендінг кампанії' },
      { thumb: 'example-card-twitter', caption: 'Соціальна картка' },
      { thumb: 'example-social-carousel', caption: 'Соціальна карусель' },
      { thumb: 'example-magazine-poster', caption: 'Анонсний постер' },
    ],
    exampleHref: '/plugins/templates/',
    exampleLinkLabel: 'Переглянути шаблони',
    faqTitle: 'Поширені запитання маркетингу',
    faq: [
      { q: 'Чи потрібен дизайнер для кожного ассета?', a: 'Ні. Agent рендерить брендові лендінги й соціальні ассети з запиту, тож команда випускає рутинну роботу кампаній без черги до дизайну.' },
      { q: 'Як ассети лишаються в межах бренду?', a: 'Ваш DESIGN.md застосовується до всього автоматично — кольори, шрифт і тон переносяться на кожен ассет.' },
      { q: 'Чи справді лендінги можуть вийти наживо?', a: 'Так — вони рендеряться у HTML, який можна задеплоїти, а графіка експортується у PNG. Це придатні до релізу ассети, а не макети.' },
      { q: 'Які agent я можу використовувати?', a: 'Claude Code, Codex, Cursor Agent, Gemini CLI та інші вбудовані адаптери, з вашими власними ключами провайдерів.' },
    ],
    ctaTitle: 'Випустіть свою наступну кампанію сьогодні ввечері',
    ctaBody:
      'Поставте зірку репозиторію, встановіть Open Design і перетворіть брифи на брендові ассети — у agent, який ви вже використовуєте.',
  },
};
