Лендинг інвестиційної компанії
Про проєкт
Insight Business Club — лендинг міжнародного товариства для бізнесу та інвестицій. Основним завданням нашої команди було створення індивідуального дизайну під ключ, враховуючи побажання замовника. Ставка робилася на великі блоки у вигляді слайдів, плавну анімацію переходів та єдність кольорової гами.
Дизайн
Працюючи над цим лендингом у пріоритеті була не функціональність, а винятковий дизайн. Перший вайрфрейм (зразок дизайну низької точності) своєю структурою нагадував стандартний лендинг, але після погодження з клієнтом ми вирішили уникнути звичних рішень. Замість використання стандартних шаблонів ми змалювали індивідуальний дизайн під ключ.
На першому «слайді» вгорі розташоване меню навігації, яке допоможе одразу перейти у потрібний розділ сайту. У наступних розділах навігація прихована праворуч нагорі, за кнопкою «гамбургер-меню».
В оформленні сайту використовують поєднання синього фону з білим текстом, всі розділи витримані в єдиній стилістиці. Оскільки лендинг виконаний в мінімалістичному стилі, деякі тексти приховані за каруселлю або списками, що розкриваються.
Чому було обрано WordPress
Зазвичай при створенні лендингу найкращим варіантом є розробка на чистому коді, а конструктори сайтів або платформи WordPress переважно використовують для швидкого запуску. Але в цьому випадку клієнт мав ще два додаткові запити:
- Можливість масштабування. Згодом при розширенні спільноти інвесторів передбачається можливість додати на сайт особистий кабінет користувача, блог та інші додаткові можливості.
- Можливість самостійного редагування. При використанні WordPress будь-який текстовий блок або зображення змінюються з адмінки сайту навіть без спеціальних навичок. На чистому коді це було б проблематично.
Мультимовність
Сайт доступний двома мовами: англійською та російською. Основна версія завантажується англійською мовою, але поруч із «гамбургер-меню» є перемикач мов, що дозволяє перейти на російську версію. Всі шрифти, що використовуються, адаптовані до кирилиці: текст виглядає так само добре, як і в англійській версії.
Мультимовність реалізована через використання плагіну WordPress, що дозволяє обслуговувати різні мовні версії сайту в одній адміністративній панелі.
Адаптивність
Це завдання зайняло у нас досить багато часу через стилістику презентації та відмальований під десктопи дизайну. Однак немає нездійсненних завдань.
Сайт повністю адаптивний та коректно відображається на всіх пристроях. На смартфонах він виглядає трохи інакше через вертикальний формат і розмір їх екранів. Тут ми відмовилися від подачі у вигляді презентації: звичайний скролінг на такому екрані набагато доречніший і зручніший, а блоки перебудовуються для зручного читання.
Підсумки
Сайт Insight Business Club — приклад виняткового лендингу з індивідуальним дизайном. Завдяки нестандартній подачі, плавним анімаціям і можливості подальшого розширення він повністю виконує поставлені замовником завдання.
О проекте
Insight Business Club — лендинг международного сообщества для бизнеса и инвестиций. Основной задачей нашей команды было создание индивидуального дизайна под ключ, с учётом пожеланий заказчика. Ставка делалась на крупные блоки в виде слайдов, плавную анимацию переходов и единство цветовой гаммы.
Дизайн
При работе над этим лендингом главным приоритетом была не функциональность, а впечатляющий дизайн. Первый вайрфрейм (образец дизайна низкой точности) своей структурой напоминал стандартный лендинг, но после согласования с клиентом мы решили уйти от привычных решений. Вместо использования стандартных шаблонов мы отрисовали индивидуальный дизайн под ключ.
Финальное решение выполнено в стиле презентации: вместо традиционного скроллинга страницы посетитель видит подобие смены слайдов. Все элементы динамичны и анимируются при появлении: изображения и описания «выезжают» с двух сторон, обеспечивая wow-эффект. Каждый раздел, каждый «слайд» автоматически подстраивается под размер экрана, заполняя собой всё имеющееся пространство.
На первом «слайде» вверху расположено меню навигации, которое поможет сразу перейти в нужный раздел сайта. В последующих разделах навигация скрыта справа вверху, за кнопкой «гамбургер-меню».
В оформлении сайта используется сочетание синего фона с белым текстом, все разделы выдержаны в единой стилистике. Так как лендинг выполнен в минималистичном стиле, некоторые тексты скрыты за каруселью или раскрывающимися списками.
Форма захвата, использующаяся в нескольких местах, также имеет минималистичное оформление и чёрно-белую стилистику.
Почему был выбран WordPress
Обычно при создании лендинга наилучшим вариантом является разработка на чистом коде, а конструкторы сайтов или платформы вроде WordPress преимущественно используют для быстрого запуска. Но в этом случае у клиента было ещё два дополнительных запроса:
- Возможность масштабирования. Со временем при расширении сообщества инвесторов предполагается возможность добавить на сайт личный кабинет пользователя, блог и другие дополнительные возможности.
- Возможность самостоятельного редактирования. При использовании WordPress любой текстовый блок или картинка меняются из админки сайта даже без специальных навыков. На чистом коде это было бы проблематично.
Мультиязычность
Сайт доступен на двух языках: английском и русском. Основная версия загружается на английском языке, но рядом с «гамбургер-меню» есть переключатель языков, позволяющий перейти на русскую версию. Все используемые шрифты адаптированы к кириллице: текст выглядит так же хорошо, как и в английской версии.
Мультиязычность реализована через использование плагина WordPress, что позволяет обслуживать разные языковые версии сайта в одной административной панели.
Адаптивность
Эта задача заняла у нас довольно большое количество времени из-за стилистики презентации и отрисованного под десктопы дизайна. Однако нет невыполнимых задач.
Сайт полностью адаптивен и корректно отображается на всех устройствах. На смартфонах он выглядит немного иначе в силу вертикального формата и размера их экранов. Здесь мы отказались от подачи в виде презентации: обычный скроллинг на таком экране куда уместнее и удобнее, а блоки перестраиваются для удобного чтения.
Итоги
Сайт Insight Business Club — пример впечатляющего лендинга с индивидуальным дизайном. Благодаря нестандартной подаче, плавным анимациям и возможности дальнейшего расширения он полностью выполняет поставленные заказчиком задачи.
Комментарии