Русский
Русский
English
Статистика
Реклама

User experience

Впихнуть невпихуемое

13.08.2020 18:07:06 | Автор: admin
На данный момент мобильные телефоны всё чаще используются не только для потребления контента, но и для создания.
И перед разработчиками встаёт и вопрос как разместить интерфейс большого приложения на маленьком экранчике мобильника?

image

Под катом рассказ о решении проблемы сложного интерфейса для музыкальных приложений. Приложение делалось для платформы VK Mini Apps, но, возможно, общие принципы подойдут и для других платфом.



История интерфейсов музыкальных редакторов



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

UI обычно выглядит так:

image

Сами принципы UX/UI для мызыкальных программ не менялись много лет. Вот так они выглядели 30 лет назад:

image

по сути, добавилось больше цветов и кнопок.

Как развивались мобильные интерфейсы?

По стандартному экстенсивному пути.
Брался интерфейс десктопного приложения и уменьшался в размерах, а функционал безжалостно обрезался.

Вот пример мобильной версии FL Studio (эта одна из лучших DAW):

image

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

Трудности переноса интерфейса на маленькие экраны

Чтоб была понятней глубина проблемы, рассмотрим обычный 10-полосный эквалайзер.

Большинство используют его даже не зная что это такое. Например, вот эквалайзер встроенный в сервис Яндекс Музыка:

image

для удобного нажатия пальцем кнопки и скроллбары должны быть не менее 1см размером. В эквалайзере 10 скроллбаров, т.е. его общая ширина должна быть 10см.

Но это больше чем ширина мобильных телефонов! И это только один контрол из многих.

Получается что нужно либо делать всё мелкое и неудобно для нажатия, либо делать видимым только небольшую часть контролов, а остальные выбросить или спрятать в выпадающие меню и т.п.

Поиск решения



Существуют ли подходы, помогающие делать комплексные, но удобные интерфейсы для небольших экранов?

Конечно.

Это карты. Причём не только в мобильниках, но и на десктопе.

image

Карты используют масштаб и слои видимости для элементов. Показывают миллионы интерактивных объетов на маленьком экранчике.

Большинство пользуется ими интуитивно, что подтверждает полезность такого подохода к UX/UI.

Пример решения



Было принято решение расположить треки слоями длуг над другом и добавить масштабирование всего пианоролла вместе с контролами.

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

image


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

Проект из видео можно открыть во ВКонтакте чтоб протестировать:
открыть в приложении.
работает и на телефонах, и внутри сообщений ленты ВКонтакте

Итого
применения подхода с масштабированием UI позволило разместить большое количество элементов на маленьком экране.

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

Объектно-ориентированный дизайн икак его использовать для проектирования систем

05.12.2020 20:19:25 | Автор: admin

Стех пор как интерфейсы программ, приложений исайтов стали сложными, среди дизайнеров началось хаотичное деление наузкие специальности: появились системные ибизнес-аналитики, UX-дизайнеры, UI-дизайнеры, проектировщики ипрототипировщики.

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

Впоследние годы эти области начали сближаться. Проектирование соприкасается сдизайном, адизайн сверсткой. Вэтом помогают, кпримеру, дизайн-системы, storybookи, созданные поправилам разработки интерфейсов, атакже современные инструменты: Figma, Sketch, InVision Studio идругие.

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

