Лаконичный сайт для стартапа в сфере градостроительного документооборота

Вводные

Задача

Ольга Морозова, основатель стартапа «ИОГВ», обратилась к нам ещё до того, как придумала название и выявила УТП. Поэтому разработка сайта заняла больше времени, чем обычно. Главные вводные, которые мы получили на старте — сайт должен был получиться не перегруженным излишней анимацией и эклектичным дизайном.

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

Результат:

UPD: на 2024г. стартап закрыт

Цвета

Палитра

Элементы

Не имея ни логотипа, ни брендбука, мы были вынуждены опрашивать фокус-группу, чтобы выяснить: предпочтительны оттенки синего.

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

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

Приглушенный сине-голубой

#2274a5

#809BCE

#235789

Пастельный лавандовый

Полуночный синий

Иллюстрации

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

Дело в том, что на этой площади расположены все профильные комитеты, связанные с услугами «ИОГВ». Мы взяли самый узнаваемый ракурс и принялись за работу.
Стилистика иллюстраций — выбор заказчика.

Вёрстка

Разработка

Типографика

Сайт выполнен в Zero Block с использованием одного стандартного блока DV12 (фигурная граница). Шрифт — Opinion Pro.

Сайт создан с учётом воронки CDJ от McKinsey, которая применена ко всем контентным, не техническим страницам. Решения в вёрстке во многом продиктованы требованиями заказчика. Помимо прочего, мы создали кастомную страницу 404 и заанимировали все элементы сайта базовой анимацией Tilda. К сайту подключили Tilda CRM и Яндекс.Метрику, настроили формы приёма заявок с отбивкой на email, а также создали почту на домене.

Десктоп

Заголовки:
40px, blod
spacing 1.5; 0

Основной текст:
17px, normal
spacing 1.1; 0

Заголовки:
35px, blod
spacing 1.5; 0

Основной текст:
17px, normal
spacing 1.1; 0

Планшет

Телефон

Заголовки:
30px, blod
spacing 1.5; 0

Основной текст:
16px, normal
spacing 1.1; 0

Результат

Планшет, сетка

8 колонок, колонки — 60px, межколонник — 10px, отступы по краям — 30px

4 колонки, колонки — 60px, межколонник — 10px, отступы по краям — 20px

Телефон, сетка

12 колонок, колонки — 88px, межколонник — 10px, отступы по краям — 30px

Десктоп, сетка

Хотите так же?

Создаём сайты на Tilda Publishing в Zero Blok, используем код, благодаря чему реализуем уникальные дизайнерские решения любой сложности. В основе нашей философии сайтостроения — маркетинг и UI/UX архитектура.

Отрасли экспертизы:

Промышленность

Образование

Доставка

Мебель

HoReCa

Одежда

Туризм

Beauty

Retail

Титры

Марфа Аршинова

Иллюстратор

Анна Величко

Дизайнер на Tilda

Варвара Петрова

Копирайтер

Виктор Глухов

Аккаунт-менеджер

Кейс опубликован: 03 февраля 2020 г.
Кейс обновлён: 21 декабря 2024 г.