11 + 1 лендинг в сфере дизайна интерьеров и архитектуры. Дизайн интерьера лендинг

11 + 1 лендингов в сфере дизайна интерьеров и архитектуры

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

Неописуемой красоты лендинг пейдж для итальянской студии дизайна интерьеров «Le Stanze di Ann». Стильный уникальный дизайн дополнен плавной анимацией элементов и параллакс-прокруткой:

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

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

Второй блок содержит слайдер с тремя преимуществами, на третьем — интерактивное панорамное фото интерьера на 360 градусов, которое можно развернуть на весь экран, вращать, приближать и удалять. Четвертый блок отведен под фотогалерею, пятый — под мини-каталог элементов дизайна и предметов мебели. На последнем размещена ссылка для скачивания полного каталога и большая открытая форма для обратной связи.

Лендинг идеален, его великолепный дизайн вызывает настоящий восторг. Он красив, продуман до мелочей, адаптивен и хорошо оптимизирован.

2. Австралия в авангарде «зеленого» строительства

Лендинг, созданный для демонстрации потенциала проекта Зеленого Строительства австралийской торговой комиссии. 

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

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

3. Интерактивное путешествие в историю архитектуры Дели

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

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

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

Интересно сделан интерактивный временной график внизу экрана. Некрупный и отчетливый, он реагирует на прогресс просмотра страницы и показывает миниатюры слайдов с подписями при наведении на соответствующий отрезок. Даже для курсора мыши предусмотрена своя иконка, если навести его на слайд. Лендинг адаптивный и хорошо оптимизирован. В самом конце — ссылки на другие сайты разработчика. Отличная работа.

Лендинг для голландской компании по профессиональному художественному патинированию мебели и интерьера.

Весь первый разворот занимает слайдер с тематическими изображениями. Здесь только лого с дескриптором и навигационные ссылки вверху. Дизайн логотипа создавался вместе с лендингом. 

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

Предпоследний блок посвящен воркшопам и содержит длинную кнопку к закрытой форме для записи. В самом конце — советы по подбору цвета и контакты.

5. Дизайнерские скульптуры Даниэля Шу

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

Лаконичный и просторный дизайн со светлым фоном для скромного ассортимента изделий по нескромной цене. Весь ассортимент представлен на втором развороте и сопровождается кнопками к закрытым формам для оформления покупки.

Для оправдания завышенной цены должны приводиться весомые доказательства. На странице они поданы, как правило, в виде текста, что для конверсии не очень хорошо. Основные триггеры доказательств приведены лишь в конце сайта, перед контактами. Здесь сильно не хватает хорошей видео-презентации. Доказательства бы тоже не мешало дооформить.

В целом же сайт сделан со вкусом, приятен глазу, адаптивен и оптимизирован.

Лендинг для польского дизайнера интерьеров Моники Адамчик-Рокицкой.

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

Фото ее работ опрятные и свежие, а информация об услугах сведена к минимуму — достаточно просто принять решение о найме. В самом конце расположен блок с видами услуг и контакты. Лендинг адаптивный, хорошо оптимизирован, доступен на двух языках: польском и английском.

Лендинг для компании, занимающейся оборудованием и дизайном интерьеров для баров, кафе-мороженых, магазинов, частных учреждений в Италии и Германии.

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

Особенно хорошо удалось реализовать предпоследний блок с портфолио. Он интерактивный, девять примеров работ поданы компактно и красиво. Сайт сделан профессионально и приятен глазу. Доступен на итальянском и немецком языках.

8. Эксклюзивные таунхаусы в Бруклине

Смелый минималистичный лендинг для продвижения недвижимости в Бруклине.

Уникальный однотонный дизайн в стиле flat, напоминающий сенсорный интерфейс Windows 8, современный и адаптивный. Сайт выполнен полностью в духе предприимчивого Запада, почти полностью ориентированного на мобильного пользователя. Большую часть страницы занимают стильные черно-белые фотографии продукта, которые при нажатии становятся цветными, увеличиваясь в размерах.

