Кабинет разработчика и промо-сайт для AI-стартапа из кремниевой долины

Нам не приходилось разрабатывать интерфейсы для космического корабля или марсианской станции (пока). Но работа с DeGirum была подобным вызовом — мы оказались на фронтире самых передовых технологий.

Калифорнийский стартап DeGirum предлагает облачную платформу для разработчиков edge AI — периферийного искусственного интеллекта. Это настолько новаторский и ни на что не похожий продукт, что DeGirum не могли найти способ рассказать о нем доступно — и обратились к нам. Мы помогли четко сформулировать месседж и донести его с помощью впечатляющего дизайна. Мы создали:

Мы — Vide Infra, занимаемся дизайном и разработкой диджитал-продуктов, которые регулярно собирают награды. Делаем бесподобные мобильные и веб-приложения, маркетплейсы и большие корпоративные сайты. Входим в топ-10 Рейтинга Рунета по креативности и топ-40 мирового рейтинга Awwwards. О наших проектах и новостях, читайте на videinfra.ru

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

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

Мы погрузились в сложную экосистему DeGirum с головой:

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

Не существует универсального программного стека, который обеспечивал бы работу нейросетей на различном оборудовании. Разработчикам приходится писать сложные ИИ-продукты под конкретные процессоры. То есть сначала подбирать процессор, а только затем приступать к разработке. Это очень затратно и неудобно.

Экосистема DeGirum снимает эту проблему. Она состоит из трех компонентов:

1. ПО для разработки

DeGirum предлагает собственный Python SDK — пакет для разработки ИИ, не зависящий от оборудования. Одно это развязывает разработчикам руки.

2. Библиотека ИИ-моделей

Этот пакет интегрирован в облачные платформы DeLight и Device Farm.

3. Аппаратное решение

DeGirum производит собственный нейронный ускоритель ORCA — процессор, заточенный под работу периферийного ИИ.

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

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

Подходящим инструментом стал WebGL. Он сам по себе новаторский — позволяет рендерить динамическое 3D прямо в браузере, что дает невероятное погружение.

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

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

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

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

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

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

Навигация

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

Окно инференса

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

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

Дашборд

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

Интерфейс загрузки ИИ-моделей

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

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

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

Подпишитесь на нас, чтобы не пропустить новые детальные разборы кейсов, обсуждения трендов индустрии и взрывных идей. Также следите за нами в Telegram-канале и на сайте Vide Infra.

На связи!