Вебсайт, который предоставляет полезные ресурсы и информацию для жителей обслуживаемых домов. Данный вебсайт был сделан в качестве редизайна существующего сайта.
Новый дизайн сайта для домоуправляющей компании, который обеспечит улучшенный пользовательский опыт и более удобный доступ к важной информации. Мы обновить интерфейс, упростить навигацию и улучшить и функциональность сайта, чтобы жители могли легко находить необходимую информацию об услугах, тарифах и обслуживании
- Общение с заказчиком и сбор информации для определения списка задач
- Анализ целевой аудитории
- Создание визуальной концепции
- Создание графических элементов
- Создание макетов страниц сайта
- Финальный дизайн
Проблема:
Директор домоуправляющей компании пришел ко мне с запросом на редизайн, так как его жители при использовании сайта жаловались на следующие всплывающие недостатки:
Директор домоуправляющей компании пришел ко мне с запросом на редизайн, так как его жители при использовании сайта жаловались на следующие всплывающие недостатки:
- Непонятная навигация: Сайт был плохо спроектирован и навигация запутана, это затрудняло жителей в поиске необходимой информации, услуг и контактов.
- Отсутствие службы поддержки: Сайт не предоставлял формы для обращения жителей, это создавало неудобства и затрудняло взаимодействие с домоуправляющей компанией.
- Отсутствие мобильной версии: Многим жителям было бы удобно отслеживать объявления через телефон.
- Отсутствие админ части: Сотрудники компании постоянно обращались к разработчикам, чтобы обновлять информацию. Из-за этого на вебсайте чаще всего была неактуальная информация, так как веб команда не всегда обновляла контент.
Сложности
При создании дизайна для сервиса, где люди могут оставлять свои истории с собеседований, дизайн-команда столкнулась с несколькими сложностями:
При создании дизайна для сервиса, где люди могут оставлять свои истории с собеседований, дизайн-команда столкнулась с несколькими сложностями:
- Удобство пользования: Веб-сайт должен быть удобным в использовании для всех типов пользователей, включая пожилых людей и людей с ограниченными навыками работы с компьютером. Это может потребовать более детального анализа потребностей аудитории и соответствующего дизайна интерфейса.
- Адаптивность под разные устройства: Современные веб-сайты должны быть адаптивными и обеспечивать удобное отображение на различных устройствах, включая мобильные устройства. Это требует дополнительной работы по созданию адаптивного дизайна.
- Обновление контента: Редизайн сайта также может потребовать обновления и пересмотра всего контента, что может быть трудоемким процессом, особенно если компания предоставляет множество услуг или имеет обширное портфолио объектов управления.
Дизайн Процесс
Процесс дизайна при редизайне сайта домоуправляющей компании включал следующие этапы:
Сбор информации: Били провести встречи с представителями компании, чтобы выявить их потребности, ожидания и бизнес-цели. Также я изучала уже существующий сайт и собирала всю доступную информацию, такую как статистика посещаемости, обратная связь пользователей, аналитические данные и т.
Анализ целевой аудитории: Необходимо было определить целевую аудиторию компании и их потребности, чтобы разработать дизайн сайта, который будет удовлетворять их ожиданиям и предпочтениям.
Создание визуальной концепции: Далее я разрабатывала визуальные концепции, которые включают в себя цветовую палитру, шрифты, макеты и общий стиль, соответствующий бренду компании.
Затем я создавала графические элементы, интерфейсы и другие дизайн-элементы, которые будут взаимодействовать с пользователем на сайте.
Важно поддерживать открытую коммуникацию с заказчиком на каждом этапе процесса, чтобы удостовериться, что новый дизайн полностью соответствует ожиданиям и целям компании.
Процесс дизайна при редизайне сайта домоуправляющей компании включал следующие этапы:
Сбор информации: Били провести встречи с представителями компании, чтобы выявить их потребности, ожидания и бизнес-цели. Также я изучала уже существующий сайт и собирала всю доступную информацию, такую как статистика посещаемости, обратная связь пользователей, аналитические данные и т.
Анализ целевой аудитории: Необходимо было определить целевую аудиторию компании и их потребности, чтобы разработать дизайн сайта, который будет удовлетворять их ожиданиям и предпочтениям.
Создание визуальной концепции: Далее я разрабатывала визуальные концепции, которые включают в себя цветовую палитру, шрифты, макеты и общий стиль, соответствующий бренду компании.
Затем я создавала графические элементы, интерфейсы и другие дизайн-элементы, которые будут взаимодействовать с пользователем на сайте.
Важно поддерживать открытую коммуникацию с заказчиком на каждом этапе процесса, чтобы удостовериться, что новый дизайн полностью соответствует ожиданиям и целям компании.
Сформулированный план сайта
После нескольких встреч с заказчиком и обсуждений пожеланий и предпочтений, был сформулирован схематичный план вебсайта, который хотел бы получить в итоге директор компании. Он включает в себя основные страницы и пожелания по навигации между ними, так как основной проблемой старой версии сайта была неудобная навигация между разделами вебсайта.
После нескольких встреч с заказчиком и обсуждений пожеланий и предпочтений, был сформулирован схематичный план вебсайта, который хотел бы получить в итоге директор компании. Он включает в себя основные страницы и пожелания по навигации между ними, так как основной проблемой старой версии сайта была неудобная навигация между разделами вебсайта.
Анализ конкурентов
Для того, чтобы понять, как именно структурировать вебсайт, было необходимо провести анализ конкурентноспособных компаний. Что было сделано на данном этапе:
Референсы после анализа конкурентов
Для того, чтобы понять, как именно структурировать вебсайт, было необходимо провести анализ конкурентноспособных компаний. Что было сделано на данном этапе:
- Идентификация конкурентов: Я начала с идентификации основных конкурентов домоуправляющей компании. Это были управляющие компании недвижимостью, предоставляющие аналогичные услуги.
- Анализ визуальной идентичности: Я изучила дизайн и визуальный стиль веб-сайтов главных конкурентов. Это включает в себя оценку цветовой палитры, типографики, использование изображений и общего визуального впечатления.
- Исследование пользовательского опыта: Я анализировала структуру и навигацию веб-сайтов конкурентов. также оценивала удобство использования, легкость поиска необходимой информации, понятность структуры и т.д.
Референсы после анализа конкурентов
Схематичный User Flow
Для обозначения схемы вебсайта был создан несложный user flow. Получилось просто и доступно, чтобы заказчик смог оценить или поправить схему.
Для обозначения схемы вебсайта был создан несложный user flow. Получилось просто и доступно, чтобы заказчик смог оценить или поправить схему.
UI Kit
UI Kit - это набор готовых компонентов, шаблонов и элементов дизайна, который упрощает процесс создания пользовательского интерфейса для создаваемого веб-сервиса.
Он включает в себя такие элементы, как кнопки, формы, иконки, навигационные панели, типографика и многое другое, что позволяет быстро и эффективно разрабатывать интерфейс.
При его создании мы ориентировались на бренд компании, элементы, которые будут использоваться, все состояния созданных компонентов. Для интерактивного прототипа связи между состояниями компонентов закладывались в вариантах компонентов.
Данный UI Kit не особо обширный, так как функционал сайта предельно примитивен.
UI Kit - это набор готовых компонентов, шаблонов и элементов дизайна, который упрощает процесс создания пользовательского интерфейса для создаваемого веб-сервиса.
Он включает в себя такие элементы, как кнопки, формы, иконки, навигационные панели, типографика и многое другое, что позволяет быстро и эффективно разрабатывать интерфейс.
При его создании мы ориентировались на бренд компании, элементы, которые будут использоваться, все состояния созданных компонентов. Для интерактивного прототипа связи между состояниями компонентов закладывались в вариантах компонентов.
Данный UI Kit не особо обширный, так как функционал сайта предельно примитивен.
Инструкция
Для пользования админ панелью было необходимо предоставить инструкцию пользования админ-частью. С данной инструкцией можно ознакомиться по ссылке: Инструкция для админ-панели вебсайта БНС НАГОРНЫЙ
Для пользования админ панелью было необходимо предоставить инструкцию пользования админ-частью. С данной инструкцией можно ознакомиться по ссылке: Инструкция для админ-панели вебсайта БНС НАГОРНЫЙ
Инструкция
✅ Данный проект научил меня всегда уточнять все вопросы с веб командой, а также внимательнее прорабатывать корнер кейсы, эррор стейты и подготовку иллюстраций и фонов для экспорта. Также я осознала, насколько важно тесно взаимодействовать с заказчиком, уточнять аудиторию пользователей, нужды компании и цели продукта.
✅ Данный проект научил меня всегда уточнять все вопросы с веб командой, а также внимательнее прорабатывать корнер кейсы, эррор стейты и подготовку иллюстраций и фонов для экспорта. Также я осознала, насколько важно тесно взаимодействовать с заказчиком, уточнять аудиторию пользователей, нужды компании и цели продукта.
🙌🏻 Спасибо за внимание!
МОИ КОНТАКТЫ
dianapostcard@gmail.com
+7 965 119 05 10
+7 965 119 05 10
