Разработка редактора изображений на Холсте (Canvas)

Общее описание

Необходимо разработать интерактивный веб-редактор изображений на базе Vue.js и Канвас (Canvas). Пользователь должен иметь возможность добавлять на холст блоки, каждый из которых отображает отдельное изображение. Важно поддерживать загрузку файлов различных графических форматов.

Основной функционал

1. Импорт и экспорт изображений

• Экспорт: Возможность сохранения итогового изображения в форматах JPEG, PNG, WebP с настраиваемыми параметрами качества и контроль конечного размера файла.
• Импорт: Поддержка популярных расширений файлов (JPEG, PNG, WebP, GIF и др.).

2. Инструменты первичной обработки (Кроппер)

Предусмотреть модуль для обрезки, масштабирования, изменения пропорций и поворота загружаемого изображения на определенный угол непосредственно в процессе добавления.

3. Инструменты вторичной обработки

Все функции из пункта 2 (как минимум: обрезка, масштабирование, изменение размеров, поворот) должны оставаться доступными для любого изображения, уже размещенного на холсте.

4. Трансформация и цветокоррекция

• Отражение: Зеркальное отображение изображения по горизонтали и вертикали.
• Коррекция: Настройка яркости, контрастности, насыщенности, баланса белого и прочих цветовых параметров для улучшения цветопередачи конечного результата.

5. Рисование и Ретушь

Реализация набора инструментов для рисования (кисти разного типа, карандаш) и ретуши (ластик, инструмент клонирования/заплатка) для исправления дефектов (так называемый технический Skill.

6. Работа с текстом

Добавление текстовых надписей, настраиваемых шрифтов и подписей к изображению.

7. Управление цветом

Реализация работы с палитрой: стандартные и настраиваемые цвета, инструмент "пипетка" для выбора цвета с любой точки холста.

8. Масштабирование (Зум)

Реализация логики для увеличения отдельных фрагментов изображения, что необходимо для точной работы с мелкими элементами.

Технические требования

• Стек: В качестве основных технологий использовать Vue.js (фреймворк) и Канвас JS (Каnva или нативный canvas/анг)
• Интерфейс: Необходимо разработать интерфейс блоков (как на тизере)

Дополнительно

Вопросы по деталям API, архитектуре проекта и его прототипированию обсуждаются лично. Опыт с visual-редакторами будет преимуществом.