Form Make
Собирайте формы, которые хочется заполнять
О проекте и концепция
Form Make — это современный SaaS-сервис, созданный для быстрого запуска интерактивных анкет, опросов, квизов и форм сбора заявок. Продукт избавляет пользователей от сложной настройки, предлагая интуитивный визуальный редактор, гибкое брендирование и моментальную аналитику сабмитов.
Ключевые возможности
- Монорепозиторий на Bun: Next.js 16 (React 19) фронтенд и высокоскоростной Hono API бэкенд
- Дизайн-система на SCSS & Style Dictionary с 16 темными и светлыми темами
- Drag-and-Drop редактор форм с интеграцией @hello-pangea/dnd и React Aria
- Реальное время (Socket.io), экспорт аналитики в PDF/Excel, Telegram бот (grammY) и ИИ (Ollama)
Инженерные вызовы и решения
Архитектура многоэтапного тестирования и оценивание
Обычный бесконечный свиток утомляет респондента. Требовалось разбивать тесты на независимые этапы и поддерживать гибкие системы оценки баллов.
Реализована концепция «раздел-этап» с условными триггерами переходов на стыках и сквозным подсчетом баллов.
Производительность визуального Drag-and-Drop редактора
Высокочастотный ввод данных респондентами и изменения в конструкторе приводили к лагам рендеринга больших JSON-схем.
Разработан декларативный рендерер полей на Zod & React Aria, изолирующий стейт полей с помощью Redux Toolkit.
Бесшовная темизация под брендбук клиента
Необходимость предоставления 100% брендирования внешнего вида анкет без ручного написания CSS-стилей.
Интегрирована сборка дизайн-токенов на Style Dictionary, компилирующая переменные в SCSS-модули для 16 готовых тем.
Выводы и вынесенный опыт
- Создание хорошего редактора требует строгой декомпозиции состояния.
- UX формы так же важен, как и UX самого редактора.