Генератор интерактивного графического редактора
Описание промпта
Создай полноценное веб-приложение для рисования, используя HTML5 Canvas, CSS3 и JavaScript. Приложение должно иметь чистый и интуитивно понятный интерфейс с панелью инструментов. Реализуй набор инструментов: кисть, карандаш, фигуры, текст и ластик. Добавь управление цветом: выбор последних цветов,…
- Генерирует код для создания полнофункционального графического редактора в браузере с поддержкой слоев, инструментов рисования и навигации.
- Позволяет быстро прототипировать или создать базовую версию онлайн-редактора без использования тяжелых библиотек.
- Фронтенд-разработчики, студенты, изучающие Canvas API, создатели прототипов.
Скопируй prompt_text в чат с AI. Уточни детали реализации (например, конкретные библиотеки или стиль CSS), если нужно. Проверь код на совместимость с целевым браузером.
Знание JavaScript, HTML5 Canvas API и CSS3. Понимание работы с DOM и событиями мыши/касания.
Полный исходный код (HTML, CSS, JS) для запуска локального графического редактора.
Приложение работает в браузере. Для сохранения файлов может потребоваться локальный сервер или корректная обработка Blob URL.
Может не включать продвинутые функции вроде работы с векторной графикой (SVG paths) на уровне объектов или сложной обработки изображений без дополнительных библиотек.
Промпт открыт для всех. Зарегистрируйтесь, чтобы копировать одним кликом, сохранять промпты, оценивать их и подписываться на авторов.
Текст промпта
ChatGPT / Claude / Llama
Войти для копирования
Выступи в роли опытного фронтенд-разработчика и создай интерактивное веб-приложение для рисования. Используй стек HTML5 Canvas, CSS3 и JavaScript.
Твоя задача — реализовать следующее:
1. Интерфейс: Чистый дизайн с интуитивной панелью инструментов.
2. Инструменты: Реализуй кисть, карандаш, фигуры, текст и ластик.
3. Цвет: Добавь выбор последних цветов, пипетку и палитры.
4. Слои: Поддержи работу со слоями, включая настройку непрозрачности и режимов наложения.
5. История: Реализуй функционал отмены (undo) и повтора (redo) действий.
6. Импорт/Экспорт: Добавь возможность загрузки изображений и сохранения в форматах PNG, JPG, SVG.
7. Навигация: Реализуй изменение размера холста, поворот, зум и панорамирование.
8. Выделение: Добавь инструменты выделения с возможностью перемещения, изменения размера и трансформации.
9. Горячие клавиши: Настрой шорткаты для основных действий.
Напиши полный код приложения, обеспечивая его работоспособность и удобство использования.
Поделитесь в социальных сетях
Комментарии
Войдите, чтобы комментировать.
Комментариев пока нет.