Умное приложение для Умного Дома. OneHome — дизайн-кейс с хакатона

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

Умное приложение для Умного Дома. OneHome — дизайн-кейс с хакатона

Темы проектов на Хакатоне

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

  • Нейрокейсы — сделать проект с нейросетями, например Реализовать Чат Бот, который на основе написаных вами продуктами и ингридиентами выдаст вам подборку рецептов блюд для приготовления.
  • Финансовая Биржа — придумать сайт/приложение для биржы, с новостями из мира финансов, подборка акций и тд
  • Яндекс Кейсы — кейсы предоставленные компанией Яндекс, что мы в итоге и выбрали.
Умное приложение для Умного Дома. OneHome — дизайн-кейс с хакатона

Кейс Яндекса — тема 22

Системы умного дома. Участники создадут приложение, использующие Яндекс-карты, чтобы помочь пользователям отслеживать и контролировать свои системы умного дома и автоматизировать рутинные задачи.

Из ТЗ Хакатона
Умное приложение для Умного Дома. OneHome — дизайн-кейс с хакатона

После выбора темы у нас была неделя на реализацию проекта.

Начало работы

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

Что такое Умный Дом?

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

Изучение конкурентов

Перед проектированием дизайна нашего приложения наша команда решила проанализировать похожие проекты на рынке. Мы выделили 3 главных

Умный дом c Алисой

Логотип приложения Умный Дом с Алисой
Логотип приложения Умный Дом с Алисой

Основные функции

  • Можно подключать разные устройства
  • Голосовой ассистент Алиса
  • Есть сценарии действий

Умный дом. ru

Логотип приложения Дом.ру
Логотип приложения Дом.ру

Основные функции

  • Можно подключать разные устройства
  • Управление камерами в доме
  • Диктофон и видеозапись с камер дома

Mi Home

Логотип приложения Mi Home
Логотип приложения Mi Home

Основные функции

  • Можно подключать разные устройства
  • Управление камерами в доме
  • Облачное хранилище видезаписей

Проектирование дизайна

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

Скетчи

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

Умное приложение для Умного Дома. OneHome — дизайн-кейс с хакатона

Но, потом я предложил другой вариант с более упрощённым UX.

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

Умное приложение для Умного Дома. OneHome — дизайн-кейс с хакатона

Финальный дизайн

Вот, что получилось в итоге

Умное приложение для Умного Дома. OneHome — дизайн-кейс с хакатона

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

Умное приложение для Умного Дома. OneHome — дизайн-кейс с хакатона

Остаётся лишь вопрос — как добавить новые устройства и комнаты?

Как добавлять новые устройства или комнаты? — Экран Добавления

Процесс добавления начинается из навигационной панели

Умное приложение для Умного Дома. OneHome — дизайн-кейс с хакатона

Экраны Добавления

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

Процесс добавления нового человека

Умное приложение для Умного Дома. OneHome — дизайн-кейс с хакатона

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

Процесс добавления нового дома

Умное приложение для Умного Дома. OneHome — дизайн-кейс с хакатона

После завершения работы над главным экраном мы стали думать, как можно интегрировать Яндекс Карты.

Суть идеи

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

А с помощью Яндекс Карты можно отслеживать, где они находятся. Помимо устройств можно будет отслеживать и членов своего дома.

Реализация Идеи — Экран Карты и Экран Пользователя

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

Экран Ваших Устройств

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

Экран Ваших Членов Семьи

Умное приложение для Умного Дома. OneHome — дизайн-кейс с хакатона

Завершение

Умное приложение для Умного Дома. OneHome — дизайн-кейс с хакатона

Это был первый хакатон, и он запомниться мне на долго. Такие соревнования действительно полезны для IT-специалистов, особенно для новичков. Так что я буду участвовать в них чаще и соответственно старатся публиковать кейсы, если посчитаю их интересными. Если вам понравился проект, то не забудьте поставить лайк под кейсом и подписаться на мой блог на VC.RU 👨‍💻 если ещё вдруг этого не сделали

А также на мои социальные сети 👇

Туда я буду выкладывать информацию о OneHome и других проектах

Можете также подписаться на мой Dprofile, туда я скоро выложу дизайн кейс этого проекта 🙌

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

До новых встреч!

22
2 комментария

Огромное спасибо моей команде, вы лучшие 🥳👍🙌

У меня есть своя реализация приложения для умного дома с несколькими продажами в офисах, не в СНГ. Могу цеплять к нему чужие или делать свои датчики. Как ее продвигать в одиночку не особо понятно. Если кому то интересно партнерство то можно обсудить. Дизайнера в приложении не было.