Openpeeps

Open Peeps — это бесплатная библиотека векторных иллюстраций людей, созданная дизайнером Пабло Стэнли (Pablo Stanley) в рамках проекта Open Doodles. Сервис работает как конструктор: из готовых модулей — головы, туловища, поз, эмоций, одежды, аксессуаров и цветовых палитр — собираются уникальные персонажи. Библиотека насчитывает более 584 тысяч возможных комбинаций. Все ассеты распространяются по лицензии CC0 (Public Domain), что разрешает любое использование, включая коммерческое, без обязательства указывать автора.

Как работает конструктор персонажей

Интерфейс на openpeeps.com разделен на панели категорий: Head (голова), Torso (туловище), Pose (поза), Expression (эмоция), Hair (причёска), Accessories (аксессуары), Skin Tone (тон кожи), Clothing Color (цвет одежды). Каждый клик по элементу мгновенно обновляет превью в центре экрана. Сборка происходит в браузере, регистрация не требуется. Готовый персонаж скачивается одним файлом SVG или PNG, либо копируется в буфер обмена для вставки в редактор.

Для работы офлайн или в команде доступен архив со всеми исходниками: папки с разложенными по слоям SVG-файлами для каждой категории. Это позволяет собирать персонажи локально в любом векторном редакторе, не завися от доступности сайта.

Технические форматы и совместимость

• SVG — основной формат, сохраняет слои, масштабируется без потерь, редактируется в Figma, Illustrator, Sketch, Affinity Designer, Inkscape, Penpot.
• PNG — растрированные экспорты с прозрачным фоном, удобны для быстрой вставки в презентации, Notion, Canva, PowerPoint, Keynote, Google Slides.
• Figma Plugin — официальный плагин «Open Peeps» устанавливается из Community, добавляет библиотеку компонентов с вариантами (variants) для головы, туловища, позы, эмоций, аксессуаров. Цвета меняются через Color Styles, размер — через Scale tool.
• Sketch Library — .sketch-файл с символами и Layer Styles, поддерживает nested overrides.
• Adobe Illustrator / Photoshop — SVG импортируются как векторные слои; в Photoshop доступны как Shape Layers.
• Canva — загрузка SVG/PNG через «Uploads», дальнейшая рекраска возможна только для SVG через «Edit color» (ограниченно).

Лицензия CC0: что разрешено, а чего нет

CC0 (Creative Commons Zero) означает отказ автора от всех прав на уровне законодательства. Вы можете:

• Использовать иллюстрации в коммерческих продуктах (сайты, приложения, печать, мерч, реклама).
• Модифицировать, комбинировать, перекрашивать, анимировать.
• Включать в дизайн-системы, UI-киты, шаблоны для перепродажи.
• Не указывать автора и источник (хотя ссылка на openpeeps.com приветствуется как жест уважения).

Ограничений практически нет. Единственное — нельзя продавать сами исходные файлы «как есть» в виде отдельного набора иллюстраций (stock pack), выдавая за свой авторский контент. В составе более крупного продукта — без вопросов.

Сценарии использования: от макетов до продакшена

UI/UX и продуктовый дизайн

• Аватары пользователей в профилях, комментариях, чатах.
• Empty states: «У вас пока нет задач», «Корзина пуста» — персонаж с соответствующей эмоцией смягчает пустоту.
• Onboarding-экраны: пошаговые иллюстрации с одним персонажем в разных позах.
• Иллюстрации для фич: командная работа, поддержка, обучение, геймификация.

Маркетинг и контент

• Landing pages: секции «Команда», «Как это работает», «Отзывы».
• Email-рассылки: герои-персонажи повышают CTR.
• Соцсети: сторис, посты, обложки — быстрая сборка под брендовые цвета.
• Презентации: визуальные метафоры вместо скучных иконок.

Образование и документация

• Слайды курсов, вебинаров, инструкций.
• Схемы взаимодействия пользователей (user flows) с живыми актерами.
• Инфографика: демография, статистика, сценарии использования.

Брендинг и дизайн-системы

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

• Быстро прототипировать визуальный язык продукта.
• Поддерживать консистентность аватаров и иллюстраций на всех тачпоинтах.
• Передать разработчикам готовые SVG-компоненты для внедрения в код (React, Vue, HTML).

Сравнение с аналогами

Главное отличие Open Peeps — гранулярный контроль: поза, эмоция, прическа, аксессуары и цвета меняются независимо друг от друга. Humaaans ближе по духу, но ориентирован на сцены. Blush — маркетплейс коллекций, качество и стиль варьируют. unDraw — для иконок и сцен, не для персонажей. Persona — только аватары (голова/плечи), без полного тела и поз.

Практический воркфлоу: от идеи к готовому ассету

