Кращі landing page - підбірка кращих інтерактивних landing page

Велика кількість сайтів, які знаходяться в рунеті, дуже одноманітні, а завжди необхідно створювати щось нове, незвичайне, що привертає увагу. На цей раз я вирішив написати статтю не просто про черговий ефекті на сайті, а показати як дані ефекти можна об`єднати в рамках одного великого проекту. Це дуже важливо, щоб Ваш сайт не дивився як набір безглуздо з`являється із різних сторін анімації. Вашій увазі я хочу представити добірку з 10 кращих інтерактивних Landing Page, на які варто звернути увагу.

Про те з чого почати при вивченні створення сайтів, а зокрема Лендінзі, я розповів в невеликому міні-курсі: "Лендінгем за 60 хвилин".

Отже, ось підбірка з 9 Лендінзі де стоїть черпати натхнення:

• # 1. Fixed Group
• # 2. Fubiz
• # 3. Vimeo
• # 4. Black Negative
• # 5. Super Top Secret
• # 6. WE IS NOT PLASTIC
• # 7. ANTON IRENE
• # 8. BLITZ
• # 9. The Boat

Подібні - кращі інтерактивні Landing Page

1 Fixed Group

Відмінний варіант сайту, на якому можна навіть мишку змістити, як відразу побачите спотворення блоку з контентом у відповідь. Ззаду повільно "пливе" космос. Переходи також не можуть залишити байдужим, адже вони все відбуваються з цікавим ефектом, і створюється враження, що кожен з блоків "розрізаний" на дві половинки.

2 Fubiz

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

3 Vimeo

Цей проект повинен бути Вам вже знаком - це професійний відео-хостинг. Але дана сторінка розповідає про можливості редагування відео прямо з мобільного пристрою. Але я хочу загострити увагу на ефектах, які відбуваються при прокручуванні сторінки. Спочатку відбувається зменшення фонового зображення в шапці, а потім з`являється в 3D перспективі телефон. Дуже привертає увагу, чи не так?

4 Black Negative

Відмінною особливістю даного сайту перед усіма іншими є його нестандартна прокрутка. Як Ви могли помітити - вона горизонтальна. Також переміщення відбувається за допомогою перетягування контенту вліво. Але що ще більше вражає - це кількість ефектів в кожному блоках: фонове відео, ефекти при наведенні, а також вертикальна прокрутка блоків. Відео на тлі трохи збиває, але все ж виконано все досить оригінально і незвично.

5 Super Top Secret

Відео: ТОП 5 | Landing Page конструктори | створити Лендінгем

Тут хочу звернути Вашу увагу не на ефекти при наведенні, а на фон. Після повного завантаження сайту при переміщенні курсору миші на тлі з`являються розводи, як на воді. Також при натисканні створюються розлучення, і такий ефект справляє чудове враження. Чи не на кожному сайті побачиш таке.

6 WE IS NOT PLASTIC

У процесі прокрутки на сторінці з`являються (малюються) різні іконки і заголовки. Не усвідомлюючи починаєш дивитися на процес малювання і чекати що ж там з`явиться в кінці, тим самим читаючи текст, який намалювався. Якщо Вам цікаво як же створюється даний ефект і Ви хочете створити такий же ефект на своєму сайті або Лендінзі, тоді вивчіть дані статті: малювання елементів і малювання при прокручуванні.

Також перед завантаженням основної частини сайту з`являється анімація, яку можна легко створити за допомогою однієї бібліотеки. Як це зробити читайте тут: приголомшлива анімація на Лендінгем.

7 ANTON IRENE

Відео: The Best Landing Pages to Sell & Deliver an Online Course

При прокручуванні сторінки дуже багато ефектів, деякі з яких: перед поява тексту роз`їжджаються в сторони елементи, які містять зображення людей. Також на сторінці присутні дуже незвичайні ефекти при наведенні, коли з`являється вся частина з контентом. Якщо Вам сподобався цей ефект при прокручуванні і у Вас є бажання навчитися робити також, тоді наступна стаття для Вас: ефекти при Скролл.

8 BLITZ

Що привернуло мене даному сайті, так це ефекти при наведенні. Хоч сайт і створений в сучасному стилі мінімалізму, але тут дуже красиво поєднуються 3D об`єкти: розкриваються листівки, рух об`єктів на листівці. Також зверніть увагу на зміну блоків при прокручуванні.

9 The Boat

Якщо при прочитанні книги Вам важко уявити що там відбувається, тоді даний сайт для Вас # 128578; . Тому що тут Ви можете відразу і читати і бачити сюжет, тому що на тлі відбувається те, що написано текстом. Тобто у міру пересування між об`єктами і читання тексту змінюється і фон сайту.

Цікава задумка. Хто знає, може найближчим часом такі історії почнуть з`являтися у великих масштабах. Звичайно, є плюси і мінуси у даного підходу, але то що це креативно зроблено - немає претензій.

висновок

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

Відео: How To Create A Landing Page - Building Best Landing Page 2016

Успіхів!