docs: audit tools

docs/tools-audit.md

@@ -0,0 +1,122 @@
+# Аудит использования - UX\UI
+
+## везде
+
+- возможность переключать пиксели\проценты
+- инструменты без параметров выглядят странно, пересмотреть, может добавить какую-то надпись "нет параметров"
+- удаление\маски и т.д. - надо добавить галочку сглаживание
+- производительность: почему flip заметно тормозит, но нет индикации работы инструмента (также sharpen-png)
+- производительность: исследовать, есть ли смысл на инструментах геометрии выводить рамку результата до полноценной работы (например на skew \ rotate будет удобнее)
+
+## аудит инструментов
+
+### transparency
+
+- add-stroke-png: добавить галочку "расширить на толщину линии"
+- find-contour-png: если толщина линии более 1px - круг боле с искажениями, надо расширять на толщину линии
+- circle-mask-png: размеры заданы в процентах, надо задавать в пикселях
+- square-mask-png: размеры заданы в процентах, надо задавать в пикселях
+- star-mask-png: размеры заданы в процентах, надо задавать в пикселях, проверить форму звезды - сейчас выпуклые края, радиус задан до 100%, а более 50 - смысле нет
+- wavy-mask-png:размеры заданы в процентах, надо задавать в пикселях, пересмотреть форму и параметры. как будто неудобно конфигурировать
+- remove-alpha-channel-png: выбор цвета фона, как будет работать с полупрозрачной картинкой?
+- extract-alpha-mask-png: галочка инвертировать маску
+- round-corners-png: размеры заданы в пикселях, должна быть возможность задать в процентах, нету сглаживания по вырезанным пикселям
+- invert-alpha-png: края со сглаживанием странно обрабатываются, может галочка\слайдер обрезать сглаживание?
+- remove-background-png: возможность выбора точки, от которой удалять (или отдельный инструмент?)
+- make-thicker-png: расширять картинку на толщину линии
+- make-thinner-png: уменьшать от краев, если картинка начинается от края, то остается выступ
+- feather-edges-png: расширять картинку на толщину линии, (выбор цвета возможен? другой инструмент?)
+- clean-edges-png: непонятный инструмент (слишком маленький максимум?). найти тест кейс для него
+- despeckle-alpha-png: найти более заметный тест-кейс
+- close-holes-png: проверить, как должен работать, картинки с большой полупрозрачной областью - закрывает всё, по описанию должен закрывать только небольшие дырки
+
+### colors
+
+- two-colors-png: в range slider добавить описание что это luminance threshold
+- gamma-png: проверить правильность работы - яркое изображение выглядит не контрастным, проверить максимум и минимум
+- temperature-png: проверить правильность работы - не слишком ли отдает желтым\синим?
+- quantize-png: максимум 64 - не слишком мало? сделать кнопки с пресетами
+- custom-palette-png: копирует two-colors-png, только ввод через текстовое поле и нет выбора порога luminance
+- dithering-png: проверить алгоритм Floyd–Steinberg на малом количестве цветов
+- sepia-png: не нужна настройка силы эффекта?
+- extract-channel-png: мульти вывод сразу в 3 канала?
+- swap-channels-png: обдумать описание подобных инструментов через flow более простых?
+- black-and-white-png: аналог two-colors-png, только без выбора цветов
+- posterize-png: не нужен вариант настройки для каждого канала отдельно?
+- auto-contrast-png: найти тестовый кейс
+- decrease-color-count-png: сделать кнопки вместо селекта
+- png-to-hsl: проверить, что `space as rgb` должна выдавать одинаковые результаты, вне зависимости от выбора h s l. может выбрать отдельные кнопки?
+- png-to-hsv: тоже самое ^
+- png-to-hsi: тоже самое ^, нужно ли разделять на отдельные инструменты?
+- png-to-cmyk: тоже самое ^
+- png-to-lab: тоже самое ^
+
+### geometry
+
+- add-border-png: прозрачность цвета (аудит полей)
+- fit-on-background-png: цвет
+- change-canvas-size-png: использовать position9 вместо селекта
+- resize-png: по умолчанию размеры 0х0, надо поменять; выбор метода масштабирования
+- crop-png: offset - слишком большие значения
+- rotate-png: кнопки вместо select
+- flip-png: кнопки вместо select
+- add-padding-png: чем отличается от add-border-png?
+- center-by-alpha-png: найти тест кейс
+- zoom-png: выбор точки центра
+- trim-empty-space-png: выбор от 0 до 254 (надо везде привести к единому стилю - переключение 0-100 проценты и 0-255)
+- change-aspect-ratio-png: не видно что меняется, добавить рамку вокруг результата, а не вокруг div
+- swap-orientation-png: кнопки вместо select
+- symmetric-copy-png: кнопки вместо select, два выбора в селекте `keep side` не работают (в зависимости от выбора `axis`)
+- shift-png: цвет (прозрачность)
+- split-into-parts-png: результат с несколькими файлами, обдумать процесс
+
+### filters
+
+- vignette-png: выбор точки центра, цвет, кроме силы нужен еще параметр прироста силы (как называется?)
+- pixelate-png: разные алгоритмы? выглядит не очень. тест кейс?
+- randomize-pixels-png: настройка размеров другим вариантом - на сколько кусков делить. seed - поменять
+- add-noise-png: кнопки вместо select, seed - поменять
+- sharpen-png: добавить тест кейс
+- silhouette-png: аналог extract-alpha-mask-png?
+
+### text
+
+- add-text-png: plate снизу большой отступ, сделать галочку для этого (некоторые буквы будут обрезаться - y, g)
+- watermark-tile-png: заполняет не полностью
+
+### analyze
+
+- extract-color-from-png: надо описать или дать выбор на основе какого параметра работает threshold
+- show-transparent-png: кнопки вместо select
+- show-grayscale-pixels-png: кнопки вместо select
+- show-color-pixels-png: кнопки вместо select
+- light-pixel-mask-png: кнопки вместо select
+- verify-is-png: название неверное, в описании указано изображение, а фактически проверяется текст
+- png-is-grayscale: результат плохо виден, нужно ли копирование на полный вердикт? может отдельные поля - 0\1, yes\no?
+
+### generators
+
+- color-spectrum-png: кнопки вместо select
+- draw-grid-png: выбор цвета фона
+- placeholder-png: с галочкой "показать текст" нет заполнения фона
+- blend-two-png: высота не задается
+- step-colors-png: кнопки вместо select, высота не задается, не слишком ли маленький max steps?
+- emoji-to-png: выбор эмодзи
+- color-wheel-png: сглаживание краев
+- complementary-png: кнопки вместо select(?), не меняется, всего 2 цвета, высота не задается
+- triadic-png: кнопки вместо select, высота не задается
+- tetradic-png: кнопки вместо select, высота не задается
+- analogous-png: кнопки вместо select, высота не задается
+- monochromatic-png: кнопки вместо select, высота не задается
+- shades-png: кнопки вместо select, высота не задается
+- mix-colors-png: высота не задается
+- sort-colors-png: кнопки вместо select, высота не задается
+
+## аудит полей
+
+- position offset: должны быть отдельные range slider на x и y
+- range slider: поле ввода, кнопки + и -, кнопка сброса на умолчание
+- range slider with presets: слайдер, как выше, добавочные кнопки с пресетами
+- color picker: пикер с картинки (как исходника, так и результата), прозрачность
+- ввод высоты и ширины с keep aspect ratio должен быть единым компонентом
+- поле seed (random) - range slider не нужен, поле для ввода и "randomize" кнопка