Примеры крутых и красивых лендингов

 

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

Однако лендниг пейдж, соединяющий в себе все современные тенденции, но созданный без представления о том, как они взаимодействуют, не станет красивым сайтом. Речь о том, как выбрать подходящие элементы, и сделать крутой landing page, не используя всю кучу современных фишек, под клеймом «модное». Дизайн как искусство, когда тебе не нужно следовать стандартам, чтобы создать что-то прекрасное. А сейчас наслаждайтесь некоторыми из самых симпатичных целевых страниц.

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


slack

2. Docady не только использует видео-фон, но так же предлагает анимацию самого приложения на экране смартфона. Эти 2 элемента действительно сделали Docady выделяющимся.

image01

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

image00

4. Довольно упрощенный дизайн Instapaper совсем не переигрывает свою роль и дает посетителям все, что им нужно знать.

image04

5. Dyson 360 Eye использует динамичную анимацию разобранного на части пылесоса, что дает пользователям сайта возможность увидеть, как на самом деле это работает.

image19

6. Toptal использует призыв к действию и простые цвета, что выделяет эту независимую сеть, создавая «очеловечивающий» эффект. Посетители сайта попросту не могут не думать, «знаете, а ведь я действительно имею нераскрытый талант». Очевидно, что их целевая страница выглядит так круто, ведь они просто пригласили дизайнеров пользовательского интерфейса.

image11

7. Фон Wistia содержит именно то, чем компания занимается. Чистая классика.

wistia

8. Целевая страница Periscope показывает приложение в действии, используя при этом минималистский дизайн с довольно сильным призывом к действию.

image10

9. Dropbox использует нарисованную от руки анимацию и много белого пространства чтобы эффективно направить внимание посетителя на поле регистрации.

image15

10. Kissmetrics использует тщательно выбранный заголовок, простые иконки и ясную презентацию, чтобы эффективно подавать свой продукт.

image21

11. Среди доминирующих зеленого и белого цвета, голубое поле для регистрации Treehouse выделяется и привлекает пользователей. Элегантная движущаяся страница, информация о теме сайта, предоставленная в простой и ясной форме, баннер с узнаваемыми пользователями. Благодаря этому Treehouse сумел создать привлекательную посадочную страницу.

image24

12. Swifty выводит взаимодействие на новый уровень, давая посетителям возможность использовать часть его приложения как введение на своем лендинге.

image23

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

image12

14. Urban Walks создал элегантную целевую страницу, показывая iPhone во всей красе и демонстрируя, как приложение выглядит на экране, чтобы для посетителей сайта все было максимально прозрачно.

image06

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

image02

16. Градиенты цвета могут быть действительно сильным визуальным стимулятором, и Stripe использует это, чтобы усилить эффект. Искусное использование прозрачной кнопки и простота иконок, парящих над iPhone создают приятную эстетику, которая так и приглашает пользователей зайти.

image08

17. Взяв на заметку дизайн Apple, Simply Gum эффективно использует белое пространство чтобы привлечь внимание пользователей к своему продукту: различные вкусы натуральной жвачки. Выделяя цветом натуральные ингредиенты своей жвачки , Simply Gum эффективно рекламирует свою продукцию.

image18

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

image16

19. Trippeo — тоже использует градиент и создает чистую посадочную страницу с привлекательными цветами, прозрачными кнопками и анимацией приложения в действии. Так что же вам тут еще нужно?

image05

20. Diagnosite использует неотразимые тени зеленого и метафору в виде диагноза врача, чтобы показать, что здесь анализ сайта проводится действительно разумно и объективно, и это помогает данному сайту выделяться среди остальных аналитических платформ.

image17

21. Целевая страница Kong визуально переполнена, но она несомненно привлекает внимание посетителей. Kong это приложение которое позволяет пользователям делиться гиф-изображениями, поэтому естественно, что целевая страница создана только из гифок и слова «Kong», полностью окрашенного в белый. Она поражает, запутывает, и , конечно же, заставляет посетителя хотеть узнать больше.

image22

22. Shyp использует разделенный экран чтобы усилить эффект своей целевой страницы и заставляет ее выглядеть свежо, как бы разрезая страницу по диагонали.

image20

23. Целевая страница Moto 360 использует изображение пользователя, полна интересной геометрии и теплых коричневых оттенков. Вместе с притягивающим призывом к действию и загрузкой информации по мере передвижения вниз по странице, Motorola спроектировала чудесную целевую страницу для этих лидирующих часов.

image09

24. Теплые оранжевые тона, умело выбранная фоновая анимация, прозрачные кнопки, отличный призыв к действию и визуализация своего продукта. Что может не понравиться в целевой странице Litmus?

image07

Умелый дизайн кнопок — витрина сайта

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

Источник перевода