1. Браузерный конструктор — быстрый подбор референса: заходите на openpeeps.com, собираете 3–5 вариантов, скачиваете SVG.
2. Figma Plugin — для системной работы: добавляете библиотеку в файл, используете компоненты с variants, привязываете цвета к Color Styles бренда. Изменение брендового цвета в одной точке перекрашивает все персонажи в макете.
3. Локальная библиотека — скачиваете ZIP с исходниками (ссылка в футере сайта), кладете в общую папку команды. Дизайнеры открывают нужные SVG в редакторе, собирают вручную, сохраняют как компоненты.
4. Экспорт для разработки — в Figma: правый клик → Export → SVG → настройки: «Outline text», «Simplify». Файлы отдаются в репозиторий дизайн-системы или напрямую в кодовую базу.
5. Анимация (опционально) — экспортируете последовательность поз одного персонажа (Stand → Wave → Walk), собираете в Lottie/After Effects/Figma Prototype для микро-анимаций на сайте.

Частые вопросы и нюансы

Могу ли я использовать Open Peeps в печатной полиграфии?

Да. SVG — вектор, масштабируется без потерь. Для типографии экспортируйте в PDF/EPS из Illustrator или InDesign. Проверяйте, что шрифты (если добавляли текст) заэмбенжены или конвертированы в кривые.

Как изменить цвет кожи на нестандартный (фиолетовый, брендовый)?

В браузерном конструкторе палитра Skin Tone фиксирована. Для кастомного цвета: скачайте SVG → откройте в векторном редакторе → выберите группу «Skin» → примените свой Fill. В Figma Plugin: отсоедините компонент (Detach instance) → найдите слой Skin → примените свой Color Style.

Есть ли анимированные версии (Lottie/GIF)?

Официальных анимированных пакетов нет. Сообщество создает свои наборы на основе Open Peeps — ищите в Figma Community по тегам «Open Peeps animation», «Open Peeps Lottie». Лицензия CC0 позволяет это делать свободно.

Как обновить библиотеку в Figma, если вышли новые элементы?

Плагин обновляется через Figma Community: заходите на страницу плагина → «Update». Локальные .sketch/.svg файлы — перескачивайте ZIP с сайта и заменяете в общей папке.

Поддерживает ли Open Peeps темную тему интерфейса?

Сайт конструктора имеет переключатель Light/Dark (иконка луны в хедере). Экспортируемые SVG не имеют фона, поэтому отлично смотрятся на любом фоне.

Можно ли использовать Open Peeps в NFT/крипто-проектах?

С точки зрения лицензии CC0 — да. Юридических препятствий нет. Этический аспект решайте сами.

Советы для профессионального результата

• Согласуйте палитру заранее. Создайте Color Styles для Skin Tones, Clothing Primary, Clothing Secondary, Accessories. Применяйте их ко всем персонажам — ребрендинг займет минуты.
• Используйте Pose + Expression вместе. Поза «Руки в стороны» + эмоция «Удивление» читается лучше, чем просто эмоция на нейтральной позе.
• Не злоупотребляйте аксессуарами. Очки + шляпа + борода + наушники = визуальный шум. Оставьте 1–2 акцента.
• Сохраняйте пропорции. При масштабировании в невекторных средах (PowerPoint, Canva) используйте только PNG с достаточным разрешением (минимум 2× от размера на экране).
• Создайте библиотеку «Наших людей». Соберите 10–15 базовых персонажей под бренд, назовите их (User_Default, Admin_Active, Support_Friendly) — команда будет пользоваться готовыми ассетами, а не собирать каждый раз.
• Проверяйте доступность. Контраст одежды на фоне интерфейса должен соответствовать WCAG AA (4.5:1 для текста, 3:1 для графических объектов). При необходимости добавьте тонкую обводку (stroke) к SVG.

Ограничения, о которых стоит знать

• Стиль фиксирован. Это ручная рисовка Пабло Стэнли — линейка, вес штриха, уровень детализации не меняются. Если бренду нужен иной стиль (плоский, 3D, реализм, пиксель-арт) — Open Peeps не подойдет.
• Нет животных, предметов, фонов. Только люди и их аксессуары. Для сцен нужно рисовать окружение отдельно или брать из других библиотек (Open Doodles, unDraw, Blush).
• Ограниченное представление типов тел. Базовые формы: среднее, стройное, плотное. Нет детальной настройки роста, веса, пропорций конечностей.
• Нет встроенной анимации. Для движения нужен внешний инструмент и ручная работа над кадрами.
• Зависимость от одного автора. Проект развивается волонтерски. Обновления выходят редко. Критические баги в SVG (лишние точки, некорректные viewBox) правьте локально.

Заключение

Open Peeps остается одним из самых удобных и правовых способов добавить живых людей в цифровой продукт без бюджета на иллюстратора. Модульная архитектура, лицензия CC0, нативная интеграция с Figma и векторные исходники делают его стандартом де-факто для MVP, внутренних инструментов, образовательных проектов и быстрых маркетинговых запусков. Главное — не воспринимайте его как «готовый бренд-стиль», а используйте как мощный конструктор для прототипирования визуального языка, который позже можно (и нужно) заменить на уникальную иллюстрационную систему. Начните с openpeeps.com — соберите первого персонажа за минуту и оцените, как меняется восприятие ваших макетов.

Информация обновлена — 19.07.2026.