UX/UI — Докучаев Константин,
Гусенко Алексей

Uralmedias, 2020

МБФ

&Синай-групп

Группа компаний застройщиков в Магнитогорске.

  • Исследование
  • Проектирование
  • Дизайн

Рендеры: ALASI/Синай

Презентация дизайна

Перейти на сайт

Задача:

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

Инструменты

  • Figma
  • Xmind
  • Design thinking

О заказчике

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

mbf

Упрощенная структура проекта

Главная

  • Проекты
  • Вторичное жилье
  • Ход строительства
  • Способы оплаты
  • О компании
  • Новости
  • Контакты

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

Полная структура для самых любознательных

Прототипирование

Поиск и создание концепции

Первый вариант

mbf mbf

Второй вариант

mbf mbf

Третий вариант

mbf mbf

Итог

Утвержден первый вариант концепции.
Реализуем остальные страницы.

mbf

Подготовка

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

20px

mbf
mbf
#FFFFFF
#FAFAFA
#40424C
#1E202C
#D8BB54
#FFF4CF

Header

Inter - 50px, line-height 108%, letter spacing 1px

Header 1

Inter - 40px, line-height 120%, letter spacing 1px

Header 2

Inter - 30px, line-height 108%, letter spacing 1px

Header 3

Inter - 30px, line-height 108%, letter spacing 1px

Header 3

Inter - 26px, line-height 108%, letter spacing 1px

Header 4

Description

Inter - 20px, line-height 130%

Description 1

Inter - 18px, line-height 160%, letter spacing 0.3px

Description 1

Inter - 16px, line-height 160%, letter spacing 0.3px

Description 1

Inter - 12px, line-height 160%, letter spacing 0.3px

Description 1

Buttons

Inter - 18px, line-height 30рх, letter spacing 0.3px

Description 1

Inter - 14px, line-height 30рх, letter spacing 0.3px

Description 1

#FFFFFF
#FAFAFA
#40424C
#1E202C
#D8BB54
#FFF4CF

Реализация

Карточка объекта

mbf

Фильтр квартир

mbf

Внутренняя карточка квартиры

mbf
+ 11 фреймов адаптива

для сложных страниц проекта

Проекты

mbf

Фильтр квартир

mbf

Этажи планировка

mbf

Внутренняя карточка квартиры

mbf
mbf
mbf
mbf
mbf
mbf

Адаптив

Сбор других версий делался под два разрешения:
смартфоны и планшеты.

320/768рх

Заключительный этап

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

mbfmbf

Оформление сообщества

Помимо сайта для застройщика, еще был запрос на дизайн соц.сетей для самого ГК «Синай».

Главная
mbf
Посты
mbf
mbf
Шапки
mbf
mbf
mbf
mbf
mbf

Увеличивайте прибыль вместе с нами

Проведем анализ показателей, выявим точки роста для увеличения рентабельности.
Заказать проект
Заказать проект
Время покорять новые вершины!
Нажимая кнопку “Заказать проект”, вы принимаете условия пользовательского соглашения
Ваше сообщение отправлено!
В ближайшее время наш менеджер свяжется с Вами.