bitassistant / index.html
fadeyev's picture
Add 2 files
89741c6 verified
Raw
History Blame Contribute Delete
43.9 kB
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Bit.Assistant - Интеллектуальный помощник</title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<style>
.gradient-bg {
background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%);
}
.feature-card:hover {
transform: translateY(-5px);
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}
.model-card {
transition: all 0.3s ease;
}
.model-card:hover {
transform: scale(1.03);
}
.scrollbar-hide::-webkit-scrollbar {
display: none;
}
.scrollbar-hide {
-ms-overflow-style: none;
scrollbar-width: none;
}
</style>
</head>
<body class="font-sans bg-gray-50">
<!-- Header -->
<header class="gradient-bg text-white">
<div class="container mx-auto px-4 py-8">
<div class="flex flex-col md:flex-row justify-between items-center">
<div class="mb-6 md:mb-0">
<h1 class="text-4xl font-bold mb-2">Bit.Assistant</h1>
<p class="text-xl opacity-90">Инновационный телеграм-бот на базе передовых языковых моделей</p>
</div>
<div class="bg-white p-4 rounded-lg shadow-lg">
<img src="https://api.qrserver.com/v1/create-qr-code/?size=150x150&data=https://t.me/BitAssistantBot" alt="QR код для Bit.Assistant" class="w-32 h-32">
<p class="text-gray-800 text-center mt-2 font-medium">Отсканируйте QR-код</p>
</div>
</div>
</div>
</header>
<!-- Main CTA -->
<section class="bg-white py-12">
<div class="container mx-auto px-4 text-center">
<a href="https://t.me/BitAssistantBot" class="inline-block bg-blue-600 hover:bg-blue-700 text-white font-bold py-4 px-8 rounded-full text-xl transition duration-300 transform hover:scale-105 shadow-lg">
<i class="fab fa-telegram mr-2"></i> Начать использовать Bit.Assistant
</a>
<p class="mt-4 text-gray-600">Доступен для сотрудников «Первый бит»</p>
</div>
</section>
<!-- Auth Info -->
<section class="bg-gray-100 py-12">
<div class="container mx-auto px-4">
<div class="bg-white p-6 rounded-lg shadow-md max-w-3xl mx-auto">
<h2 class="text-2xl font-bold mb-4 text-gray-800 flex items-center">
<i class="fas fa-user-shield mr-3 text-blue-500"></i> Авторизация
</h2>
<p class="mb-4 text-gray-700">Для получения доступа к корпоративной версии Bit.Assistant необходимо пройти авторизацию. Бот будет доступен только с номера телефона, который указан при трудоустройстве.</p>
<div class="bg-blue-50 p-4 rounded-lg border border-blue-200">
<p class="text-blue-800 font-medium"><i class="fas fa-info-circle mr-2"></i> Номер телефона можно увидеть в Корпоративном портале в разделе "Моя страница".</p>
<p class="text-blue-800 mt-2 font-medium"><i class="fas fa-exchange-alt mr-2"></i> Сменить номер телефона можно через запрос в единую службу поддержки 4444@1cbit.ru.</p>
</div>
</div>
</div>
</section>
<!-- Client Version -->
<section class="py-12 bg-gradient-to-r from-blue-50 to-purple-50">
<div class="container mx-auto px-4">
<div class="bg-white p-6 rounded-lg shadow-md max-w-3xl mx-auto">
<div class="flex items-start">
<div class="bg-yellow-100 p-3 rounded-full mr-4">
<i class="fas fa-fire text-yellow-600 text-xl"></i>
</div>
<div>
<h2 class="text-2xl font-bold mb-2 text-gray-800">BitAssistant для клиентов</h2>
<p class="text-gray-700">Появилась версия BitAssistant, доступная нашим клиентам.</p>
<a href="#" class="inline-block mt-3 text-blue-600 hover:text-blue-800 font-medium">Подробнее о BitAssistant для внешних пользователей <i class="fas fa-arrow-right ml-1"></i></a>
</div>
</div>
</div>
</div>
</section>
<!-- Warning -->
<section class="py-12 bg-red-50">
<div class="container mx-auto px-4">
<div class="bg-white p-6 rounded-lg shadow-md max-w-3xl mx-auto border-l-4 border-red-500">
<h2 class="text-2xl font-bold mb-4 text-gray-800 flex items-center">
<i class="fas fa-exclamation-triangle mr-3 text-red-500"></i> Важно!
</h2>
<p class="text-gray-700 mb-4">
При использовании BitAssistant не отправляй чувствительные данные и сведения, которые являются или могут быть отнесены к конфиденциальной информации, персональным данным или составляют коммерческую тайну Компании, ее клиентов, контрагентов и партнеров.
</p>
<p class="text-gray-700">
BitAssistant не предназначен для обработки и передачи такой информации и не гарантирует защиты таких данных от несанкционированного доступа. BitAssistant может быть использован только для обработки общедоступной информации.
</p>
</div>
</div>
</section>
<!-- Features -->
<section class="py-16 bg-white">
<div class="container mx-auto px-4">
<h2 class="text-3xl font-bold text-center mb-12 text-gray-800">Применение BitAssistant для решения разного типа задач</h2>
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
<!-- Feature 1 -->
<div class="feature-card bg-white p-6 rounded-xl shadow-md border border-gray-100 transition duration-300">
<div class="bg-blue-100 p-3 rounded-full inline-block mb-4">
<i class="fas fa-users text-blue-600 text-xl"></i>
</div>
<h3 class="text-xl font-bold mb-3 text-gray-800">Работа с клиентами</h3>
<ul class="space-y-2 text-gray-600">
<li class="flex items-start"><i class="fas fa-check text-green-500 mr-2 mt-1"></i> Подготовка писем</li>
<li class="flex items-start"><i class="fas fa-check text-green-500 mr-2 mt-1"></i> Подготовка ко встречам, переговорам</li>
<li class="flex items-start"><i class="fas fa-check text-green-500 mr-2 mt-1"></i> Генерация и отработка возражений</li>
<li class="flex items-start"><i class="fas fa-check text-green-500 mr-2 mt-1"></i> Проверка договоров, улучшение формулировок</li>
<li class="flex items-start"><i class="fas fa-check text-green-500 mr-2 mt-1"></i> Анализ технических заданий</li>
</ul>
</div>
<!-- Feature 2 -->
<div class="feature-card bg-white p-6 rounded-xl shadow-md border border-gray-100 transition duration-300">
<div class="bg-purple-100 p-3 rounded-full inline-block mb-4">
<i class="fas fa-user-tie text-purple-600 text-xl"></i>
</div>
<h3 class="text-xl font-bold mb-3 text-gray-800">Работа с сотрудниками</h3>
<ul class="space-y-2 text-gray-600">
<li class="flex items-start"><i class="fas fa-check text-green-500 mr-2 mt-1"></i> Формирование вакансии</li>
<li class="flex items-start"><i class="fas fa-check text-green-500 mr-2 mt-1"></i> Разработка профиля должности</li>
<li class="flex items-start"><i class="fas fa-check text-green-500 mr-2 mt-1"></i> Разработка схемы мотивации</li>
<li class="flex items-start"><i class="fas fa-check text-green-500 mr-2 mt-1"></i> Анализ резюме</li>
<li class="flex items-start"><i class="fas fa-check text-green-500 mr-2 mt-1"></i> Подготовка плана интервью</li>
</ul>
</div>
<!-- Feature 3 -->
<div class="feature-card bg-white p-6 rounded-xl shadow-md border border-gray-100 transition duration-300">
<div class="bg-green-100 p-3 rounded-full inline-block mb-4">
<i class="fas fa-chart-line text-green-600 text-xl"></i>
</div>
<h3 class="text-xl font-bold mb-3 text-gray-800">Маркетинг</h3>
<ul class="space-y-2 text-gray-600">
<li class="flex items-start"><i class="fas fa-check text-green-500 mr-2 mt-1"></i> Подготовка контент-плана</li>
<li class="flex items-start"><i class="fas fa-check text-green-500 mr-2 mt-1"></i> Генерация контента</li>
<li class="flex items-start"><i class="fas fa-check text-green-500 mr-2 mt-1"></i> Рерайтинг статей</li>
<li class="flex items-start"><i class="fas fa-check text-green-500 mr-2 mt-1"></i> Подготовка скриптов для прозвона</li>
<li class="flex items-start"><i class="fas fa-check text-green-500 mr-2 mt-1"></i> Генерация тем вебинаров</li>
</ul>
</div>
<!-- Feature 4 -->
<div class="feature-card bg-white p-6 rounded-xl shadow-md border border-gray-100 transition duration-300">
<div class="bg-yellow-100 p-3 rounded-full inline-block mb-4">
<i class="fas fa-code text-yellow-600 text-xl"></i>
</div>
<h3 class="text-xl font-bold mb-3 text-gray-800">Разработка</h3>
<ul class="space-y-2 text-gray-600">
<li class="flex items-start"><i class="fas fa-check text-green-500 mr-2 mt-1"></i> Написание кода</li>
<li class="flex items-start"><i class="fas fa-check text-green-500 mr-2 mt-1"></i> Анализ кода</li>
<li class="flex items-start"><i class="fas fa-check text-green-500 mr-2 mt-1"></i> Исправление ошибок в коде</li>
<li class="flex items-start"><i class="fas fa-check text-green-500 mr-2 mt-1"></i> Помощь в выборе варианта реализации</li>
</ul>
</div>
<!-- Feature 5 -->
<div class="feature-card bg-white p-6 rounded-xl shadow-md border border-gray-100 transition duration-300">
<div class="bg-pink-100 p-3 rounded-full inline-block mb-4">
<i class="fas fa-lightbulb text-pink-600 text-xl"></i>
</div>
<h3 class="text-xl font-bold mb-3 text-gray-800">Креатив</h3>
<ul class="space-y-2 text-gray-600">
<li class="flex items-start"><i class="fas fa-check text-green-500 mr-2 mt-1"></i> Генерация идей</li>
<li class="flex items-start"><i class="fas fa-check text-green-500 mr-2 mt-1"></i> Поиск решений</li>
<li class="flex items-start"><i class="fas fa-check text-green-500 mr-2 mt-1"></i> Генерация контента</li>
<li class="flex items-start"><i class="fas fa-check text-green-500 mr-2 mt-1"></i> Генерация поздравлений</li>
<li class="flex items-start"><i class="fas fa-check text-green-500 mr-2 mt-1"></i> Мозговой штурм</li>
</ul>
</div>
<!-- Feature 6 -->
<div class="feature-card bg-white p-6 rounded-xl shadow-md border border-gray-100 transition duration-300">
<div class="bg-indigo-100 p-3 rounded-full inline-block mb-4">
<i class="fas fa-tools text-indigo-600 text-xl"></i>
</div>
<h3 class="text-xl font-bold mb-3 text-gray-800">Удобные инструменты</h3>
<ul class="space-y-2 text-gray-600">
<li class="flex items-start"><i class="fas fa-check text-green-500 mr-2 mt-1"></i> Распознавание голосовых сообщений</li>
<li class="flex items-start"><i class="fas fa-check text-green-500 mr-2 mt-1"></i> Расшифровка текста с картинки</li>
<li class="flex items-start"><i class="fas fa-check text-green-500 mr-2 mt-1"></i> Обработка данных в файлах</li>
<li class="flex items-start"><i class="fas fa-check text-green-500 mr-2 mt-1"></i> Синтез речи из текста</li>
<li class="flex items-start"><i class="fas fa-check text-green-500 mr-2 mt-1"></i> Генерация изображений</li>
</ul>
</div>
</div>
</div>
</section>
<!-- Modes -->
<section class="py-16 bg-gray-50">
<div class="container mx-auto px-4">
<h2 class="text-3xl font-bold text-center mb-12 text-gray-800">Режимы BitAssistant</h2>
<div class="bg-white rounded-xl shadow-md overflow-hidden max-w-4xl mx-auto">
<div class="p-6">
<p class="text-gray-700 mb-6">
BitAssistant выполняет функции, в зависимости от выбранного тобой режима и текста промта (запроса). Для генерации ответа на твой промт (запрос) BitAssistant использует передовые модели на рынке ИИ, они указаны к каждой функции ниже.
</p>
<div class="bg-blue-50 p-4 rounded-lg border border-blue-200 mb-8">
<div class="flex items-start">
<div class="bg-blue-100 p-2 rounded-full mr-3">
<i class="fas fa-info-circle text-blue-600"></i>
</div>
<div>
<h3 class="font-bold text-lg text-gray-800 mb-2">Важно</h3>
<p class="text-gray-700 mb-2">
Использование BitAssistant для сотрудников компании является бесплатным. Поскольку компания оплачивает владельцам моделей услуги генерации ответов, введен ежедневный лимит на пользование функциями.
</p>
<p class="text-gray-700">
Каждая функция может быть ограничена финансово (койн) и количественно (например, количество запросов).
</p>
</div>
</div>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6 mb-8">
<div class="bg-yellow-50 p-4 rounded-lg border border-yellow-200">
<div class="flex items-center mb-2">
<i class="fas fa-coins text-yellow-600 mr-2"></i>
<span class="font-bold text-gray-800">Твой ежедневный финансовый лимит = 0.5 койна</span>
</div>
<p class="text-gray-700 text-sm">
Койн - финансовая условная единица измерения, с помощью которой рассчитывается превышение установленного ежедневного лимита.
</p>
</div>
<div class="bg-green-50 p-4 rounded-lg border border-green-200">
<div class="flex items-center mb-2">
<i class="fas fa-lightbulb text-green-600 mr-2"></i>
<span class="font-bold text-gray-800">Твой ежедневный количественный лимит</span>
</div>
<p class="text-gray-700 text-sm">
Указан к каждой функции ниже. За использование каждой функции списывается свое значение лимита из общего ежедневного лимита. Лимит обновляется ежедневно в 00:00 UTC (Московское время +3 часа).
</p>
</div>
</div>
</div>
<div class="border-t border-gray-200">
<!-- Mode 1 -->
<div class="p-6 border-b border-gray-200">
<h3 class="text-xl font-bold mb-3 text-gray-800">Универсальный ассистент</h3>
<p class="text-gray-700 mb-4">
Готов ответить на любые вопросы и выполнить любую твою задачу. Промт (запрос) может быть в виде текста, файла, картинки, голосового сообщения.
</p>
<div class="bg-gray-100 p-3 rounded-lg">
<p class="text-gray-700 font-medium mb-1"><i class="fas fa-microchip mr-2"></i> Модель: текущая GPT (см Подробнее о моделях GPT)</p>
<p class="text-gray-700"><i class="fas fa-tachometer-alt mr-2"></i> Лимит: GPT-4o-mini, GPT-4o безлимитно, O3-mini 0.04 койна за запрос, без ограничения количества запросов.</p>
</div>
</div>
<!-- Mode 2 -->
<div class="p-6 border-b border-gray-200">
<h3 class="text-xl font-bold mb-3 text-gray-800">Код ассистент</h3>
<p class="text-gray-700 mb-4">
Режим для разработчиков. Может писать код, генерировать решения и исправлять ошибки. С его помощью можно ускорить процесс разработки и улучшить качество программного обеспечения.
</p>
<div class="bg-gray-100 p-3 rounded-lg">
<p class="text-gray-700 font-medium mb-1"><i class="fas fa-microchip mr-2"></i> Модель: текущая GPT (см Подробнее о моделях GPT)</p>
<p class="text-gray-700"><i class="fas fa-tachometer-alt mr-2"></i> Лимит: GPT-4o-mini, GPT-4o безлимитно, O3-mini 0.04 койна за запрос, без ограничения количества запросов.</p>
</div>
</div>
<!-- Mode 3 -->
<div class="p-6 border-b border-gray-200">
<h3 class="text-xl font-bold mb-3 text-gray-800">Переводчик</h3>
<p class="text-gray-700 mb-4">
Осуществляет перевод текста с любого языка на любой другой язык. По умолчанию выполнит перевод с русского на английский.
</p>
<div class="bg-gray-100 p-3 rounded-lg">
<p class="text-gray-700 font-medium mb-1"><i class="fas fa-microchip mr-2"></i> Модель: текущая GPT (см Подробнее о моделях GPT)</p>
<p class="text-gray-700"><i class="fas fa-tachometer-alt mr-2"></i> Лимит: GPT-4o-mini, GPT-4o безлимитно, O3-mini 0.04 койна за запрос, без ограничения количества запросов.</p>
</div>
</div>
<!-- Mode 4 -->
<div class="p-6 border-b border-gray-200">
<h3 class="text-xl font-bold mb-3 text-gray-800">Синтез речи</h3>
<p class="text-gray-700 mb-4">
Преобразует текст в речь, позволяя сотрудникам слушать синтезированные учебные материалы, тренинги и инструкции в голосовом формате, параллельно выполняя основную работу.
</p>
<div class="bg-gray-100 p-3 rounded-lg">
<p class="text-gray-700 font-medium mb-1"><i class="fas fa-microchip mr-2"></i> Модель: TTS-1</p>
<p class="text-gray-700"><i class="fas fa-tachometer-alt mr-2"></i> Лимит: 0.000015 койна за символ, без ограничения по количеству запросов.</p>
</div>
</div>
<!-- Mode 5 -->
<div class="p-6 border-b border-gray-200">
<h3 class="text-xl font-bold mb-3 text-gray-800">Генерация изображений</h3>
<p class="text-gray-700 mb-4">
Создает картинки. Помогает разрабатывать обложки для презентаций, поздравительные открытки, посты для социальных сетей и логотипы.
</p>
<div class="bg-gray-100 p-3 rounded-lg">
<p class="text-gray-700 font-medium mb-1"><i class="fas fa-microchip mr-2"></i> Модель: DALL-E 3</p>
<p class="text-gray-700"><i class="fas fa-tachometer-alt mr-2"></i> Лимит: 0.01 койна за запрос (одну картинку), без ограничения по количеству запросов.</p>
</div>
</div>
<!-- Other modes -->
<div class="p-6">
<h3 class="text-xl font-bold mb-3 text-gray-800">Другие функции</h3>
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
<div class="bg-gray-50 p-4 rounded-lg">
<h4 class="font-bold text-gray-800 mb-1">Новый диалог</h4>
<p class="text-gray-700 text-sm mb-1">Начинает диалог с чистого листа, сбрасывает текущий контекст.</p>
<p class="text-green-600 text-xs font-medium"><i class="fas fa-infinity mr-1"></i> Лимит: безлимитно</p>
</div>
<div class="bg-gray-50 p-4 rounded-lg">
<h4 class="font-bold text-gray-800 mb-1">Использовать поиск в интернете</h4>
<p class="text-gray-700 text-sm mb-1">Позволяет получать ответы с использованием внешних источников.</p>
<p class="text-gray-700 text-xs font-medium"><i class="fas fa-coins mr-1"></i> Лимит: 0.01 койна за запрос, ≤20 запросов/день</p>
</div>
<div class="bg-gray-50 p-4 rounded-lg">
<h4 class="font-bold text-gray-800 mb-1">История диалогов</h4>
<p class="text-gray-700 text-sm mb-1">Хранение диалогов с возможностью переключаться между ними.</p>
<p class="text-green-600 text-xs font-medium"><i class="fas fa-infinity mr-1"></i> Лимит: безлимитно</p>
</div>
<div class="bg-gray-50 p-4 rounded-lg">
<h4 class="font-bold text-gray-800 mb-1">Использование БЗ (базы знаний)</h4>
<p class="text-gray-700 text-sm mb-1">В бота загружен глоссарий из базы знаний компании.</p>
<p class="text-gray-700 text-xs font-medium"><i class="fas fa-coins mr-1"></i> Лимит: 0.04 койна за запрос, безлимитно</p>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- GPT Models -->
<section class="py-16 bg-white">
<div class="container mx-auto px-4">
<h2 class="text-3xl font-bold text-center mb-12 text-gray-800">Подробнее о моделях GPT и их использовании</h2>
<div class="max-w-4xl mx-auto mb-8">
<p class="text-gray-700 mb-6">
Основные модели, используемые при генерации ответов на запросы - это модели семейства GPT. По умолчанию настроена работа с моделью GPT-4o-mini. Ты можешь сменить модель, в зависимости от решаемой задачи.
</p>
<div class="bg-blue-50 p-4 rounded-lg border border-blue-200">
<h3 class="font-bold text-lg text-gray-800 mb-2 flex items-center">
<i class="fas fa-question-circle mr-2 text-blue-600"></i> На что влияет смена модели?
</h3>
<ul class="list-disc list-inside text-gray-700 space-y-1">
<li>Точность получения ответов</li>
<li>Скорость получения ответа</li>
<li>Качество получения ответа</li>
<li>Трата ежедневного лимита</li>
</ul>
<p class="text-gray-700 text-sm mt-2 italic">
Примечание: меню становится доступным после выбора одного из режимов бота: Универсальный ассистент, Код ассистент, Переводчик. Функции доступны только для этих режимов.
</p>
</div>
</div>
<div class="grid grid-cols-1 md:grid-cols-3 gap-6">
<!-- Model 1 -->
<div class="model-card bg-white p-6 rounded-xl shadow-md border border-gray-200 hover:border-blue-300">
<h3 class="text-xl font-bold mb-3 text-gray-800">GPT-4o-mini</h3>
<p class="text-gray-700 mb-4">
Это самая экономически эффективная небольшая модель.
</p>
<div class="space-y-2">
<div class="flex items-center">
<span class="w-32 text-gray-600">Объем знаний:</span>
<div class="flex">
<div class="w-4 h-4 rounded-full bg-green-500 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-green-500 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-gray-300 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-gray-300 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-gray-300"></div>
</div>
</div>
<div class="flex items-center">
<span class="w-32 text-gray-600">Скорость:</span>
<div class="flex">
<div class="w-4 h-4 rounded-full bg-green-500 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-green-500 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-green-500 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-green-500 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-green-500"></div>
</div>
</div>
<div class="flex items-center">
<span class="w-32 text-gray-600">Интеллект:</span>
<div class="flex">
<div class="w-4 h-4 rounded-full bg-green-500 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-gray-300 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-gray-300 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-gray-300 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-gray-300"></div>
</div>
</div>
</div>
</div>
<!-- Model 2 -->
<div class="model-card bg-white p-6 rounded-xl shadow-md border border-gray-200 hover:border-purple-300">
<h3 class="text-xl font-bold mb-3 text-gray-800">GPT-4o</h3>
<p class="text-gray-700 mb-4">
Это самая передовая модель OpenAI, разработана для оптимальной производительности и точности.
</p>
<div class="space-y-2">
<div class="flex items-center">
<span class="w-32 text-gray-600">Объем знаний:</span>
<div class="flex">
<div class="w-4 h-4 rounded-full bg-green-500 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-green-500 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-green-500 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-green-500 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-gray-300"></div>
</div>
</div>
<div class="flex items-center">
<span class="w-32 text-gray-600">Скорость:</span>
<div class="flex">
<div class="w-4 h-4 rounded-full bg-green-500 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-green-500 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-green-500 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-green-500 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-gray-300"></div>
</div>
</div>
<div class="flex items-center">
<span class="w-32 text-gray-600">Интеллект:</span>
<div class="flex">
<div class="w-4 h-4 rounded-full bg-green-500 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-green-500 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-gray-300 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-gray-300 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-gray-300"></div>
</div>
</div>
</div>
</div>
<!-- Model 3 -->
<div class="model-card bg-white p-6 rounded-xl shadow-md border border-gray-200 hover:border-indigo-300">
<h3 class="text-xl font-bold mb-3 text-gray-800">О3-mini</h3>
<p class="text-gray-700 mb-4">
Модель, обеспечивающая улучшенные возможности рассуждения.
</p>
<div class="space-y-2">
<div class="flex items-center">
<span class="w-32 text-gray-600">Объем знаний:</span>
<div class="flex">
<div class="w-4 h-4 rounded-full bg-green-500 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-green-500 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-green-500 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-gray-300 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-gray-300"></div>
</div>
</div>
<div class="flex items-center">
<span class="w-32 text-gray-600">Скорость:</span>
<div class="flex">
<div class="w-4 h-4 rounded-full bg-green-500 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-green-500 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-gray-300 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-gray-300 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-gray-300"></div>
</div>
</div>
<div class="flex items-center">
<span class="w-32 text-gray-600">Интеллект:</span>
<div class="flex">
<div class="w-4 h-4 rounded-full bg-green-500 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-green-500 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-green-500 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-green-500 mr-1"></div>
<div class="w-4 h-4 rounded-full bg-gray-300"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- File Export -->
<section class="py-16 bg-gray-50">
<div class="container mx-auto px-4">
<div class="max-w-4xl mx-auto bg-white p-8 rounded-xl shadow-md">
<h2 class="text-2xl font-bold mb-4 text-gray-800">Выдача результата в виде файла</h2>
<p class="text-gray-700 mb-6">
BitAssistant умеет выдавать результат в виде файла. Для этого укажи в промте (запросе) о необходимости представления результата в виде файла и какого формата:
</p>
<div class="bg-gray-100 p-4 rounded-lg mb-6">
<p class="text-gray-800 font-medium mb-2">Примеры запросов:</p>
<p class="text-gray-700 italic mb-1">"Результат представь в виде файла [формат]"</p>
<p class="text-gray-700 italic">"Результат представь в виде файла [формат] с таблицей, в которой первый столбец [содержимое], второй столбец [содержимое]"</p>
</div>
<p class="text-gray-700 mb-4">Возможна выгрузка в форматы:</p>
<div class="grid grid-cols-2 md:grid-cols-4 gap-3">
<span class="bg-blue-100 text-blue-800 px-3 py-1 rounded-full text-sm font-medium">TXT</span>
<span class="bg-blue-100 text-blue-800 px-3 py-1 rounded-full text-sm font-medium">DOCX</span>
<span class="bg-blue-100 text-blue-800 px-3 py-1 rounded-full text-sm font-medium">CSV</span>
<span class="bg-blue-100 text-blue-800 px-3 py-1 rounded-full text-sm font-medium">XLSX</span>
<span class="bg-blue-100 text-blue-800 px-3 py-1 rounded-full text-sm font-medium">PPTX</span>
<span class="bg-blue-100 text-blue-800 px-3 py-1 rounded-full text-sm font-medium">PNG</span>
<span class="bg-blue-100 text-blue-800 px-3 py-1 rounded-full text-sm font-medium">JPEG</span>
</div>
</div>
</div>
</section>
<!-- Footer -->
<footer class="bg-gray-900 text-white py-12">
<div class="container mx-auto px-4">
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
<div>
<h3 class="text-xl font-bold mb-4">Поддержка</h3>
<p class="text-gray-400 mb-4">
Если у тебя есть вопросы или пожелания к работе BitAssistant, то будем рады получить их через форму обратной связи.
</p>
<a href="#" class="text-blue-400 hover:text-blue-300 font-medium">
Жми на ссылку и отправляй <i class="fas fa-arrow-right ml-1"></i>
</a>
</div>
<div>
<h3 class="text-xl font-bold mb-4">Автор</h3>
<p class="text-gray-400">
Продукт разработан командой Лаборатории ИИ.
</p>
</div>
<div>
<h3 class="text-xl font-bold mb-4">Полезные материалы</h3>
<ul class="space-y-2 text-gray-400">
<li><a href="#" class="hover:text-white"><i class="far fa-file-powerpoint mr-2"></i> Презентация: Бит.Ассситент_v2.pptx</a></li>
<li><a href="#" class="hover:text-white"><i class="fas fa-video mr-2"></i> Обучающее видео для сотрудников: BitAssistant_для_сотрудников.mp4</a></li>
</ul>
</div>
</div>
<div class="border-t border-gray-800 mt-8 pt-8 text-center text-gray-500">
<p>© 2023 Bit.Assistant. Все права защищены.</p>
</div>
</div>
</footer>
<script>
// Simple animation for feature cards on scroll
document.addEventListener('DOMContentLoaded', function() {
const featureCards = document.querySelectorAll('.feature-card');
const observer = new IntersectionObserver((entries) => {
entries.forEach(entry => {
if (entry.isIntersecting) {
entry.target.style.opacity = '1';
entry.target.style.transform = 'translateY(0)';
}
});
}, { threshold: 0.1 });
featureCards.forEach(card => {
card.style.opacity = '0';
card.style.transform = 'translateY(20px)';
card.style.transition = 'opacity 0.5s ease, transform 0.5s ease';
observer.observe(card);
});
});
</script>
<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=fadeyev/bitassistant" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
</html>