Обложка курса Udemy: портрет, который пройдёт проверку

У обложки курса две задачи: пройти проверку качества на Udemy, а потом выжить в полудюжине размеров — во всю ширину на странице курса, карточкой в поисковой выдаче, узкой полоской в списке «Мои курсы». Немало отклонённых картинок проваливают первую задачу по причинам, которые к дизайну не имеют никакого отношения.

Модераторы идут по чек-листу, а не по вкусу. Правила, которые публикует Udemy, собираются вокруг нескольких пунктов: текстовая информация на изображении, размытая, пиксельная или искажённая графика, картинка, уже использованная в другом вашем курсе, а также рамки, обводки и чёрные поля по краям. В том же ряду стоит и простота — стандарты требуют ограничить количество визуальных элементов и детализацию, потому что конкурирующие элементы создают путаницу. Любого из пунктов достаточно, чтобы курс вернули; перечитайте стандарты построчно, а не гадайте по макету.

Сначала закройте вопрос с техническими требованиями. Udemy публикует минимальный и максимальный размер, а не один фиксированный, плюс список допустимых форматов файла — всё это в статье справочного центра «Course image: Quality standards». Размеры, переписанные из старой статьи в блоге, приводят к отказу, пока вы ищете в графике проблему, которой там никогда не было.

Что именно проверяют модераторы

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

• Любые надписи. Стандарты не допускают текстовой информации, кроме ограниченных исключений вроде логотипа, — название курса в том числе. «Бестселлер», «скидка 50%», рейтинг со звёздами, самодельный бейдж: правило одно на всех.
• Чужие знаки. Логотип программы, которой вы учите, вордмарк компании. Ваш собственный логотип — задокументированное исключение; по чужим брендам Udemy советует обратиться к юристу и убедиться, что содержание курса соответствует разделу 6 условий для преподавателей.
• Контакты. Сайт, ник, адрес почты. Отдельным пунктом стандарты их не называют, но это текст — значит, работает то же правило.
• Видимые дефекты качества. Мягкий фокус, артефакты сжатия, элемент, растянутый выше исходного разрешения. Стандарты требуют графику чёткую и без искажений.

Потом уменьшите макет до размера миниатюры. Если он превращается в кашу — провалена вторая задача, а спасать его надписями значит провалить первую.

Компоновка, которая работает без осечек

Формат, который держится на всём диапазоне размеров, предельно скромен: вы, вырезанные с настоящей фотографии, на плоском или двухцветном фоне — и больше ничего. Никаких рамок, коллажей и суетливых стоковых сцен. Когда из кадра убран весь текст, картинка тянет задачу в одиночку. Единый смысловой центр относится к рекомендациям Udemy, а не к требованиям; портрет даёт его сам собой.

Возни требует только одно: отделить себя от стены комнаты за спиной. Загрузите фотографию в remover.bg и дайте ему вырезать фон вместе с выбившимися волосками; дальше либо заливайте освободившееся место плотным цветом, либо выгружайте прозрачный PNG и ставьте его в свой редактор, где и решаются размер и положение.

Не возвращайте текст обратно: название курса и так стоит рядом с картинкой везде, где она показывается.

Как снять исходник, чтобы вырезка не подвела

Хватит телефона у окна. Чистый край зависит от нескольких вещей.

• Отойдите от стены на метр. Вплотную плечи набирают тень, которая читается как часть вас.
• Ставьте волосы на фон другого тона. Тёмные волосы на тёмном стеллаже — тяжёлый случай; светлая стена отделяет ту же голову мгновенно.
• Развернитесь к свету. Контровой свет прошивает распущенные волосы ярким ободком, который доживает до вырезки.

Ту же схему разбирает наш материал о том, как сделать профессиональное фото профиля дома.

Чистый край после сжатия

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

Держите вырезку в PNG, чтобы прозрачность дожила до вёрстки; наш гид по прозрачным PNG разбирает, где альфа-канал случайно теряется при сведении (сплющивании) слоёв. Мягкая тень за плечами затем сажает фигуру на цвет, а не подвешивает её перед ним.

Как превратить каталог в серию

Опубликуете второй и третий курс — и те, кому понравился один, пойдут смотреть ваш профиль; общий визуальный язык читается как программа обучения, а не как три случайные загрузки.

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

Перед загрузкой

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