Почему твой логотип выглядит размыто (растр vs вектор)
Векторная графика масштабируется бесконечно. Растровые изображения — нет. Знай, когда использовать каждое.
Ты отправляешь свой логотип в типографию. Он выглядит чётким на твоём экране. Печатная версия выглядит так, будто была сделана в MS Paint.
Проблема: ты отправил растровое изображение там, где нужен был вектор.
Растровые изображения: сетки пикселей
JPEG, PNG, GIF — это растровые форматы. Они хранят изображения как сетки цветных пикселей.
Изображение 100x100 пикселей имеет ровно 10 000 пикселей. Увеличь его до 200x200, и ты изобретаешь пиксели, которых не было. Результат: размытие или пикселизация.
Растр отлично работает в предполагаемом размере. Масштабируй вверх, и качество ухудшается.
Векторные изображения: математика, а не пиксели
SVG, PDF, AI — это векторные форматы. Они хранят инструкции типа "нарисуй круг здесь" и "сделай линию от A до B."
Масштабируй вектор до любого размера, и он пересчитывается. Всегда чёткий. Всегда ясный.
Когда использовать вектор
Логотипы. Нужны во всех размерах — от фавикона до билборда. Вектор обрабатывает все.
Иконки. Элементы UI, которые появляются в различных размерах на устройствах.
Иллюстрации. Простая графика с сплошными цветами и определёнными формами.
Печатные материалы. Всё, что идёт в типографию в неизвестных размерах.
Когда использовать растр
Фотографии. Миллионы цветов, градиенты, сложность. Фотографии изначально растровые.
Сложная графика. Живописные текстуры, детализированные градиенты, натуральные изображения.
Скриншоты. Захват того, что на экране, изначально основан на пикселях.
Веб-фото. Сжатие JPEG делает фотографии практичными для веб-доставки.
Реальность конвертации
Растр в вектор сложно. ПО может трассировать края и приблизительные формы, но сложные изображения не конвертируются хорошо. Простые логотипы с сплошными цветами конвертируются разумно. Фотографии не конвертируются значимо.
Вектор в растр легко. Просто экспортируй в целевом размере. Но как только растеризован, ты не можешь вернуться к вектору без пересоздания.
Частые ошибки
Использование растровых логотипов. Твой логотип должен существовать как вектор (AI, SVG или PDF). Растровые версии могут быть экспортированы из него в любом нужном размере.
Скриншоты векторов. Скриншоты векторных файлов — растр. Тебе нужен фактический векторный файл, а не изображение его.
Чрезмерная векторизация. Не всё должно быть вектором. Фотографии и сложные изображения не выигрывают.
Игнорирование исходных файлов. Дизайн-файлы (Illustrator, Figma) основаны на векторе. Экспорт в PNG теряет это. Храни исходные файлы.
Практический рабочий процесс
- Создавай оригинальную графику в векторном формате
- Храни векторный исходник навсегда
- Экспортируй растровые версии в конкретных размерах, когда нужно
- Переэкспортируй из источника, когда нужны другие размеры
Не работай в обратном направлении. Не пытайся векторизовать растровый логотип со своего сайта. Найди или пересоздай оригинальный вектор.
Быстрое руководство по форматам файлов
| Формат | Тип | Лучше всего для | |--------|------|----------| | SVG | Вектор | Веб-графика, иконки | | AI | Вектор | Профессиональные дизайн-исходники | | PDF | Вектор* | Документы, печать | | PNG | Растр | Скриншоты, прозрачность | | JPEG | Растр | Фотографии |
*PDF может содержать как векторный, так и растровый контент.
Вектор для масштабируемости. Растр для фотографий. Храни векторные оригиналы и экспортируй растр, когда нужно. Делать это наоборот создаёт размытые логотипы и расстроенных дизайнеров.