Мой подход основан на OOUX Софии В. Пратер (http://personeltest.ru/aways/alistapart.com/article/object-oriented-ux/), но дополняет и расширяет его, основываясь на моем опыте применения.

Зачем нужен ООД

Объектно-ориентированный дизайн (ООД) это методика проектирования, точка, вкоторой вовремя работы над продуктом сходятся все члены команды: дизайнеры, проектировщики, разработчики, SEO-специалисты икопирайтеры. Вэтом случае под дизайном японимаю нестолько внешний вид системы, сколько то, как она работает.

ООД помогает команде решить несколько важных задач.

Определиться, с чего начать

Вопрос Счего начать? возникает даже усамых опытных. Допустим, вам нужно разработать мобильное приложение подоставке котиков. Что высделаете впервую очередь? Можно начать рисовать экраны или продумывать структуру, аможно проектировать сущности.

Какие сущности есть втаком приложении? Наверняка там будут пользователь, заказ икотик. У пользователя есть имя ифамилия, азаказ можно сделать издвух мест: сэкрана товара или сэкрана сосписком ранее оформленных заказов. Значит позже нужно подумать, как отразить это винтерфейсе.

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

Сэкономить

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

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

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

Создать MVP

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

Вработе состартапами ООД помогает разобраться, что является MVP (минимально ценностным продуктом) проекта ивпервую очередь сделать только то, что действительно нужно.

MVP это продукт, который стоит максимально дешево, ноуже может приносить пользу конечным пользователям.

Пример очень бюджетного MVP стартап попродаже обуви Zappos, который невероятно взлетел, привлек много инвестиций ипревратился всуперсервис. Новсамом начале уего основателя Ника Свинмерна небыло ничего, кроме совсем простого сайта. Онразмещал там фотографии обуви изместных магазинов, чтобы понять, естьли нанее спрос. Когда кто-то делал заказ, Ник покупал эту пару ипривозил клиенту. Свинмерн невкладывался винфраструктуру иоборудование, носмог создать уклиентов иллюзию полноценного сервиса исминимальными затратами проверил, востребованли его продукт.

Исключить хаотичные скачки

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

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

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

С чего начинается ООД. Составляем карту объектов

Главная единица ООД объект. Этим термином яназываю логически выделенную часть системы, скоторой можно взаимодействовать иобмениваться сообщениями. Каждый объект это сущность созначимыми параметрами, которой можно управлять через административную панель.

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

1. Выявляем объекты

Сначала нужно найти все объекты, которые встречаются всистеме. Это можно делать спомощью пользовательских историй, яприменяю именно такой вариант.

Выявляем все объекты, которые встречаются в системе.Выявляем все объекты, которые встречаются в системе.

Допустим, мыделаем программу для управления кадрами (HR). Вней HR-менеджер должен иметь возможность выгрузить список всех транзакций попокупкам вакансий наhh.ru, чтобы подготовить месячный отчет.

Здесь можно выделить объекты пользователь (сподтипом HR-менеджер), транзакция ивакансия. С вакансией итранзакцией определиться легко: они точно являются объектами, скоторыми проводятся операции всистеме.

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

Может оказаться, что HR-менеджер заходит втекущую программу, выгружает сырые данные отранзакциях вExcel, апотом идет в1С иуже вэтой системе составляет отчет привычным для себя образом. Втекущем бизнес процессе возможность создавать отчет впроектируемой вами системе ему ненужна: ваша задача вновой системе дать возможность HR-менеджеру выгрузить список транзакций инеболее.

Втаком случае проектировщику нужно проанализировать: если сделать объект отчет частью новой системы, будетли достигнут такой эффект, что это оправдает новые инвестиции? Или нестоит тратить наэто время иограничиться текущей реализацией.

2. Определяем параметры объекта и связи

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

Параметры для объекта вакансияПараметры для объекта вакансия

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

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

Например, обсуждая сценарии отправки резюме навакансию, мыпоняли, что многие соискатели могут непонимать реальный уровень своих навыков. Особенно это актуально для разработчикаПО: укаждой компании свои грейды, возможно, именно вэтой организации онпока недотягивает достатуса Junior или, наоборот, почти дорос доMiddle. Поэтомурешили добавить насайт тесты, которые можно пройти, чтобы определить свой уровень.

Тест это отдельный объект, который связан собъектом вакансия.

С объектом вакансия связаны тест и новость.С объектом вакансия связаны тест и новость.

3. Определить варианты и способы взаимодействия

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

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

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

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

С вакансией можно взаимодействовать тремя способамиС вакансией можно взаимодействовать тремя способами

4. Определяем свойства параметров

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

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

Ф фильтруемый (или сортируемый) параметр. Пользователь может взаимодействовать сним интерактивно. Например выводить только теэкземпляры объекта, которые соответствуют конкретному значению параметра. Допустим, посетитель информационного сайта может отфильтровать новости потемам ичитать только про технологии.

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

С статический параметр, который вшит вверстку. Имнельзя управлять, аизменить его может только верстальщик либо разработчик.

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

Данные этого исследования заносим втаблицу.

Напротив параметров указаны их свойстваНапротив параметров указаны их свойства

5. Указываем способы взаимодействия для функций

Для них тоже задают условные обозначения. Унас они выглядят так:

0 способ доступен без ограничений любому пользователю.

1 способ доступен сограничениями. Наданном этапе неважно, скакими именно, главное, что ограничение есть ионем нужно детально подумать при проектировании.

Способы взаимодействия обозначаются цифрами.Способы взаимодействия обозначаются цифрами.

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

Если у объектов несколько состояний, мы используем пунктирную линию и указываем только отличияЕсли у объектов несколько состояний, мы используем пунктирную линию и указываем только отличия

Как это работает в моей компании

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

Получается точнее оценивать проекты

Раньше мывсегда работали пофиксированной цене иочень страдали, если ошибались соценкой.

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

Обычно мыоценивали проект страницами, делали карту сайта, максимально детализировали ее, номогли непродумать отдельные части backend. Кто будет верстать админку?, спрашивал разработчик всамом конце. Всмысле верстать админку?, удивлялись остальные.

Применение ООД помогло нам оценивать проекты на2025% точнее. Аглавное, унас появился мост между оценкой проекта иначалом работы. Если клиент возвращается через месяц после оценки, унас уже есть упрощенная модель системы базис для начала работы.

Помогаем стартапам экономить

Порой ребята изстартапов знают про разработку цифровых продуктов столькоже, сколько япро балет, нопри этом они очень хотят поиграть вproduct-менеджеров. Стартаперы вдохновляются известными проектами, просят нас прикрутить насайт красивую функцию, которую видели вИнстаграме или наAirbnb, апотом узнают, что это стоит 500000 ипугаются.

Наша задача показывать таким заказчикам объективную реальность. Список объектов ипараметров здорово вэтом помогает. Можно сказать человеку: Смотри, если добавить параметр X, цена вырастет на100000 , аесли убрать Y снизится на200000 . Обычно клиент счастлив, потому что минус 200000 всегда классно.

Наша задача показывать таким заказчикам объективную реальность. Список объектов ипараметров здорово вэтом помогает. Можно сказать человеку: Смотри, если добавить параметр X, цена вырастет на100000 , аесли убрать Y снизится на200000 . Обычно клиент счастлив, потому что минус 200000 всегда классно.

Мозговые штурмы стали эффективней

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

Берем профиль пользователя, кладем карточку настол ивсю встречу говорим только ободном объекте. Например, отом, как Вася взаимодействует свакансией. Клиент больше неотвлекается инеуходит всторону. Раньше мозговые штурмы занимали 2,53 часа, асейчас 4060 минут.

Появился обмен знаниями

Нам удалось без принуждения наладить постоянный обмен знаний между командами.

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

Проще делать контент

Унас есть партнеры, которые делают SEO. Они помогают сформировать правильную декомпозицию страниц, определяют, какие страницы объединять, адля каких делать отдельный интерфейс, вобщем, разрабатывают подходящую для поисковых систем структуру. Благодаря ООД они могут работать параллельно проектированию.

Это избавляет клиентов отлишних тревог. Обычные люди, и явих числе, понятия неимеют, что делает SEO-специалист: онцелый месяц творит какую-то магию, апотом ему платят. Заказчик нехочет тратить месяц нанепонятную магию, итеперь унас есть инструмент, который позволяет всем работать сообща, отталкиваясь отодного документа.

Копирайтерам тоже важно подключаться кпроцессу наэтапе проектирования. Раньше доначала разработки сайта они могли лишь продумать стратегию иtone ofvoice, атеперь берут насебя больше задач: придумывают структуру текстов покаждому объекту (теперь уних настарте есть знания опараметрах объектов ивариантах взаимодействия сним), создают драфты, выдвигают свои требования ипожелания поформированию состава объектов.

Вместо заключения

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

Нестоит применять ООД для небольших корпоративных сайтов изнескольких страниц. Объектов там небудет совсем или найдется несколько совсем очевидных. Для работы сними ненужен отдельный выделенный процесс.

Еще важно, чтобы документы, составленные впроцессе, вовремя обновлялись ибыли доступны всей команде. Если неделать этого, ООД останется лишь набумаге, иниразработчики, никопирайтеры, нидизайнеры нестанут вэтом участвовать.

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

Что почитать про ООД

Статьи об OOUXот Sophia V Prater

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

Разработка требований к программному обеспечению Карла Вигерса

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

Пользовательские истории Майка Кона

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

Подробнее..

PhysicalTechnologyи розовыйхакатонистория нашего проекта

01.04.2021 10:10:31 | Автор: admin

Всем привет! Меня зовут АлександрБобко, я работаю менеджером проектов в инновационной лаборатории EPAM MadeRealLab. Это подразделение, которое занимается созданием быстрых прототипов иконцептовдля клиентов компании из самых разных отраслей. А еще команды лаборатории часто работают над разными социальными инициативами и проектами.

В своем первом посте наHabrя решил рассказать, как мы с коллегами приняли участие ввиртуальном хакатоне "Hack for Pink"и поделиться решением, за которое взялиГран-при. Речь о зеркале-домашнем помощнике при диагностикерака груди.

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

Идея сделать что-то в рамках "HackforPink" сразу запала нам в душу по нескольким причинам. Во-первых, это классная возможность применить свои знания и опыт, чтобы принести реальную пользу конкретным людям. Поэтому мы и раньше участвовали во многих волонтерских и социальных активностях. Например, в начале пандемии коронавируса мои коллеги изMadeRealLabпо своей инициативе разрабатывали и собирали прототип аппарата вентиляции легких, локтевые ручки, защитные маски и щитки для медиков и людей, чтобы передать технологии во всеобщее пользование.

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

Команда

Основу составили ребята изPhysicalTechnology практики, которая занимается разработкой физических продуктов и устройств. Нетипичная для IT-компании гибридная командав Минскепоявилась около полутора лет назад и объединила инженеров и консультантов в областях электроники, медицинских, космических и других технологийиз6стран. А еще к нам присоединились коллеги из подразделенияInnovationconsulting,

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

Творческий процесс

ХакатонEsteeLauderдлился 2 недели, над решением мы работали в свободное время.Как все проходило:сперва собрали командуэнтузиастов,дальше я организовал совместный воркшоп,чтобы подумать о существующих проблемах,побрейшнтормитьи прийти к нескольким звонким идеям на стыке инженерии и креатива. Обмен творческими флюидами проходил онлайн.Кто-то из участников не знал друг друга, таким составом мы раньше не креативили, анужно было найти общий язык, настроиться на одну волну и обдуматьважные моменты. В общем,челленджнепростой, но мы справились в течение нескольких часов.Такие сжатые сроки намне в новинку:частонасхожиепервичныесессиис клиентом у тебябывает меньше60 минут.

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

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

C-Truemirror

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

Развили мысль дальше и пришли к выводу, что в качестве основы для нашего решения идеально подойдет зеркало, потому что оно естьпочтиу каждого человека в спальне или ванной и с ним привычно взаимодействовать. Скомбинируем салгоритмамикомпьютерного зренияи машинного обучения, которые помогут определить места для диагностикии аномалии,технологиюmixedreality, чтобы проецировать наотражение человекаграфикуи интерфейс, добавим тепловизионные модули, датчики, камеруи получим удобное домашнее устройство C-Truemirror.

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

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

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

  • LIDAR, которыйактивно используется в геодезии и картографии для съемки объектов в высоком качестве исупердетализации. Такой модульможно также встретитьхоть вновомiPad, хотьв роботах-пылесосах. В нашемконцептетехнология поможет определить поверхностные изменения в текстуре кожи (например, появление углублений и припухлостей) и проанализировать их форму.

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

  • Контроллер(например,NvidiaJetson)запуститлокальную обработку визуальных данных для машинного обучения. Например, если камера найдет определенные шелушения, покраснения кожи или какие-то другие отклонения, то устройство сможет обработать эту информацию, сравнить с предыдущими данными и сделать выводы.Тут важно проводить обработку данных локальнодляприватности данных.

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

ВперспективеC-TrueMirrorмог бы распознаватькаждого члена семьи (по аналогии стехнологией распознавания лиц в смартфонах) и запоминать данные по отдельности.Да и при помощи такого зеркала можно было бы проводить онлайн-тренировки или использовать для телемедицины.

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

Воплощение идеи и презентация

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

Поэтому мы с уверенностью сосредоточилисьна демонстрации жизнеспособности идеи ивзаимодействияпользователяс C-TrueMirrorв реальности. За 1,5 дня нашли нужные детали,камеру,датчики,обрезали зеркало и собрали прототип. Потом сняли видеоролик, в которомвоссоздали интерфейс устройстваи показали его использование. Элементы дополненной реальности и часть задуманного функционала рисовали фломастерами, проекцию на зеркало делали прямо с манекена.

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

Подготовке итоговой презентации тоже уделили большое внимание. Важно было донести суть нашего проекта и раскрыть потенциал прототипа. Мы тщательно проработали сценарий, спич и "перевели инженерную идеюна понятный язык.Вот, что получилось в итоге:

Перспективы и новые направления развития

Важно отметить, чтоC-TrueMirrorзадумывался какумный домашний помощник,а не инструмент для полноценной медицинской диагностики.Послехакатонамы много общались с онкологами и собирали от них обратную связь. Врачи подтвердили, что наше решение будет действительно полезным для пользователей в качестве инструмента популяризации регулярной самодиагностики. Да и компьютер может быстрее обратить внимание пользователя на неочевидные внешние изменения. А дальше уже идет территория медиков, потому что онкологию в принципе сложно диагностировать (тем более в домашних условиях): нужно проводить спектральный анализ, УЗИ, обследования, измерять температуру на глубине 3-4 сантиметров, использовать специальную технику и руками доктора делать пальпации.

Нанынешнемэтапемы сфокусировались на определении визуальных отклонений иmixedrealityкомпонентах, чтобы человек получал от зеркала обратную связь, проецированную на свое же тело. Сейчас командаиз инженеров по механике и электронике, разработчиков интерфейса иdata-scientistработает над функциональным прототипом. Апосле проведем тесты: для начала будем создавать искусственные визуальные изменения на теле и предлагать устройству их найти.

Мы планируем, что в будущем C-TrueMirrorможно будет использовать не только для диагностики груди, но и лица, определять проблемы и заболевания кожи, в том числе и онкологические.

БлагодарюколлегМихаилаИргера, Марину Дайнеко, РоманаАлиевича,АрамаМанукяна, Яна Федорова, Максима Цвика, Ольгу Полещук и Артема Панасенко заидеи, классную работу и вклад в создание этого проекта!

Подробнее..

Категории

Последние комментарии

  • Имя: Макс
    24.08.2022 | 11:28
    Я разраб в IT компании, работаю на арбитражную команду. Мы работаем с приламы и сайтами, при работе замечаются постоянные баны и лаги. Пацаны посоветовали сервис по анализу исходного кода,https://app Подробнее..
  • Имя: 9055410337
    20.08.2022 | 17:41
    поможем пишите в телеграм Подробнее..
  • Имя: sabbat
    17.08.2022 | 20:42
    Охренеть.. это просто шикарная статья, феноменально круто. Большое спасибо за разбор! Надеюсь как-нибудь с тобой связаться для обсуждений чего-либо) Подробнее..
  • Имя: Мария
    09.08.2022 | 14:44
    Добрый день. Если обладаете такой информацией, то подскажите, пожалуйста, где можно найти много-много материала по Yggdrasil и его уязвимостях для написания диплома? Благодарю. Подробнее..
© 2006-2024, personeltest.ru