Что такое растровая и векторная графика?
Каждый уважающий себя веб-дизайнер должен обязательно разбираться в этих терминах. Изображения в растровой графике состоит из пикселей — неделимых единиц, которые создают своеобразную мозаику. Пиксели очень маленькие, поэтому глаз воспринимает мозаику как единое изображение.
Векторная графика распространена в полиграфическом дизайне и создании макетов сайтов. Этот тип графики не может передать тона и полутона, однако, является более предпочтительным, если речь идет о создании текстов, простых форм, контурных фигур.
Чтобы понять, к какому типу графики относится то или иное изображение, обратите внимание на его расширение:
- растровая графика — JPEG, BMP, PICT, GIF, TIFF, PSD, JPG, PNG, PCX;
- векторная графика — EPS, CMX, CDR, SVG.
Выбор графического редактора
Растровые редакторы (Adobe Photoshop, Corel-Paint, Irfan View, GIMP, Krita и др.) представляют графику в пикселах, количество которых по ширине и высоте задается при создании изображения. Увеличение размеров уже созданных растровых изображений нежелательно — это может привести к искажениям и неровностям графики;
Векторные редакторы (Xara, Corel DRAW, Adobe Illustrator, Sketch и др.) предусматривают создание линий и фигур по определенным математическим алгоритмам, благодаря чему векторные изображения можно сколько угодно масштабировать без потери качества и идеальной четкости контуров. Векторные программы для веб-дизайна рекомендуется применять для создания логотипов, эмблем и т. п.
Ближе к делу.
Sketch — специализированный векторный редактор
Вам стоит работать в Sketch, если вы:
- работаете на Mac (версии под PC пока не предвидится),
- занимаетесь в основном интерфейсами (не иллюстрациями, графическим дизайном, фотоманипуляциями и т. п.)
- понимаете, как программисты будут работать с вашими исходными файлами (формат «.sketch»), либо вы сами будете экспортировать всю графику для верстальщиков или программистов.
С остальной информацией (она может отличаться по дате, но поверьте, это достоверная информация и по сей день), вы можете ознакомиться здесь и здесь
Figma — кросс-платформенный сервис для дизайнеров
В Figma есть все основные векторные инструменты (примитивы, кривые, выравнивание, сортировка объектов), поддерживаются эффекты для слоев и фигур (в том числе режимы прозрачности, как в Photoshop), есть достойные настройки обводок и шрифтов (нашлась даже пара шрифтов с кириллицей), а также удобства вроде линеек и сетки. Булевых операций для объектов пока что нет, их частично заменяет возможность превращать фигуры в маски и помещать внутрь них другие объекты.
Adobe Experience Design CC (Adobe XD)
Adobe XD облегчает задачи макетирования, создания визуального дизайна, взаимодействий, прототипирования, тестирования и обмена, предоставляя все, что нужно для проектирования интерфейсов, в едином решении. Они начали с базового набора инструмента в каждой из этих областей, а получаемые отзывы помогали определить приоритетный функционал, который необходим нам.
Всего понемногу.
В данной статье лишь краткое описание каждого из инструментов, стоит заметить, здесь указаны векторные графические редакторы. Для детального обзора нужна мотивация в виде аудитории :)