Ниже находятся интерактивные подробные планы помещений. В самом конце страницы — большая, четкая и простая в использовании открытая контактная форма. Сайт работает на пользовательской системе управления контентом (CMS), имеет несколько настраиваемых модулей на JavaScript и форму регистрации AJAX.

Стоит ли говорить о его конверсии — все помещения давным давно распроданы!

9. «Живые системы Z» — природа знакомится с городом

Лендинг на WordPress для специалистов по городскому вертикальному садовому дизайну.

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

Последний разворот содержит скромную, едва выделяющуюся ссылку для подписки на рассылку и кнопку, которая должна вести на дополнительную статью, но, к сожалению, ведет на 404 страницу :-(

Строгий минималистичный лендинг для бельгийских дизайнеров интерьеров.

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

Нет каких-либо эффектов, кроме плавной смены изображений. Хороший и изящный сайт.

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

• Первый сайт рассказывает историю австралийских интерьеров с 40-х годов по 90-е. Оформлен с помощью коллажей и отличается анимированными элементами дизайна, но простенько реализованной прокруткой.
• Второй посвящен развитию дизайна интерьеров в целом с 50-х по 2010-й. Выполнен в трендовом стиле flat и имеет плавную прокрутку с анимированной сменой экранов, а также дополнительные навигационные кнопки.

Изображения-коллажи на лендинге «Interiors in Time» скомбинированы несколько небрежно, с одной стороны, но с другой это даже добавляет визуальному оформлению страницы некоторый ламповый шарм. Не все цвета кнопок, соответствующих десятилетиям, хорошо заметны на белом фоне. Радует анимация появления элементов и развернутая дополнительная информация, появляющаяся при нажатии на интерактивные точки захвата. Заканчивается страница… ничем, и это еще один минус.

Изображения интерьеров при прокрутке страницы «Interior Design by Decade» как-то странно «дребезжат», мелко подергиваясь при скроллинге, что портит впечатление от просмотра. Но сам процесс прокрутки реализован более интересно, удобно, информация подана лаконичнее, а дизайн сайта более стильный и современный. Здесь используется популярный плагин параллакс — Skrollr. Заканчивается страница так называемой открытой «Thank You Page» с ссылкой, которая позволяет представить содержимое сайта в виде инфографики на других ресурсах, и это еще один плюс.

А какой из этих двух сайтов вам понравился больше? Который, как вы считаете, имеет лучшую конверсию? Поделитесь своим мнением в комментариях!

Шаблоны по бизнес-нишам: дизайн интерьера

Выводы

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

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

Высоких вам конверсий!

12-10-2016

lpgenerator.ru

Шаблоны сайта Landing Page под дизайн интерьера

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

Чтобы вам было легче ориентироваться по данной нише, рассмотрим три целевых страницы из ТОПа Google — кстати, все рассматриваемые фирмы работают в Санкт-Петербурге. А ближе к концу мы разберем пример тематического landing page от LPgenerator. Приступим.

Лендинги Рунета

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

В сфере дизайн интерьера landing page должен выглядеть как минимум соответствующе — странно, когда оформление страницы сильно хуже, нежели дизайн представленных кейсов.

Чуть ниже главного окна мы находим лид-форму заявки на скидку. Хороший СТА, направляющая взгляд стрелка, таймер отсчета — это если говорить о плюсах.

Минусы очевидны: шрифты, странный цвета, плохо читаемый и слишком длинный заголовок. Возможно, количество полей стоило бы сократить.

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

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

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

Стандартный блок отзывов тоже радует глаз — фотографии живых людей и тексты, внушающие доверие.

Словом, в сфере дизайн интерьера лендинг должен соответствовать примерно такому уровню. Следующий пример также показателен.

Марина Усова, дизайнер из СПб, продвигает свои услуги через посадочную страницу, примерно соответствующую уровню предыдущей.

На главном окне — ничего особенного, все просто и лаконично. Человек опять же сразу понимает, куда попал, благодаря четкому, понятному заголовку и однозначному СТА.

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

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

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

Итак, мы разобрали кейсы, исходя из которых можно разрабатывать собственные шаблоны сайтов дизайн интерьера — объединяя лучшие практики, и разумеется, исключая неудачные ходы. Завершая статью, посмотрим на пример от LPgenerator.

Шаблоны LPstore

Магазин продающих лендингов на данный момент предлагает только одну целевую страницу, подходящую под данную нишу.

Главное окно лаконично, выполнено салатово-фиолетовыми тонами. Внизу можете разместить собственный призыв, ориентируясь на рассмотренные примеры.

Под линией сгиба — обоснование ценности. Здесь можно подробно расписать, чем ваш оффер превосходит предложения конкурентов.

На одной странице расположена лид-форма вместе с доводами обратиться именно в эту студию — кстати, данное окно слегка напоминает второй пример из Рунета.

Завершается посадочная страница блоком отзывов и полем контактных данных. Если вам понравился данный шаблон, можете приобрести его здесь.

Высоких вам конверсий! 

26-08-2015

lpgenerator.ru

Шаблон лендинг пейдж для дизайна интерьера — WEB-EXITO.ru

Отличный шаблон лендинг пейдж для дизайна интерьера.

Дизайн шаблона выполнен в черных, белых и желтых тонах в примерном соотношении: 15% / 75 %/ 10%.

Желтый цвет позволяет выделить важные элементы, на которые стоит обратить внимание посетителям, например на кнопки обратной связи.

Шаблон лендинг пейдж для дизайна интерьера имеет блоки:

1. Шапка сайта имеет наименование сферы бизнеса, чем занимается компания, логотип, номер телефона и email адрес;
2. Главный дескриптор «Качественно, быстро, не дорого», что позволяет увидеть клиенту сразу Ваши преимущества, слайдер с тематическими изображениями и формой захвата с акцией;
3. Далее, нестандартное решение: сразу же после дескриптора разместили блок «Наши работы», где показана фотография дизайна интерьера и наименование. Так же присутствует возможность посмотреть остальные фотки проекта, нажав на кнопку «Смотрите проект»;
4. Следующий блок идет опять с акцией, в виде формы захвата;
5. Затем после идет блок «Почему Ваша компания лучше, чем конкуренты», где описаны Ваши сильные места;
6. Блок «Почему именно Ваша дизайн студия?», где размещены преимущества от «Доступной стоимости» до «Безопасности»;
7. Блок «О компании в цифрах», где расписаны Ваши достижения в цифрах;
8. Следующий блок рассказывает, что включает в себя дизайн-проект и ниже примеры «До, после» в виде фото;
9. Блок «Отзывы Ваших клиентов», где можно разместить видео-отзыв, а так же текстовой отзыв с фото и ФИО клиентов;
10. Блок «Сертификаты и награды»;
11. Далее блок «Схема работы с нами», тут рассказано все от «Замер + Консультация» до «Выполнение ремонта по дизайн проекту»;
12. Блок «Наши партнеры»
13. Подвал сайта выполнен по аналогии с шапкой, но добавлены «Реквизиты».

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

Думаю, что он будет выдавать неплохую конверсию, но только с ПК устройств, т.к. нету мобильной адаптации, что плохо сказывается на привлечении лидов.

Настоятельно рекомендуем при настройке контекста отключить опцию «Показ на мобильных устройствах», дабы не растрачивать Ваш бюджет в пустоту.

Надеемся, Вам понравился данный шаблон Landing Page и он принесет Вам много новых клиентов и большую выручку 🙂

С Уважением к Вам и Вашему бизнесу, команда Web-exito.

web-exito.ru

Дизайн интерьера лендинг | Winlanding

Каждое жилище человека наделено определенным дизайном. Некоторые люди его

создают самостоятельно, а некоторые прибегают к помощи профессионалов. Для того,

чтобы расширить свой бизнес по созданию уникальных интерьеров в различных

помещениях, заявить о себе широким массам населения, лучшим вариантом станет

создание дизайн интерьера лендинг. Landing page – это один видов сайтов, который

состоит всего лишь из одной посадочной странице. Если ранее такую роскошь могли себе

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

человеку.

Вам нужен одностраничник? Существует несколько способов создания сайта-

визитки:

 Самостоятельно. В этом случае человек значительно сберегает денежные средства.

Ему нет необходимости для создания страницы подписки привлекать сторонних

исполнителей и платить за это деньги. Но здесь потребуется хотя бы минимальные

знания одного из самых распространенных языков программирования – html.

Потребуется потратить определенное время, приложить усилия, чтобы разработать

страницу захвата на должном уровне. Мир не стоит на месте и сейчас на просторах

всемирной паутины имеются специальные конструкторы сайтов, которые

позволяют даже школьнику или пенсионеру самостоятельно создать сайт. Но и

здесь возникает немало сложностей с работой целевой страницы. Примеров на

просторах Интернета можно найти достаточно много.

 Можно приобрести готовы сайт у фрилансеров – частных исполнителей. Здесь

придется немного раскошелиться на работу специалиста. Но, перед тем, как

заказать у них сайт, в первую очередь ознакомьтесь с портфолио. Там

расположены уже выполненные работы этим человеком. Если ни одна из

посадочных страниц, созданных фрилансеров Вам не понравилась, то нет смысла

заказывать свой веб-ресурс у них. Даже если Вас все устроит, то создание веб-

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

все работы по созданию одностраничника.

 Купить сайт можно в специализированных компаниях. Здесь над ним будет

трудиться команда профессионалов. Соответственно, по сравнению с

фрилансерами посадочная страница будет создана намного быстрее. Но, вот

денежных средств придется потратить несколько больше. У них же можно

приобрести и шаблон для дизайн интерьера лендинг. Если человек обладает

минимальными познаниями в программировании, то из одного шаблона, в

последствии, может создать десятки или даже сотни сайтов.

В большинстве случаев профессиональные разработчики сайтов визиток

устанавливают их на движок wordpress или joomla. В настоящее время они являются

самыми распространенными.

Однако мало создать свой сайт. Его владельцу потребуется приобрести для своей

страницы захвата хостинг и домен, а это дополнительные деньги. Конечно есть площадки,

которые предлагают размещение сайтов бесплатно, но для дизайн интерьер лендинг – это

непростительная роскошь. Ресурс, вероятнее всего, будет переполнен ненужно

информацией, которую буду размещать владельцы площадки. Все это будет отталкивать

от ресурса посетителей. К тому же продвижение будет весьма затруднительно. Тем более

продвижение одностраничника, по сравнению с многостраничными сайтами отличается.

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

этого практически не пригодны. В связи с этим, чтобы страница захвата вошла в число

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

обратиться к профессионалам, которые знают их. Они смогут за минимальное время

продвинуть посадочную страницу за минимальное количество времени.

С этим товаром берут:

1.  Правки для сайта.

okon-bis.ru

54 примера потрясающего дизайна лендингов

В интернете второго шанса произвести впечатление на посетителя просто нет. Именно поэтому дизайн вашего лендинга чрезвычайно важен. Лендинг — это лицо вашей компании во всемирной паутине; если оно не понравится пользователю, он просто закроет страницу и забудет о вас. Чтобы этого не произошло, предлагаем изучить 54 самых лучших дизайна для лендинг-пейдж.

Электронная коммерцияРазвлекательные сайтыЛендинги-портфолиоРозничная торговляИнтернет-проектыСфера услуг

Электронная коммерция

1. Luhse Tea

Дизайн этой страницы уникален, полностью пропитан индивидуальностью бренда и не похож на другие.

2. Fit For A Frame

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

3. Shop Locket

Простой, но симпатичный дизайн. Плюс в том, что можно войти на сайт через Facebook, не тратя время на регистрацию.

4. White Lotus Aromatics

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

5. Evel

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

6. Lega-lega

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

7. Urban Originals

Фишка этого дизайна — простота. Простое меню и яркий слайдер отлично сочетаются.

8. Scotch & Soda

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

9. Гироскутеры от LPgenerator

Дизайн не перегружен лишними элементами, сразу можно посмотреть все характеристики и цены товара.

Развлекательные сайты

10. Clouds over cuba

Просто и со вкусом. Сразу ясна цель страницы — просмотр документального видео.

11. Universeries

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

12. Jacqui co

Этот сайт выше всех похвал. Блестяще продуманный дизайн и обилие интерактивных элементов никого не оставят равнодушным.

13. Pottermore

В дизайне этой страницы, посвященной франшизе о Гарри Поттере, использованы знакомые фанатам цвета, фразы и имена.

14. Heath Life

Эта страница не только выглядит красиво, она еще и очень функциональна: множество интерактивных элементов, интеграция с Google Maps, использование вкладок.

15. Uncrate

Uncrate и после редизайна не меняет своей традиции расположения всех разделов сайта в удобном верхнем навигационном меню.

16. The good man

Этот сайт демонстрирует всю мощь графического дизайна и веб-разработки. Лучше зайти на него и самостоятельно убедиться в этом.

17. Silktricky

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

18. Magic Leap

Визуальная составляющая этого сайта потрясающая. Яркие образы мгновенно захватывают внимание пользователей.

19. Life and times

Jay-Z точно знает, как нужно развлекаться. На его сайте статьи, изображения и другой контент представлен в виде интерактивных плиток.

20. Yogalife от LPgenerator

В этом дизайне использованы природные оттенки, отлично сочетающиеся с главными вопросами, поднятыми на сайте.

Лендинги-портфолио

21. Hello monday

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

22. Jib

В этом примере очень интересное сочетание цветов. Более того, на странице у всех элементов использована одинаковая структура фонов, под дерево.

23. Ride for the brand

Здесь очень удачно использован «олдскульный» стиль, дизайн каждого элемента продуман до мелочей и уникален. Благодаря бесконечному скроллингу на этом сайте наслаждаться такой красотой можно долго.

24. Andy Patrick design

Понятный и продуманный дизайн помогает странице наиболее эффективно донести главную информацию до посетителей. Цветовая схема соответствует бренду и показывает стиль дизайнера в деле.

25. This is the brigade

Страница представляет собой превосходную презентацию. Каждый баннер посвящен отдельному проекту.

26. Built by buffalo

Пример необычного плиточного дизайна.

27. Galpin

На это странице главную роль играет типографика. Применение различных шрифтов помогает в передаче идей.

28. Made by Vadim

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

29. Art&code

Иконки и ничего лишнего. Хороший пример минималистичного дизайна.

30. Riley Cran

Страница-портфолио отображает самое главное — примеры работ.

Розничная торговля

31. Rei

На странице представлено множество фотографий пользователей, которые с помощью скролла и наведения можно легко листать.

32. Austin beerworks

Большие яркие фотографии товара компании так и вызывают желание выпить баночку холодного пива.

33. Jaquet droz

Ничто не отвлекает посетителя от созерцания прекраснейших часов.

34. Italio kitchen

Изюминка этого сайта — слайдшоу в верхней части страницы, на которой продемонстрированы аппетитные кулинарные шедевры.

35. TV safety

Шрифт и графика отлично сочетаются, создавая единое восприятие сайта. Пунктов меню всего три, и их невозможно не заметить.

36. Grey Goose

Элегантный стиль, качественные изображения, прекрасная презентация. От главных элементов ничего не отвлекает.

37. Toyota

Toyota сделала сайт в стиле Pinterest для любителей Camry. Здесь можно найти множество фотографий, статей, статистики.

38. Got Milk?

Несмотря на то, что эта страница по высоте вписывается в один экран, на ней присутствует много интересных интерактивных элементов и необычных деталей.

39. Buffalo Wild Wings

Дизайн страницы полностью отражает стиль бренда: цвета, шрифты, картинки сразу ассоциируются именно с этой компанией.

40. Подушки для беременных от LPgenerator

Дизайн выполнен в спокойных светлых тонах, такое цветовое решение идеально подходит предлагаемому продукту.

Интернет-проекты

41. Chrome Web Lab

На этой странице использованы потрясающие визуальные эффекты. Вы влюбитесь в многообразие цветов с первого взгляда!

42. Viddy

На этой странице интеграция с Facebook облегчает процесс регистрации и заметно увеличивает количество новых пользователей сервиса.

43. Prezi

Вставка видео на лендинг-пейдж — удачный способ показать ваш товар или услугу в деле.

44. Impress a penguin

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

45. СSS piffle

Плавающая красная кнопка в середине экрана делает свое дело: на нее очень хочется нажать.

46. Fannabee

На этом лендинге при скроллинге используется параллакс-эффект, восхищающий посетителей.

47. Автоматизация ресторана от LPgenerator

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

Сфера услуг

48. Captain Dash

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

49. Woodwork

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

50. Sagmeister walsh

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

51. Madwell NYC

Качественный дизайн страницы говорит о том, что этой компании можно доверять.

52. Ryan Edy

Это страница профессионального фотографа, и ее дизайн помогает нам увидеть самое главное — фотографии. Даже меню спрятано в «гамбургер».

53. Oliver Rassel

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

54. Независимая оценка качества образования от LPgenerator

В этом дизайне от блока к блоку используется единый стиль фона — это создает целостность страницы и облегчает восприятие информации.

Заключение

Мы рассмотрели более 50 абсолютно разных дизайнов, но каждый из них по-своему хорош и грамотно выражает уникальное предложение компании. При разработке лендинг-пейдж очень важно, чтобы страница соответствовала вашему бренду и была интересна вашей целевой аудитории.

Высоких вам конверсий!

По материалам: hubspot.net  

18-06-2016

lpgenerator.ru

Примеры landing page с оригинальным дизайном

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

Дизайн лендинга и хенд-мейд

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

Рукотворные детали придают проекту индивидуальность и транслируют уникальность компании. Живая, немного кривоватая графика, самодельные иконки, типографика — как будто бы детские каракули, акварельные фоны, собранные вместе, эти элементы создают творческую, задорную атмосферу.

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

Но если вы думаете, что только люди искусства могут использовать «hand-made» элементы в дизайне лендинга, то глубоко заблуждаетесь. Посмотрите примеры лендинг пейдж ниже, и вы найдете для себя отличный источник вдохновения.

Тык на картинку, чтобы перейти на лендинг и увидеть его вживую!

Пример лендинга в нише свадьбы

Пример 1. Классический пример лендинга в формате «главная страница». Этот лендинг посвящен свадьбе неких Трейси и Дэни, листая вправо можно подробнее ознакомиться с подробностями размещения, программой мероприятия и т.д.

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

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

Пример лендинга в нише студия дизайна

Пример 2. Первый экран лендинга небольшой, но известной в своем регионе дизайн-студии. И снова формат «главной страницы» со скроллингом вправо. Кстати, формат страницы при желании можно заменить на привычный вертикальный лендинг (нарисованный пластиковый стаканчик с надписью «skinny version»).

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

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

В следующем примере представлен дизайн лендинга агентства, которое занимается SMM:

Пример 3. В дизайне этого лендинга использованы милые дудлы-пузыры (смешные создания, которые улыбаются и ставят лайки).

Несмотря на то, что на этом лендинге всего один слайд с отрисованными элементами, он производит приятное впечатление на посетителей. Рукотворные иллюстрации находятся в нужном месте — на первом экране, они расслабляют (и умиляют) пользователя и провоцируют узнать больше.

Еще один пример дизайна посадочной странице от сербской дизайн студии:

Пример 4 Первый экран сербской дизайн-студии встречает пользователя рисунком, который окрашивается в цвет в зависимости от действий посетителя.

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

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

Пример лендинга в нише веб-дизайн

Пример 5. В качестве примера выбран первый экран посадочной страницы веб-студии с очень приятными векторными иллюстрациями.

Посадочная страница веб-студии AlsterCoud проводит пользователя по всем этапам создания проекта, заодно демонстрируя сильное портфолио. Экскурсия дополняется качественными и тематическими векторными иллюстрациями.

Пример в нише мобильный провайдер

Пример 6 Первый экран лендинга по продаже сим-карт лучше оценивать «вживую». Милые рукописные шрифты и иллюстрации дополнены анимацией.

На этой посадочной странице вы видите игривую комбинацию рукотворных иллюстраций и небольшой анимации, что придает динамику сайту. Создатели не стали ограничивать свой креатив первым экраном — весь сайт отрисован в однородной стилистике.

Пример лендинга в нише дизайн интерьера

Пример 7. Эта посадочная страница не сразу раскрывает свои секреты, но стоит кликнуть на стрелку и вы оказываетесь в милой нарисованной деревне, в которой каждый домик — это детализированный дизайн интерьера спальни.

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

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

Пример лендинга в нише «игры»

Пример 8 Кнопка лендинга предлагает ни много ни мало — «убить всех хипстеров!». Однако оформление сайта доставляет.

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

Пример лендинга в нише алкогольные напитки

Пример 9. Желтый на желтом — не самое лучшее решение, скажете вы? Только не в этом случае! Удачный пример, как можно использовать дизайн этикетки в качестве фона. Так у пользователей не останется шанса не узнать нужное пиво на полке в магазине.

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

Пример 10. Лендинг, рекламирующий новозеландское вино со скроллингом вверх, выполненный в стильной и сдержанной меловой стилистике.

Меловой шрифт отлично сочетается с техникой наброска и шершавым темно-серым фоном. Лендинг действительно очень красивый, читается до конца (если скорость интернета позволяет) и вызывает приятные эмоции.

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

Вывод:

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

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

Есть сферы, в которых качественные иллюстрации являются обязательными: сюда относится все, что связано с творчеством, миром искусства, дизайна и моды.

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

С использованием материалов статьи «Lovely Website Designs with a Hand-Drawn Feel and Awesome Sketchy Illustrations».

convertmonster.ru

Примеры landing page с геометрическим дизайном

Представьте себе ситуацию: клиент хочет заказать лендинг, обязательно flat-дизайн, но с какой-нибудь изюминкой. Да, задача не из легких… Как добавить в простой современный дизайн лендинга что-то новое и оставаться в тренде? Не надо изобретать велосипед: дизайнеры уже придумали готовое решение. Вам остается только взять пару приемчиков на вооружение.

Дизайн landing page под новым углом

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

Эти геометрические формы используются для:

• навигации по сайту;
• акцента на важных блоках;
• нетривиальной подачи контента.

Как вы увидите в примерах посадочных страниц, любой контент, поданный под необычным углом (во всех смыслах), воспринимается свежо и по-новому.

Клик на фото, чтобы посмотреть пример лендинга в оригинале.

Пример лендинга для веб-разработчиков

Этот сайт принадлежит двум коллегам, один — дизайнер, другой — разработчик (многообещающее сочетание!). Дизайн их сайта очень симметричный, ключевой элемент в нем — ромб. Парни отказались от скучных фотографий в кружочках и смотрите, какого эффекта они добились:

Пример 1. Дизайн лендинга для веб-дизайнеров. Ключевой элемент дизайна здесь — ромб.

Пример лендинга в нише «дизайн интерьеров»

Еще один пример «ромбастого» дизайна. Российская компания по озеленению интерьеров использует ромбы с фото в качестве иллюстраций, а с текстом и заливкой в качестве ссылок. Если перейдете непосредственно на сайт — увидите несколько примеров небольшой анимации с ромбом в главных ролях.

Пример 2.  Дизайн лендинга в нише дизайн интерьеров и озеленение. Посмотрите, как удачно скомбинированы иллюстрации и ссылки в виде сгруппированных ромбов.

Пример лендинга в нише «рекламное агентство»

В дизайне следующей посадочной страницы углов становится еще больше — к вашим услугам товарищ пятиугольник! Все фигуры разного размера, с заливкой цветом и без, и дополнены забавными дудликами. Такой лендинг говорит целевой аудитории: «Если вы цените юмор и креативные решения, то добро пожаловать к нам».

Три самых главных элемента в этом дизайне: геометрические фигуры, бирюзовый цвет, отрисованные иллюстрации.

А если вы откроете этот сайт, то в качестве бонуса увидите ненавязчивую анимацию.

Пример 3. Лендинг в нише «рекламное агентство». Посмотрите, как сочетаются геометрические фигуры, всеми любимый бирюзовый цвет и рукотворные дудлики.

Пример лендинга в нише «мобильные приложения»

Следующий пример встречает пользователя огромной галочкой. V-элементы продумано «раскиданы» по всему лендингу. В сочетании с мягкими пастельными ретро-иллюстрациями они придают посадочной странице завершенный вид.

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

Пример 4. Дизайн лендинга в нише «мобильные приложения». Этот пример — правильный ответ на вопрос, как сочетать ретро-иллюстрацию и геометрические формы.

Пример лендинга в нише «интернет-магазин»

Удачный пример посадочной страницы для интернет-магазина. Посмотрите, как удачно здесь сочетается графика логотипа и геометрические элементы в дизайне сайта. Плюс к этому, угол, направленный вниз, привлекает пользователя к основному призыву к действию — «стать дистрибьютором».

Пример 5. Пример лендинга в нише «интернет-магазин». Удачное сочетание графики на этикетке продукта и элементов веб-дизайна.

Пример лендинга-портфолио работ

Пчелы, мёд, пыльца… Как это связано с геометрическим дизайном, спросите вы? Очень просто! Ведь один из самых популярных элементов — это соты, или шестигранники. Отлично подходит, если нужно разнообразить подачу однообразного контента (например, в портфолио работ). За примером вам не придется далеко ходить:

Пример 6. Пример лендинга-портфолио. Форма шестигранника придает подборке фотографий свежий вид и помогает разнообразить его (часть фигур — это работы, часть — ссылки).

Пример лендинга с диагональными элементами

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

Либо просто разнообразить подачу контента. Посмотрите пример. Вы увидите как оригинальную подачу портфолио, так и самую классическую дизайнерскую ошибку:

Пример 7. Пример лендинга с диагональными элементами. Они освежают дизайн и облегчают пользователю восприятие однообразного контента.

Заметили, в чем ошибка? Посмотрите на тонкий белый шрифт на черном фоне и на его мелкого брата-близнеца в пояснении к каталогу. Это минус сто к юзабилити: текст не читается и рябит в глазах.

Можно сделать простой вывод: какие бы трендовые элементы вы не использовали, следите за восприятием сайта в целом. Все элементы (шрифт, фон, геометрические формы, цвет, композиция, контент и т.д.) должны работать в комплексе.

Дизайн лендинга и геометрия: классика или уходящий тренд?

Геометрический веб-дизайн выглядит современно и стильно, хотя находится на пике популярности уже четвертый год. Причина понятна: простые, с детства привычные элементы, позволяют организовать контент, не перегружая посадочную страницу. И заострить внимание на важных деталях. Поэтому геометрия столь любима дизайнерами всего мира.

Как вы считаете, сколько еще геометрические формы будут оставаться в топе? Это классика или тенденция, которая скоро уступит место чему-то новому?

Жду ваши идеи в комментариях!

convertmonster.ru

Смотрите также

• 
  Логотип дизайн интерьера
• 
  Дизайн интерьера логотип
• 
  Дизайн интерьера ландшафта
• 
  Европейский дизайн интерьера
• 
  Дизайн ландшафта интерьера
• 
  Фирма интерьер дизайн
• 
  Дизайн интерьера вакансии
• 
  Вакансии дизайн интерьера
• 
  Дизайн интерьера основы
• 
  Кафе дизайн интерьеров
• 
  Школы дизайн интерьера