# Сбор и анализ HR-показателей Собери СТАТИЧНЫЙ макет всего процесса: кликабельные экраны без серверной логики, наполненные правдоподобными примерами. Без пометок «макет», «демо» и «демонстрационная версия» на экране. Это ИНТЕРФЕЙС решения, а не паспорт в виде сайта: первым открывается главный рабочий экран сотрудника (то, с чем он работает каждый день), дальше — экраны остальных шагов процесса. Таблицы, списки и графики сразу заполнены примерами (8–15 строк), пустых состояний «ничего не найдено» при открытии быть не должно. Сведения паспорта (предпосылки, эффект, риски) — одной последней вкладкой «О решении», не первой. # ТЗ НА ИНТЕРФЕЙС ## Что собираем Автоматизировать сбор, сводку и анализ HR-показателей для подготовки итогового заключения ## Кто пользуется - Аналитик: загружает данные, запускает сбор и анализ, редактирует заключение - Эксперт: проверяет итоговое заключение, утверждает результат ## Экраны (первым открывается первый) ### 1. Загрузка данных Ввод исходных данных от дочерних компаний На экране: - Форма загрузки Excel-файлов - Список дочерних компаний - Статус загрузки (успешно/ошибка) - Журнал действий ИИ Действия: - Загрузить файл - Указать источник (дочерняя компания) - Вернуть в ручной режим ### 2. Сводка показателей Визуализация сводных данных по ~30 HR-показателям На экране: - Таблица сводки: Показатель, Значение, Источник, Статус проверки - Фильтр по типу показателя (текучесть, вакансии, резерв, производительность) - Индикаторы ошибок формул - Кнопка запуска анализа Действия: - Запустить анализ - Править значение вручную - Смотреть журнал действий ### 3. Анализ и заключение Просмотр результатов анализа и редактирование текстового отчета На экране: - Дашборд с ключевыми метриками - Текстовое поле с черновиком заключения (сгенерировано ИИ) - Кнопка отправки на проверку - Статус: На проверке / Утверждено Действия: - Редактировать текст заключения - Отправить на проверку эксперту - Скачать отчет ### 4. Проверка экспертом Финальная валидация результата перед использованием На экране: - Итоговое заключение (только чтение) - Сводная таблица цифр - Кнопки: Утвердить / Отклонить с комментарием - История изменений Действия: - Утвердить заключение - Отклонить и вернуть аналитику - Добавить комментарий ## Данные - HR_Показатель: Название показателя, Значение, Тип (текучесть, вакансии, резерв, производительность), Источник (дочерняя компания), Дата актуальности - Заключение: Текст заключения, Статус (черновик, на проверке, утверждено), Автор, Дата создания, Комментарий эксперта - Журнал_Действий: Время действия, Тип действия (загрузка, анализ, правка), Инициатор (ИИ/Пользователь), Результат (успех/ошибка) ## Путь сотрудника - Аналитик загружает Excel-файлы на экране 'Загрузка данных' - ИИ выполняет сводку, Аналитик проверяет таблицу на экране 'Сводка показателей' - ИИ генерирует анализ, Аналитик редактирует текст на экране 'Анализ и заключение' - Аналитик отправляет отчет, Эксперт проверяет на экране 'Проверка экспертом' - Эксперт утверждает результат ## Что делает ИИ - Сбор и валидация данных из Excel (экран 'Загрузка данных') - Сводка данных и проверка формул (экран 'Сводка показателей') - Проведение анализа и генерация текстового заключения (экран 'Анализ и заключение') ## Что проверяет и решает человек - Аналитик: загружает исходные данные, проверяет сводку, редактирует заключение - Эксперт: проверяет итоговое заключение, принимает решение об утверждении или отклонении # КОНТЕКСТ (для понимания процесса; на экраны целиком не выносить) # ПАСПОРТ ИИ-РЕШЕНИЯ | Поле | Значение | |---|---| | Наименование | Сбор и анализ HR-показателей | | Исполнитель | владелец процесса – сборка на платформе Vibe AI | | Пользователь | Аналитик, Руководитель | | Дата внедрения | – | ## 1. Предпосылки - Необходимо собирать HR-аналитику в читабельном, доступном и точном формате - Отсутствует понимание, как и в какой программе собирать данные ## 2. Входные данные и источники - Данные в формате Excel, заполняются полностью вручную - Примерно 30 HR-показателей (текучесть, срок закрытия вакансий, доля назначений из резерва, производительность труда) ## 3. Процессы для внедрения ИИ - Сбор показателей с дочерних компаний - Сводка данных - Проведение анализа - Написание заключения ## 4. Шаги процесса - Аналитик собирает данные с дочерних компаний - Аналитик сводит данные в Excel - Аналитик проводит анализ показателей - Аналитик пишет текстовое заключение - Эксперт проверяет итоговое заключение ## 5. Результат - Таблица с цифрами, текстовый отчет с выводами и дашборд - Итоговые заключения используются руководителями для принятия решений по управлению персоналом ## 6. Ожидаемый эффект - Ускорение процесса - Повышение качества аналитики ## 7. Экономический эффект - Время на один цикл: 2 недели - Частота: раз в квартал - Оценка: около 20 часов в месяц (оценка Төре) ## 8. Контроль и риски - Ошибка ИИ при неправильном заполнении данных работниками - Ошибка ИИ при неверно выставленных формулах в Excel - Сроки и исключения по процессу определяет эксперт ## 9. Меры по снижению - Проверка результата человеком перед использованием. - Журнал действий ИИ и возможность вернуть ручной режим. ## 10. Формат реализации - Веб-интерфейс на Vibe AI: сначала статичный макет всего процесса, после согласования — рабочее решение. - Экраны макета: Загрузка данных; Сводка показателей; Анализ и заключение; Проверка экспертом. Схема процесса (mermaid): flowchart TD S0["Аналитик собирает данные с дочерних компаний · ИИ"] S1["Аналитик сводит данные в Excel · ИИ"] S0 --> S1 S2["Аналитик проводит анализ показателей · ИИ"] S1 --> S2 S3["Аналитик пишет текстовое заключение · ИИ"] S2 --> S3 S4["Эксперт проверяет итоговое заключение"] S3 --> S4 ## Объём работы Собирай ровно то, что написано в задании. Не добавляй лишние разделы, журналы и настройки. Для статичной страницы достаточно index.html. Если запрошен статичный макет, не добавляй серверную часть на этом этапе. Если задача требует общего хранения, настоящей регистрации или рабочего приложения, реализуй серверную часть и базу данных средствами Vibe AI. Создай необходимые файлы, таблицы и обработчики, даже если владелец не перечислил их отдельно. Не подменяй общее хранение localStorage или демонстрационным списком. Собственная база приложения не требует интеграции с системами КТ и отдельного утверждения дизайна в экспрессе. При доработке существующего проекта это правило заменяет прежнее ограничение одним HTML-файлом. Проверь сохранение записи, чтение из другой сессии, обработку ошибок и ограничения доступа. Личные данные доступны только уполномоченному пользователю, секреты не попадают в браузерный код. Не придумывай доступы или готовые интеграции. Если публикация серверной части недоступна, укажи конкретную причину и не объявляй функцию работающей. Закончив, опубликуй приложение и сообщи фактический адрес и результаты проверки; сохраняй прежний адрес, если платформа это позволяет. ## Имена файлов Если серверная часть не нужна, скрипт интерфейса называй script.js, стили — style.css. Не создавай в корне проекта файлы app.js, main.js, index.js, server.js, bot.js, app.py, main.py, server.py и package.json со scripts.start: платформа примет проект за серверное приложение и не опубликует статичный сайт. Эти имена — только для настоящего сервера. ## Дизайн — дизайн-система KT AI Весь интерфейс собирай на дизайн-системе KT AI, которая уже лежит в папке проекта `design-system/`. Перед первой строкой вёрстки прочитай `design.md` и `design-system/AGENTS.md` и следуй им. Подключай файлы ДС относительными путями и в этом порядке: `./design-system/kt-ai-fonts.css`, `./design-system/kt-ai-tokens.css`, `./design-system/kt-ai-components.css`, `./design-system/kt-ai-page.css`. Тема по умолчанию — светлая: ``; не ставь `dark` и не ставь `auto` (auto уходит в тёмную по системной теме). `lang` — язык интерфейса из задания: казахский — `kk`, английский — `en`, иначе `ru`. Переключатель темы можно оставить, но открываться страница должна светлой. Цвета, отступы и размеры — только токенами `var(--kt-ai-…)`, иконки — из `design-system/icons/kt-ai-lucide-sprite.svg`. Плашки показателей — `.kt-ai-kpi` (`.value`, `.label`, `.hint`) в полосе `.kt-ai-kpi-strip`; таблицы — по правилам ДС (frameless, `.kt-ai-table-wrap`, числа вправо, `tabular-nums`); графики — чистый SVG/div высотой 190–220px, столбцы 20–28px с радиусом 2px, цвета только `var(--kt-ai-chart-blue|green|orange|pink|red|salmon)`, подсказки значений — `data-kt-tip` + `./design-system/kt-ai-chart-tip.js`. Имена токенов не выдумывай — только существующие в `design-system/kt-ai-tokens.css`: --kt-ai-fg / -fg-muted / -fg-faint, --kt-ai-bg / -bg-soft, --kt-ai-card-bg / -card-border, --kt-ai-border / -border-strong, --kt-ai-primary, --kt-ai-radius-xl / -3xl, --kt-ai-font-sans / -mono, --kt-ai-chart-blue / -green / -orange / -pink / -red / -salmon, --kt-ai-status-ok-fg / -warn-fg / -risk-fg. Несуществующий токен (`--kt-ai-text-primary`, `--kt-ai-bg-surface`, `--kt-ai-font-family`) молча не применится — страница выйдет в Times New Roman без рамок. Классы ДС (`.kt-ai-kpi`, `.kt-ai-card`, `.kt-ai-table`, `.kt-ai-btn`, `.kt-ai-chip`, `.kt-ai-input`) в своём `