Основы рисования: аннотации, которые остаются читабельными

Аннотации всегда на отдельном слое

Прежде чем рисовать что-либо на фотографии или скриншоте, добавьте новый слой. Тогда ваши отметки будут располагаться над изображением, а не внутри него, и вы сможете перемещать, исчезать, скрывать или удалять их, не разрушая ничего, что находится под ним.

Это ничего не стоит и дает значительную экономию. Самое распространенное разочарование при редактировании изображений — это обнаружить двадцать штрихов спустя, что стрелка находится не в том месте, и отмена больше не тянется так далеко назад. На отдельном слое вы просто очищаете слой.

Когда вы будете удовлетворены, выполните сведение перед экспортом или просто экспортируйте напрямую — редактор автоматически объединит видимые слои.

1. Откройте свой скриншот.
2. Выберите «Добавить слой» на панели слоев.
3. Нарисуйте аннотации на новом слое.
4. Отрегулируйте непрозрачность слоя, если метки перегружают изображение.
5. Экспортировать как PNG.

Размер кисти соответствует изображению, а не экрану.

Размер кисти измеряется в пикселях изображения, а не пикселей экрана. Кисть размером 12 на фотографии шириной 4000 пикселей представляет собой линию роста волос; та же кисть на скриншоте размером 600 — это толстый маркер.

Надежной отправной точкой является примерно одна двухсотая ширины изображения: около 20 пикселей на 4000-пиксельном изображении, около 3 на 600-пиксельном. Отрегулируйте оттуда.

Если вы увеличиваете масштаб, чтобы проработать детали, помните, что размер кисти не изменился относительно изображения, а только относительно того, что вы видите. Это правильное поведение, и именно поэтому штрихи остаются постоянными при уменьшении масштаба.

Выберите цвет, который выдерживает фон

Классический сбой аннотации — это красная стрелка на темно-красном сообщении об ошибке. Прежде чем выбрать цвет, посмотрите, что находится под ним.

Чистый насыщенный красный — плохой вариант по умолчанию: его сложнее всего различить красно-зеленым зрителям с дальтонизмом, и он исчезает на теплом фоне. Ярко-голубой, пурпурный и желто-зеленый редко встречаются на фотографиях и скриншотах, поэтому они четко читаются практически на любом фоне.

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

Формы лучше, чем руки, для чего-либо точного

Нарисованный от руки прямоугольник вокруг кнопки выглядит поспешным; нарисованный прямоугольник выглядит нарочито. Используйте инструменты «Прямоугольник» и «Эллипс» для всего, на что указываете, и сохраняйте кисть для создания настоящих эскизов.

Удерживайте клавишу Shift при перетаскивании, чтобы ограничить прямоугольник квадратом или эллипс кругом. Квадрат следует за тем направлением, в котором вы перетащили дальше всего, поэтому вы можете построить его в любом направлении от начальной точки.

Контурные фигуры обычно лучше подходят для аннотаций, чем заполненные, поскольку заливка скрывает то, на что вы обращаете внимание. Включайте заливку фигур только тогда, когда вы действительно хотите что-то замаскировать.

Редактирование – это не то же самое, что сокрытие чего-либо.

Если вы скрываете конфиденциальную информацию, нарисуйте над ней прямоугольник с заливкой SOLID, а затем сведите изображение перед экспортом. Заполненная фигура на сплющенном, перекодированном изображении действительно уничтожает пиксели под ней.

Не полагайтесь на полупрозрачную фигуру, размытие или отметку на скрытом слое. Уменьшение непрозрачности позволяет математически восстановить исходные значения, а скрытый слой по-прежнему содержит данные до тех пор, пока изображение не будет сведено.

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

1. Добавьте слой и нарисуйте сплошной прямоугольник над чувствительной областью.
2. Установите непрозрачность слоя на 100% и убедитесь, что ничего не просвечивает.
3. Выберите «Сгладить» на панели слоев.
4. Экспортируйте, затем откройте экспортированный файл и убедитесь, что область действительно пуста.

Текст, который остается читаемым

Введите текст на панель инструментов, выберите размер, затем коснитесь холста там, где вы хотите его разместить. Точка касания — это вертикальный центр текста, который облегчает выравнивание по чему-либо.

Изменяйте размер текста относительно изображения по той же причине, что и кисти. На широком снимке экрана все, что ниже 2% ширины изображения, становится нечитаемым, если изображение уменьшено в окне чата или документе.

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

Урожай в последнюю очередь, экспортируйте сознательно

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

Выберите формат задания: PNG для снимков экрана и всего, что имеет текст или острые края, JPEG или WebP для фотографий. Сохранение снимка экрана как JPEG приводит к заметному размытию текста, что является наиболее распространенной потерей качества общих изображений, которой можно избежать.

Вопросы

Ограничения

• Штрихи растрируются немедленно: нет редактируемых векторных объектов, которые можно было бы впоследствии изменить.
• Текст становится пикселем после размещения и не может быть отредактирован повторно.
• Для выделенных фрагментов нет инструментов перемещения или преобразования; слой нельзя сдвинуть после рисования.
• Только системные шрифты, поскольку веб-шрифты никогда не загружаются.
• Никакого размытия, пикселизации и других эффектов фильтров, поэтому редактирование необходимо выполнять со сплошной заливкой.