Все проблемы видео на behance или коротко о моем первом лонгриде

Моя история попытки смены профессии как и у всех начались с психов и ненависти к текущей работе. Конечно, будешь ли ты что-то менять если тебя все устраивает? Длительные поиски бесплатных интенсивов по дизайне привели меня к обучающему направлению студии «Логомашина». Тут-то и случилась любовь)

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

1) Не все шрифты хорошо читаются, что было бы очевидно для шрифтов рукописных и декоративных, но такое же работает с некоторыми антиквами и гротесками, поэтому подбирать надо тщательно;

2) Нельзя делать текст во весь экран, максимум 60-80 знаков в страже. ДАЖЕ если остается пустое место;

3) Использовать интерлиньяж в 120-140% от кегля, так текст читается лучше;

4) Не забывать по «воздух» в работе;

5) Помнить про динамику и повторение блоков.

Шаг 1. Взять текст и разбить его на блоки для удобства. С этим справится было проще всего)

Шаг 2. Посмотреть примеры лонгридов и создать примерную визуальную картинку, важным здесь было не только взять примеры как можно, но и вдохновиться, подбираю на Behance и Pinterest. Тоже не очень сложный шаг, но главное понимать, что сразу так не получится и это нормально.

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

Шаг 4. Начнем дизайн! Казалось, что вот тут-то все будет быстро и просто, а вот и нет. С данным этапом я засела на добрую неделю, потому что есть примерно наработанная схема, есть картинки, а вот как объединить это все в реальность понятия никакого нет и в помине.

Пересматриваешь уроки, потом пытаешься сделать хотя бы что-нибудь. Цвет выбираю монохромные оттенки, для удобства чтения и чтобы не было ощущения, как будто единорог пробежал по сайту. Более менее подбираю шрифты с помощью Гугл фонтс и их шрифтовыми парами. Смотрим картинки на unsplash и составляем примерный набор подходящий под тему работы.

Шаг 5. Отправляем на первую проверку, получаем комментарии по косякам и как можно все это дело улучшить. Если работать без куратора, то ощущение было из разряда «и так норм», но оказывается нет)

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

Шаг 7. Проверка номер 2. Опять получаем комментарии и исправляем их.

Шаг 8. Проверка номер 3 и работа наконец-то принята, но как оказалось это не все. Сделать работу — легче, чем оформить ее и выложить.

Шаг 9. Страдаем над оформлением. Для меня оказался самый тяжелый шаг, так как насмотришься на красивые работы с ленточками на behance, а потом поднимаешь панику, что у тебя не так.

Самое сложное в презентации оказалось видео. Сервис Vimeo не работает в России для новых клиентов, так что просто скачать туда видео и вставить туда не сработало. Сделала запись с экрана и озадачилась вопросом как вставить это видео в мокап)))) По советам ребят из чата и всемогущего Гугла нашла инструкцию как вставить видео в картинку.

Окей, видео готово, как вставить его на behance? Казалось бы все просто, там есть плашка для вставки видео.

Нооооо, она не работает))) Если вставлять видео таким образом, оно будет грузится буквально вечно

Начались поиски вставки формата приемлемого для платформы, подумала о формате гиф через https://giphy. com и встраиваемого кода на самом behance Открываем сайт и следуем по интуитивно понятному интерфейсу

Выбираем код и пытаемся встроить его на behance с помощью значения embed на giphy и встроенный код на behance. Получаем картинку отвратительного качества. Способ не работает, ищем дальше.

С помощью ребят с моей учебной группы (спасибо им за это!) узнаем, что можно встроить видео с YouTube. Наконец-то! Может здесь все сразу будет просто и понятно? Нет! Но сделаешь однажды и скорее всего запомнишь навсегда.

1. Открываем YouTube;
2. Заходим в профиль и нажимаем создать видео;
3. Загружаем наше видео, шелкаем далее, далее и далее;
4. Я создала видео доступное только по ссылке, чтобы не засорять профиль;

5. Открываем само видео, опубликованное на странице, открываем его в нужном форме (1080)Наживаем поделиться и кнопку встроить;

6. Копируем открывшийся код и вставляем его в встроенный код на behace

7. Сохраняем. Вуаля, вы прекрасны!

Оказалось писать статью можно также как и делать любое задание, сначала думать и сокрушаться, открывать и закрывать пустой лист, а потом просто сесть и начать делать.

Слова и мысли придут, как кто-то уже говорил, если тебе не о чем писать, просто сядь и пиши о том, что тебе нечего писать. И так ведь в любом деле, самое страшное всегда начать, но результаты всегда удивляют. Надеюсь мои советы были полезны и вы дошли до конца)

Прилагаю ссылку на свою готовую работу, которая научила меня не сдаваться и верить:

https://www.behance.net/gallery/158874285/longrid

Спасибо за прочтение!