Создание лонгрида. Мой опыт

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

Забавный факт. До начала его создания я не знала, что такое лонгрид. Все одностраничные сайты были для меня — лендингом.

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

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

А вот, собственно, мой первенец. Это та самая первая итерация, когда я заполняла дизайн текстом, а не наоборот. Тут неудачно подобран шрифт заголовка и размер слишком большой. Тексту будто тесно на экране.

Первая итерация учебного лонгрида
Первая итерация учебного лонгрида

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

Мудборда у меня было два. Первый я собрала из лонгридов стиль которых мне нравился. Он помог мне расположить текст с учетом места под будущий дизайн.

Вторым мудбордом я вдохновлялась при создании дизайна. Вот собственно и он:

Я даже не надеялась самостоятельно нарисовать иллюстрации, поэтому долго пыталась просто заполнить мой лонгрид графическими элементами, которые мне под силу. Чужие иллюстрации взять долго не решалась, казалось будто это легкий путь и если я их возьму, то я недостаточно постаралась. Сейчас мне эта мысль кажется глупостью, ведь чаще всего контент не наш. Фото сделал фотограф, например. А наша задача красиво оформить. Но тем не менее на этом этапе я тоже потеряла не мало времени.

Ещё одной из моих маленьких побед стала анимация. Она далась не просто, в прочем как и всё остальное, но я была очень довольна, что освоила этот инструмент и оживила не свои иллюстрации, добавив им немного себя. Опять же, сколько бы уроков я не посмотрела на эту тему на ютуб, воплотить именно мою идею мне помогли уроки записанные Кристиной. Так как я часами могла возиться пробуя сделать какой-то прототип, но ничего не работало. Пока Кристина не скажет, что вот тут нужно поместить все на общий фрейм, а тут наоборот каждому элементу сделать отдельный. Один маленький нюанс и ты в тупике. Без куратора я бы просто потеряла мотивацию на старте.

А вот и мой чистовой вариант лонгрида.

Создание  лонгрида. Мой опыт
Создание  лонгрида. Мой опыт

Спасибо за просмотр!

1
Начать дискуссию