Что такое референсы и где их искать

Референсы показывают концепцию работы и передают идею. Где искать референсы, как вдохновиться чужими работами и не нарушить этику — рассказываем в статье. А эксперт Алексей Гамов — веб-дизайнер, владелец веб-студии WebValley Studio — делится советами, как дизайнеру работать с референсами и на каких площадках их искать.

Что такое референсы

Референсы — это вспомогательные материалы. Они нужны, чтобы представить будущий проект, иллюстрацию, видео или текст. В качестве референсов используют:

• картинки из интернета и фотографии;
• видео и анимацию;
• статьи, ленты с постами в соцсетях и другой контент.

Рассмотрим на примере SMM-специалиста. Для разработки дизайна ленты в инстаграме* он берет раскладку постов конкурентов. По ней понимает, какие фотографии хорошо смотрятся. Заимствует лучшее из каждой ленты и создает свой вариант.

Пример референсов раскладки постов

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

На курсе по интернет-маркетингу вы изучите все нюансы работы SMM-менеджера, в том числе узнаете о визуальных и стилистических трендах. Сможете подбирать выигрышные кадры и составлять референсы, благодаря чему увеличатся продажи клиентов и улучшится ваша репутация. При обучении в Skypro вы защищаете итоговую работу и получаете сертификат установленного образца.

Пример референсов для контентной фотосессии

Заказчику референсы помогают увидеть примерный результат. Если что-то в референсах не подходит, легко поправить всё сразу, а не переделывать на финальной стадии.

В каких сферах используют референсы

🎥 В кино. Референсы в киноиндустрии — жанровые и сюжетные линии, типажи персонажей, спецэффекты и музыкальный ряд. Например, после выхода фильма «Чужой» появилось много похожих картин — «Нечто», «Живое», «Вторжение».

🎨 В дизайне. Дизайнерам любого направления референсы помогают разработать концепцию и вдохновиться. А еще:

• изучить строение предметов, форму и текстуры;
• найти лучший ракурс;
• подобрать цветовую палитру;
• выбрать технику и стилевые приемы;
• передать эмоциональное направление.

Если хотите изучать дизайн, приходите на курс «Графический дизайнер». Всего за 10 месяцев вы сможете получить новую интересную профессию. Освоите все необходимые инструменты: Figma, Tilda, Google Slides, Adobe Illustrator, Photoshop, InDesign и After Effects, научитесь делать верстку, продумывать визуальное оформление лендингов, составлять мудборды и многое другое.

📝В создании контента. Копирайтер ориентируется на статьи конкурентов из топа, чтобы понимать, какие тексты занимают высокую позицию в поисковой выдаче. Это помогает правильно создать структуру статьи, вписывать ключевые слова, определять нужное количество картинок.

Пример референсов для копирайтера

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

📷 В фотосъемке. По фотографиям-референсам планируют съемку: подбирают наряд, делают макияж модели, выбирают студию или повторяют позу.

Чем референсы отличаются от мудборда

Мудборд — это подборка изображений для концепции в виде коллажа. Например, для фотосессии — снимки макияжа, типажа и позы модели, аксессуаров и костюма. А референс — это конкретный пример: кадр, который покажет композицию в целом. Мудборды и референсы отбирает не только исполнитель, но и заказчик.

Пример мудборда для контентной фотосессии студии танцев

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

Какие есть виды референсов

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

Например, всем знаком изначальный стиль Disney.

Стилистика мультфильмов Disney в 30-е годы

Современные иллюстраторы используют стилистические приемы студии, но создают свои уникальные работы.

Использование стилистики в иллюстрации Giddy Up

Тематические референсы — сценарии, концепции, сюжеты и драматургические основы. Их исполнитель повторяет в своей работе.

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

Технологические референсы решают техническую часть проекта. Сюжет, персонажи, визуальная часть, стилистика при этом не важны.

Например, маркетолог разрабатывает стратегию продвижения для компании. В стратегии предусматривает формы для сбора контактов — всплывающие окна. Маркетолог собирает референсы места и времени появления окон на сайтах конкурентов. Затем выбирает технические параметры для них в собственном проекте.

Мечтаете познакомиться с деятельностью маркетолога — записывайтесь на курс «Интернет-маркетолог». За шесть месяцев освоите всё, что нужно для работы, и сможете устроиться на позицию новичка с зарплатой не меньше 50 000 ₽. Вам будут помогать опытные преподаватели, кураторы, карьерные консультанты. В итоге соберете готовое портфолио и получите сертификат о переподготовке.

Как дизайнеру работать с референсами

Советами делится Алексей Гамов, веб-дизайнер, владелец веб-студии WebValley Studio.

📌 Не копируйте. Референсы нужны не для того, чтобы копировать готовые решения, а чтобы изобретать свое, вдохновившись чужим. То есть референс не должен использоваться как шаблон. Он нужен только для вдохновения. Берите идеи, а не готовые решения.

📌 Анализируйте. Поиск референсов не должен сводиться к простому «нравится / не нравится». Если вас зацепило какое-то решение, задайте себе вопросы: что в нём такого? Почему оно цепляет? Почему дизайнер использовал именно такой подход?

«Работа с референсом — это поиск правил и закономерностей. Когда вы понимаете, в чём суть визуального решения, вы можете его переосмыслить, а не слепо скопировать. Тут как в математике: если вы просто знаете правильный ответ — он подойдет лишь к одной задаче. А зная формулу, вы сможете решить любое уравнение».

