Интерактивное раскрашивание
подробности
краткое описание
Интерактивное приложение для выбора и раскрашивания изображений.
промпт
Создайте простое интерактивное приложение для раскрашивания с следующими функциями: ### Обзор проекта - Приложение, позволяющее пользователям выбирать изображения и раскрашивать отдельные области. - Поддержка таких форматов изображений, как JPEG и PNG. ### Дизайн и поток UI/UX - **Первый экран**: - Отобразите заметную кнопку с надписью "Выбрать изображение с компьютера". - При нажатии открыть файловый браузер для выбора изображения. - **После выбора изображения**: - Показать предпросмотр выбранного изображения по центру экрана. - Отобразить кнопку с надписью "Начать раскрашивание" ниже изображения. - **Экран раскрашивания**: - Проанализировать изображение для обнаружения как минимум двух областей для раскрашивания, отобразив изображение на весь экран с видимыми границами. - **В левом верхнем углу**: - Кнопка "Назад": Возвращает к выбору изображения с подтверждением. - Кнопка "Сохранить": Скачивает раскрашенное изображение. - **В правом верхнем углу**: - Большой красный круг, указывающий на текущий выбранный цвет (по умолчанию ярко-синий). - При нажатии открыть полноэкранную палитру с 24 яркими цветами, расположенными по кругу; палитра закрывается после выбора цвета. ### Основной функционал и логика - Реализовать обнаружение границ для определения областей раскрашивания. - Обеспечить возможность закрашивания по нажатию в пределах границ выбранным цветом. - Поддерживать форматы изображений JPEG и PNG для надежного раскрашивания. ### Лучшие практики - При обнаружении менее двух областей показывать сообщение "Упс! На этом изображении не найдено областей для раскрашивания. Попробуйте другое изображение с более четкими контурами.". - Обеспечить интуитивно понятную навигацию с подтверждением действий, таких как возврат. - Поддерживать интерактивный и отзывчивый дизайн с плавными переходами между экранами.
оригинальный промпт
Create a simple interactive coloring application: First screen: - Display a prominent button labeled "Select Image from Computer." - Upon clicking, open file browser to let the user select an image. After selecting an image: - Show a preview of the chosen image centered on the screen. - Below the preview, display a button labeled "Start Coloring." After clicking "Start Coloring": - Attempt to parse the image to detect at least two distinct areas suitable for coloring. - If successful, display the image fullscreen vertically with detected boundaries. Top-left corner: - "Back" button: returns to image selection after confirmation. - "Save" button: downloads the colored image. Top-right corner: - Large red circle indicating the current selected color (default bright blue). - On click, open fullscreen palette with 24 vibrant colors arranged in circles. Close palette upon selection. Coloring interaction: - Detect boundaries automatically. - On tap/click within boundaries, fill the area with the selected color. Error handling: - If fewer than two colorable areas are detected, display an error message: "Oops! We couldn't find areas to color in this image. Please try another image with clearer outlines." Q: What types of images should the application support for coloring? A: JPEG, PNG, etc. Q: Do you have a specific design in mind for the layout of the color palette? A: Circular layout with vibrant colors
стоимость генерации
название модели: claude-3-7-sonnet-latest
время ответа: 67.00 sec.
токены результата: 5,770
стоимость: $0.08902500