UXPUB 🇺🇦 Дизайн-спільнота

Cover image for Обновление 3D-автопарка Uber
Редакція
Редакція

Опубліковано

Обновление 3D-автопарка Uber

15 миллионов раз в день крошечные 3D-автомобили путешествуют по экранам смартфонов по всему миру, помогая водителям и пассажирам Uber находить друг друга. Но мы поняли, что пришло время для обновления. Мы полностью пересмотрели дизайн 3D-моделей автомобилей. Ниже представлены некоторые моменты этого проекта. Оригинальные 3D-автомобили дебютировали в рамках редизайна нашего приложения Rider в 2016 году. Изначально они были функциональными элементами карты, показывающими местоположение и доступность авто. Каждый из них был тщательно оптимизирован для использования на картах – пропорции, детали (или их отсутствие) и форма были разработаны для просмотра в разрешении 64x64px. [caption id="attachment_45905" align="aligncenter" width="1024"] Оригинальные 3d-машины были оптимизированы для карт и намеренно сделаны с низкой детализацией[/caption] С тех пор наше приложение усложнилось, а потребности в 3D-ресурсах возросли. При расширении бизнеса отсутствие детализации автомобилей стало проблемой для рекламных кампаний. Кто-то однажды назвал их «мыльницами на колесах». Все потому, что они не предназначались для использования вне карты. Но теперь такая необходимостью возникла. Поэтому мы решили их пересмотреть.

Playmobil встречает Porsche

Этот проект быстро стал настоящим увлечением для большинства дизайнеров в команде. Сначала мы спросили себя: «Что делает автомобиль Uber?». Uber предлагает широкий выбор вариантов поездки. Есть знакомые продукты, такие как UberX и Uber Black, специальные варианты, такие как фургоны, приспособленные для инвалидов-колясочников, вертолеты, и местные транспортные средства, такие как моторикши и мотоциклы. Как мы можем собрать их все вместе? [caption id="attachment_45906" align="aligncenter" width="2000"] Изображение: BMW, Porsche[/caption] Проектировать приборную панель авто сложно... действительно сложно. С точки зрения цифрового дизайна, это похоже на создание системы визуального дизайна. По сути, это то, как особенности передней части авто (решетка радиатора и фары) и задней части (задние фонари) соединяются с салоном и общими формами, которые можно найти по всему автомобилю. Естественно, мы обратились к брендам, которые имеют сильное наследие в этой сфере. Мы нашли вдохновение в двух местах: мощная эстетика немецких автопроизводителей и великолепные миниатюрные игрушечные автомобили бренда Playmobil. [caption id="attachment_45907" align="aligncenter" width="2000"] Изображение: Playmobil[/caption] Руководствуясь опытом этих оригинальных брендов, мы определили свою цель в том, чтобы создать универсальный язык, объединяющий ассортимент автомобилей в нашем портфолио.

Первый в мире автомобиль спроектированный по логотипу?

Мы задавались вопросом: «Можно ли разработать автомобиль на основе шрифта? Делал ли это кто-то прежде?» Это была новая идея. Проще сказать, чем сделать. Наш новый бренд в основном основан на тематике транспорта. Цвета, шрифт, иконография и логотип вдохновлены универсальным языком транспорта, встречающимся во всем мире. Это казалось хорошим началом. [caption id="attachment_45908" align="aligncenter" width="1250"] Раннее исследование формирования автомобиля из нашего логотипа[/caption] Эти ранние исследования не обязательно были успешными, но они помогли нам понять роль геометрических фигур в общей системе. Оглядываясь назад, можно сказать, что некоторые из этих ранних итераций были довольно эзотерическими. ? [caption id="attachment_45909" align="aligncenter" width="1024"] Мы пытались использовать фигуры в логотипе для создания геометрии автомобиля[/caption] После выбора нескольких общих элементов для управления нашей визуальной системой следующим шагом было применение их ко всему автопарку.

От машин к людям

За последние несколько лет наше приложение для поездок превратилось из утилиты для перехода от A → B в более крупную и широкую транспортную службу. Сегодня речь идет не столько о заказе автомобиля, сколько о доставке людей к тому, что важнее всего. Мы начали этот проект с разработки автомобилей, но наша цель быстро эволюционировала, чтобы обеспечить людям возможность выбрать лучший вариант поездки для своих нужд. Получив полный список вариантов поездки от нашего операционного партнера, мы с удивлением узнали, что Uber предлагает более 50 различных продуктов по всему миру! Этот проект предоставил широкий взгляд на уникальные способы передвижения людей по всему миру.

За кулисами проекта. Вопросы и ответы

Этот тип дизайна не может жить на бумаге слишком долго. К счастью, наш очень талантливый 3D-художник Майк Гейнор помог нам в этом. Давайте зададим ему несколько вопросов: Расскажи, как ты попал в этот проект? По профессии я моушен-дизайнер, но 3D – большая составляющая моей работы. Мои знания в области 3D-инструментов и рабочего процесса казались естественным подходом для этого проекта, и в итоге я создал целый автопарк! Какая часть проекта была самой сложной? Было сложно дифференцировать транспортные средства настолько, чтобы они могли представлять продукт, и поддерживать визуальную согласованность во всем автопарке. Такие элементы, как фонари и колеса, были согласованы, и все автомобили имели одинаковый уровень детализации. Этот баланс нужно было поддерживать в течение многих итераций. Расскажи о рабочем процессе и использованных инструментах? Автомобили были смоделированы в Cinema 4D и Octane Render. Поскольку мы провели так много итераций, я сохранил большую часть геометрии, используя сплайны, примитивы и деформаторы. Это позволило мне очень быстро вносить изменения, например, в крутизну линии крыши или ширину колесной базы. Рендеринг был закончен в After Effects и отформатирован для использования нашей командой разработчиков.

Бонус — интерактивный WebGL гараж

Большинство людей не имеют возможности увидеть автомобили за пределами рамки размером 250x250px, поэтому мы создали интерактивный веб-сайт, чтобы дать другим возможность лично познакомиться с некоторыми из них поближе. https://youtu.be/k28qowRSOJU Попробуйте сами по ссылке: http://t.uber.com/3dGarage. *Извините, только для десктопа* Удачи! Отдельное спасибо: Brian Wong, Vinny Catricala, Lori Mann, Alissa Sanchez, Didier Hilhorst, Mike Gaynor и нашим друзьям из Wolff Olins за помощь в реализации проекта! Спасибо Christopher StarrMarco Paglia и Remon Tijssen.


Перевод статьи Erik K

Топ коментарі (0)