Алексей Гамов

веб-дизайнер, владелец веб-студии WebValley Studio

📌 Держите фокус на проекте. В поисках референсов можно уйти не в ту степь. Поэтому важно держать в голове цели и задачи проекта, над которым работаете. Каждый раз, когда вы находите шикарный референс, думайте: как он соотносится с моим проектом? Какой эмоциональный отклик вызывает? Решает ли поставленные задачи? Помните: вам нужно найти не просто классное решение, а самое подходящее.

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

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

Алексей Гамов

веб-дизайнер, владелец веб-студии WebValley Studio

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

📌 Помните, что референсов должно быть много. Речь не о том, чтобы собирать по 100 референсов на каждый смысловой блок сайта. Но чем больше референсов вы используете, тем объективнее получается ваше решение. Если референсов будет один — три, то есть большой риск, что вы зациклитесь на какой-то идее и уйдете в копирование.

📌 Систематизируйте референсы. Референсы мало найти. Если у вас одна ссылка в телефоне, другая открыта в браузере, третья записана в блокнот — вы их потеряете гораздо быстрее, чем нашли. Референсы нужно где-то хранить и систематизировать. Для этого можно использовать отдельную вкладку в проекте в Figma, папку на компьютере, специально созданный чат в телеграме. Это вопрос удобства дизайнера. Аккуратность в организации рабочих процессов поможет сделать работу с референсами эффективной.

📌 Следите за актуальностью. Даже если вы недавно делали сайт в той же стилистике и нише, всё равно ищите новые референсы. Тренды в дизайне меняются очень быстро. И то, что казалось лучшим решением месяц назад, сегодня уже может быть неактуально. Каждый проект уникален, поэтому референсы каждый раз нужно подбирать заново.

Если хотите освоить Photoshop, Figma, Tilda и другие программы для создания интерфейсов, сайтов, презентаций, печатной продукции на профессиональном уровне, пройдите курс «Графический дизайнер» от Skypro. Не только освоите программы, но и погрузитесь в профессию: научитесь брифовать заказчика, презентовать проекты, соберете портфолио.

Есть рассрочка на 12, 24 и 36 месяцев. Если передумаете учиться, вернем всю сумму в течение первых двух недель после старта.

Где искать референсы

Референсы найдете на специальных платформах, фотостоках и в соцсетях.

Платформы для дизайнеров

Рассказывает Алексей Гамов, веб-дизайнер, владелец веб-студии WebValley Studio.

Pinterest

Это платформа с концептами на любую дизайнерскую тему. На Pinterest есть:

• фотографии,
• дизайны лент,
• наброски,
• инструкции,
• видео,
• иллюстрации,
• иконки.

Behance

Многомиллионная коллекция работ от дизайнеров, разработчиков и других людей творческих профессий.

Dribbble

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

Dprofile

Площадка, которая создавалась как русский Behance. Лучшие работы веб-дизайнеров — фрилансеров и веб-студий.

Siteinspire. Есть фильтры для поиска референсов и возможность создавать свои коллекции.

Uprock. Подборка лучших кириллических сайтов.

Webdesign Inspiration. Сайт для поиска идей вдохновения. Референсы обновляются каждый день.

DesignInspiration. Можно искать дизайн в нужной цветовой гамме и создавать собственные коллекции.

The Design Inspiration. Ресурс для поиска референсов для графических и веб-дизайнеров. Удобная фильтрация по цвету.

CSSnectar. Здесь оценивается не только общее впечатление от дизайна, но и каждый элемент в отдельности. Это может быть очень полезно для новичков в веб-дизайне.

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

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

Mobbin-design. Шикарная подборка референсов интерфейсов для сайтов и мобильных приложений, с фильтрацией по платформам.

Sitesee. Галерея сайтов с аккуратным дизайном для вдохновения. Есть фильтрация по нишам и цветам.

FWA. Конкурсная платформа. Здесь можно черпать вдохновение, находить референсы и узнавать тренды.

Фотостоки

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

Фотосток unsplash.com

Тематические группы в социальных сетях

Во ВКонтакте администраторы и подписчики публикуют фото, тексты, мемы. Их тоже используют как референсы. Например, берут идеи фотосессий, картинки под тематику проекта, цветовые палитры. Еще во ВКонтакте есть специальные группы с примерами. Чтобы найти их, введите в поиске сообществ «Референсы» или «Идеи для…».

Кино, сериалы, клипы

Из фильмов, сериалов и музыкальных клипов берут типажи персонажей, идеи фотосессий или дизайна интерьера. Например, вы продумываете новогоднее оформление компании. Для вдохновения посмотрите «Один дома» или «Подарок на Рождество». Делайте скрины нужных кадров — так получатся референсы.

Что важно знать о референсах

• Референсы — это вспомогательные материалы, чтобы представить будущий проект, иллюстрацию, видео или текст. Они нужны не для копирования, а чтобы на примерах чужих работ продумать концепцию и создать уникальную работу. С их помощью согласовывают направление с заказчиком или исполнителем.
• Референсы бывают стилистические, тематические и технологические. Их используют дизайнеры, копирайтеры, маркетологи, сценаристы, иллюстраторы.
• Как найти референсы — посмотрите платформы для дизайнеров, фотостоки и тематические группы в соцсетях.

*Продукты организации Meta признаны экстремистскими на территории РФ.