Nebula.png

Фирменный стиль, промо-лендинги и админ-панель для агрегатора криптобирж. 

<img src="/uploads/00_Title_Nebula_f5a9c89f38.jpg?updated_at=2023-03-31T14:53:20.450Z" alt="enter image description here">
<div>
<h3>Так что же это такое</h3>
<p>Nebula — это агрегатор криптобирж для поиска лучшей цены криптовалют. Самый доступный способ найти наиболее адекватный прайс среди сотен сайтов, продающих крипту, в которых легко запутаться. </p>
</div>
<img src="/uploads/01_Nebula_28fe0fdea0.jpg?updated_at=2023-03-31T14:53:18.775Z" alt="enter image description here">
<img src="/uploads/02_Nebula_a0bc418b08.jpg?updated_at=2023-03-31T14:53:21.287Z" alt="enter image description here">
<div>
<h3>3D-схема работы агрегатора</h3>
<div>
<p>Клиент хотел создать крипто-сервис, который был&nbsp;бы не&nbsp;только удобным и&nbsp;понятным, но&nbsp;и&nbsp;визуально технологичным, отвечающим запросам аудитории.</p> 
<p>Начинали, конечно, с брендинга. Это не та история, где нужно изобретать велосипед и нырять в пучины креатива (тз есть тз), но сделать красиво и футуристично очень важно. За основу взяли темную тему с тремя основными цветами (сиреневым, розовым и темно-синим) как прямую ассоциацию с трейдингом и криптой. </p>
</div>
</div>

<img src="/uploads/03_Nebula_908a585fb4.jpg?updated_at=2023-03-31T14:53:21.590Z" alt="enter image description here">

<div>
<h3>Интерфейс для всех</h3>
<div>
<p>Далее мы продумали логику, разработали дизайн личного кабинета и админки агрегатора. Для этого разработали  полноценный UI-Kit, куда без него. Для наглядности процессов &nbsp;создали понятные схемы, которые наглядно демонстрируют принцип работы Nebula, чтобы даже новички в криптовалютах понимали прозрачность процессов и пользу агрегатора для конкретно их целей. Поэтому в дизайне &nbsp;решили сделать упор на&nbsp;3D-анимациях и&nbsp;интерактивном отображении данных.</p>
</div>
</div>

<img src="/uploads/05_Nebula_3be0f6f304.jpg?updated_at=2023-03-31T14:53:18.519Z" alt="enter image description here">

<div>
<h3>Разработка</h3>
<div>
<p>На этом проекте мы были ответственны за frontend, что очень ускорило запуск, поскольку у внутренних команд дизайнеров и разработчиков хорошо налажен диалог. В основе стэка React, TypeScript и Redux как наиболее очевидные в данном случае, а также Openware и Web3. Многие графики на Recharts. Тестирование на Jest, Enzyme и Cypress. </p>
</div>
</div>
<img src="/uploads/06_Nebula_f5963947f0.jpg?updated_at=2023-03-31T14:53:15.937Z" alt="enter image description here">
<img src="/uploads/07_Nebula_32544c7c48.jpg?updated_at=2023-03-31T14:53:12.642Z" alt="enter image description here">
</div>
</div>
<div>
<h3>Понятный агрегатор</h3>
<div>
<p>При подаче такой непростой информации легко запутаться, однако мы сразу сконцентрировались на главном — UI. Именно на прекрасно продуманном интерфейсе и был построен этот проект. Хотя и удачный брендинг играет не последнюю роль. Футуристичный визуал, основанный на 3D, дополняет главную составляющую и выгодно отличает агрегатор от других. </p>


Nebula ECN

PickselMocap.mp4

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

<img src="/uploads/Brend_1_b2c16f78d5.jpg?updated_at=2023-04-05T09:57:51.104Z" alt="enter image description here">
<video
src="/uploads/tagline_animation01_picksell_aca725850c.mp4"
loop
autoplay
muted
playsinline></video>
</div>
<div>
<h3>Единая корзина покупок</h3>
<p>Когда клиент пришел к нам с этим проектом, наши арт-директора прыгали от радости: сложный кейс, не имеющий аналогов, где одна только логика чего стоит. Грубо говоря, для покупателя это быстрый шопинг, а для магазина новый канал продаж. Сервис создает полный цикл магазин-клиент, где пользователи приложения сканируют QR-коды товаров различных магазинов, а приложение формируют для них единую корзину покупок. Пользователи платят напрямую со&nbsp;своего счета магазину, что позволяет экономить бизнесу на&nbsp;эквайринге и&nbsp;обеспечивает безопасность переводов по&nbsp;единому европейскому формату. </p>
</div>
<video
src="/uploads/tagline_animation02_picksell_d0b30c9b03.mp4"
loop
autoplay
muted
playsinline></video>
</div>
  <img src="/uploads/prilka_1_3db4c40648.jpg?updated_at=2023-04-05T09:58:28.785Z" alt="enter image description here">
  <img src="/uploads/prilka_2_14395fbc68.jpg?updated_at=2023-04-05T09:58:56.386Z" alt="enter image description here">

<div>
<h3>Онлайн-витрина</h3>
<p>Мы&nbsp;проработали функционал онлайн-витрины, предоставляющий бизнесу возможность создать собственную страницу магазина с&nbsp;товарами, что является отличным инструментом для малого бизнеса продвигать свою продукцию.</p>
</div>

  <img src="/uploads/Adminka_1_f5c9ba7351.jpg?updated_at=2023-04-05T09:55:22.412Z" alt="enter image description here">
  <img src="/uploads/Adminka_2_72de15d20c.jpg?updated_at=2023-04-05T09:54:59.867Z" alt="enter image description here">

<div>
<h3>Система QR-кодов</h3>
<div>
<p>Далее встроили в&nbsp;интерфейс канал коммуникации между клиентом и&nbsp;магазином, следуя стандартам безопасности и&nbsp;открытости: Picksell предоставляет все необходимые данные покупателя магазину, но бережно их хранит, а покупатель управляет своими персональными данными. В общем, всем сильно проще следовать директиве GDPR (без нее никуда).</p>
<p>Также создали систему QR-кодов, с&nbsp;помощью которой покупатели могут набирать единую корзину товаров из&nbsp;различных магазинов, чтобы быстро и&nbsp;легко оформить покупку. А еще это простой и&nbsp;удобный способ продажи товара с заранее заложенным агентским вознаграждением, например, для блогеров.</p>
</div>
</div>

  <img src="/uploads/veb_pokupatelya_1_257d05082b.jpg?updated_at=2023-04-05T09:57:51.128Z" alt="enter image description here">
  <img src="/uploads/veb_pokupatelya_2_1e2c28b857.jpg?updated_at=2023-04-05T09:55:40.777Z" alt="enter image description here">

 <div>
 <h3>Инструменты магазина</h3>
 <p>Мы&nbsp;продумали и&nbsp;отобразили в&nbsp;интерфейсе разные варианты доставки товаров покупателям, а&nbsp;также интегрировали полную аналитику продаж и&nbsp;информацию о&nbsp;складских остатках в&nbsp;личный кабинет магазина.</p>
 </div>
  <img src="/uploads/Lending_3_765ce761ec.jpg?updated_at=2023-04-05T09:59:34.716Z" alt="enter image description here">
<div>
<h3>Коммуникации</h3>
<div>
  <p>А что там по маркетинговой коммуникации? В ход пошли как классические инструменты (персональные скидки подписчикам магазинов, снижение цены на залежавшиеся корзинах товары), так и более современные и нетипичные для Европы — QR-коды.</p>
  <p>Для клиентов создали комфортное пространство, где они могут планировать свои покупки, делиться товарами, делать списки, дарить подарки в системе, а также видеть подробный анализ своих расходов.</p>
  <p>В качестве промоматериалов мы создали несколько лендингов, где доступно и наглядно объяснили суть платформы Picksell. </p>
  </div>
</div>

  <img src="/uploads/Lending_2_4bf729d939.jpg?updated_at=2023-04-05T09:54:59.860Z" alt="enter image description here">

<div>
<h3>Идеальная экосистема</h3>
<div>
<p>Всего за&nbsp;полгода мы&nbsp;разработали уникальную экосистему, предлагающую набор сервисов для работы с&nbsp;заказами, покупателями и&nbsp;логистикой, а также удобную платформу для покупок, переосмысляющую концепцию шопинга.</p>
<p>Самым сложным в&nbsp;нашей работе было абстрагироваться от&nbsp;существующих маркетплейсов и&nbsp;разработать по-настоящему работающий инструмент, не&nbsp;создающий конкуренции между магазинами. Но нам это удалось. Была проделана очень внушительная работа, которая стала для нас большим испытанием, но результат того стоит.</p>
</div>
</div>
<video controls src="/uploads/2203_2_043d79ac11.mp4"></video>

Picksell.jpg

Picksell

Пиксель.jpg

8 Mocap quad_00.png

Дизайн мобильного приложения для домашних онлайн-тренировок.

<img src="/uploads/00_Title_8ka_5b57ffd5ee.jpg?updated_at=2023-04-02T17:41:46.860Z" alt="enter image description here">
<div>
<h3>Всем спорт!</h3>
<p>Каким должно быть спортивное приложение для домашних тренировок, чтобы человек не забросил его после первого же раза? Удобным? Понятным? С множеством функций? Да, это важно, это все должно быть по умолчанию. Но чем же тогда это приложение будет отличаться от сотен таких же в сторах? Именно поэтому мы обратились к яркому визуалу. И ставка сыграла идеально — приложение приковывает взгляд с первых секунд.</p>
</div>

  <img src="/uploads/01_8ka_e3d9ffd652.jpg?updated_at=2023-04-02T17:41:45.680Z" alt="enter image description here">
<div>
  <h3>Умная лента</h3>
<p>Мы&nbsp;сделали упор на&nbsp;гибкую систему фильтрации тренировок и&nbsp;выбора тренера. С&nbsp;помощью нее пользователь найдет именно&nbsp;то, что ему нужно из десятков возможных вариантов. User-friendly? Максимально!</p>
</div>
  <img src="/uploads/02_8ka_807db23424.jpg?updated_at=2023-04-02T17:41:46.341Z" alt="enter image description here">
<div>
  <h3>Больше 3D</h3>
<p>В этом проекте хотелось сделать прям вау, потому что спорт, активность. Пользователей нужно раскачивать, вдохновлять. Поэтому выбор пал на 3D-иллюстрации, которых много, они буквально везде и создают настроение. Дополнили их анимациями, чтобы усилить эффект.</p>
</div>
  <img src="/uploads/03_8ka_f1f70672cf.jpg?updated_at=2023-04-02T17:41:45.171Z" alt="enter image description here">
<div>
  <h3>Так что же получилось?</h3>
<p>В результате визуально получился один из самых ярких и броских наших проектов. И это сработало. Клиент очень оценил предложенную нами концепцию ребрендинга, а приложение получило множество престижных дизайнерских наград.</p>
</div>

</div>
<video
src="/uploads/8_logo_700_ddb38459d3.mp4"
loop
autoplay
muted
playsinline
/>


8 Mocap gorisontal_00.png

Восьмёрка

ОРЕО.jpg

Cовместный игровой промо-проект с Oreo и VK, разработанный на базе VK Mini Apps и созданный в честь пятилетия Oreo в России.

 <img src="/uploads/Frame_2087325968_ea85990ffb.png" alt="enter image description here">
<div>
<h3>5 лет Oreo в России</h3>
<div>
<p>Нашей задачей было создать простой, яркий и&nbsp;интерактивный промо-материал, который&nbsp;бы стимулировал спрос и&nbsp;повышал лояльность к&nbsp;бренду. Для этого у нас были инструменты VK Mini Apps и целая команда наших талантливых иллюстраторов, которые и приступили к делу.</p>
</div>
</div>

  <img src="/uploads/Frame_2087325969_05333d666f.png" alt="enter image description here">
  <img src="/uploads/Frame_2087325970_99d5b27e84.png" alt="enter image description here">
<div>
<h3>Простой кликер</h3>
<div>
<p>В&nbsp;основу игры легла самая эффективная и&nbsp;простая для пользователя механика&nbsp;&mdash; клик. Пользователь тапает или кликает по&nbsp;экрану, чтобы собрать высокую башню из&nbsp;Oreo. По&nbsp;мере увеличения башни на&nbsp;экране меняется фон: от&nbsp;небольших предметов вроде кружки молока масштабы разрастаются до&nbsp;планет и&nbsp;звезд, где на&nbsp;разных высотах пользователей ждут ачивки, призы и&nbsp;оригинальные способы празднования годовщины Oreo.</p>
</div>
</div>
  <img src="/uploads/Frame_2087325973_7148930c9e.png" alt="enter image description here">
  <img src="/uploads/Frame_2087325971_eb7b263873.png" alt="enter image description here">
<div>
<h3>Как победить?</h3>
<div>
<p>Чтобы быстрее набрать высоту башни, получить праздничный буст и&nbsp;новую часть стикерпака, пользователи могут отсканировать чек с&nbsp;товаром от&nbsp;Oreo. Это несложная механика, которая стимулирует продажи и имеет в основе элемент геймификации.</p>
</div>
</div>
  <img src="/uploads/Frame_2087325974_cfc050ff7c.png" alt="enter image description here">
  <img src="/uploads/Frame_2087325975_cb65eedc6a.png" alt="enter image description here">
<div>
<h3>Результат</h3>
<div>
<p>В итоге получился очень красочный и яркий проект, где использовались персонажи VK, инструменты VK Mini Apps, элементы геймификации и, конечно, печеньки Oreo.</p>

OREO.jpg

Oreo

Alfa.png

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

<video
src="/uploads/alfa13_f4fc8c3742.mp4"
loop
autoplay
muted
playsinline></video>
</div>
 
<div>
<h3>Концепция</h3>
<div>
<p>Альфа-Банк использует 3D-иллюстрации практически во&nbsp;всей коммуникации: приложения, сайты, социальные сети и&nbsp;т.д. При помощи необычных решений в&nbsp;визуалах бренд передаёт свою диджитальность и&nbsp;способность подстраиваться под изменчивый мир.</p>
</div>
</div>

 <img src="/uploads/2_2a8f0198e8.jpg" alt="enter image description here">

<div>
<h3>Какой смысл</h3>
<div>
<p>Общей стилистики у&nbsp;иллюстраций нет, но&nbsp;есть важное правило&nbsp;&mdash; избегать всего, что напоминает о&nbsp;реальном мире, чтобы объекты казались искусственными. Иллюстрации представляют новые товары и&nbsp;услуги, поэтому важно не&nbsp;переигрывать с&nbsp;красотой и&nbsp;подачей и&nbsp;не&nbsp;уходить в&nbsp;метафоры, чтобы не&nbsp;исказить самое главное&nbsp;&mdash; смысл.</p>
</div>
</div>

 <img src="/uploads/3_7531705676.jpg" alt="enter image description here">

<div>
<h3>Совмещаем несовместимое</h3>
<div>
<p>Избежать реальности помогает проработка материалов, например, создание из&nbsp;стекла того, для чего обычно используют пластик. В&nbsp;этом также помогают несуществующие формы вполне существующих вещей, странная геометрия, цвета и&nbsp;текстуры.</p>
</div>
</div>

<video
src="/uploads/invest_Kopilka_Anim4_13f2256c8f.mp4"
loop
autoplay
muted
playsinline></video>
</div>

<div>
<h3>Сохраняем рассудок</h3>
<div>
<p>Наши 3D-дизайнеры постоянно экспериментируют со&nbsp;светом и&nbsp;материалами. Они стараются предугадать&nbsp;то, как объект будет вести себя в&nbsp;трёхмерной среде на&nbsp;уже готовой двухмерной картинке. Всё это для того, чтобы избежать лишней мультяшности или простоты.</p>
</div>
</div>

 <img src="/uploads/5_1c03cf2f31.jpg" alt="enter image description here">
 <img src="/uploads/6_325e982f3c.jpg" alt="enter image description here">

<div>
<h3>Особенное вдохновение</h3>
<div>
<p>Промышленный дизайн полон идей. Из&nbsp;него можно позаимствовать материалы, которые передают ощущения через изображение&nbsp;&mdash; например, матовое стекло или другие soft touch текстуры. Благодаря им&nbsp;объекты становятся тактильными и&nbsp;живут в&nbsp;digital-среде, а&nbsp;у&nbsp;зрителя создаётся ощущение, будто их&nbsp;можно потрогать. Это интересный опыт для нас и&nbsp;мы&nbsp;очень довольны результатом, и&nbsp;самое главное&nbsp;&mdash; доволен клиент.</p>
</div>
</div>

 <img src="/uploads/7_7bef023f75.jpg" alt="enter image description here">

Альфа-Банк

Alfa.jpg

KION.png

Конкурсная работа по презентации упаковки приставки c рендерами и моушеном с нуля.

  <img src="/uploads/cam14_0933_1_ab9c880212.png" alt="enter image description here">
</div>
<div>
<h3>Коробка с консолью</h3>
<p>Нам прислали уже существующую коробку с консолью KION, но к ней не было ни одной модели. Вот мы и должны были придумать концепцию моушена, а также сделать сами рендеры упаковки, чтобы их можно было использовать в будущем. </p>
</div>
<video
src="/uploads/Kion_97e54ca8b5.mp4"
loop
autoplay
muted
playsinline></video>
</div>

<div>
<h3>Что еще за коробка?</h3>
<p>База коробки — картон переплетный 2мм. Снаружи и внутри коробка покрыта листами для кашировки srA3 с матовой антивандальной ламинацией и UV-лаком на элементах дизайна. Цветные вставки сделаны из голографической плёнки. Ложемент — EVA материал, по краям расположены магнитные застёжки. Внутри консоль KION и ее комплектующие.</p>
</div>

    <img src="/uploads/image_1190_c39f5a6d71.png" alt="enter image description here">
  <img src="/uploads/cam17_2736_1_41036b3494.png" alt="enter image description here">

<div>
<h3>Мир внутри книги</h3>
<p>Идея коробки с консолью проста — она как книга, которую открываешь и получаешь массу ярких эмоций и впечатлений. Мы опирались на это и в презентации консоли, ведь сама коробка статична, но когда человек тянет за ярлычок, он открывает целую вселенную развлечений. </p>
</div>
<video
src="/uploads/Kion_Part_3_d01cc407ac.mp4"
loop
autoplay
muted
playsinline></video>
</div>
  <img src="/uploads/image_1194_e93edfef26.png" alt="enter image description here">
  <img src="/uploads/image_1199_c46e85d23f.png" alt="enter image description here">
  
  <div>
<h3>Конкурс и победа</h3>
<p>Работа подавалась на крупнейший конкурс дизайна A’Design Awards и получила там серебро в номинации “Упаковка”. Наша команда занималась полным сопровождением, включая подготовку материалов, текстов и сам процесс регистрации и подачи работы на международный конкурс.  </p>
</div>

  <img src="/uploads/image_1197_14d3f78b0b.png" alt="enter image description here">
      <img src="/uploads/cam19_lines1564_1_1655194e32.png" alt="enter image description here">
      
  <div>
<h3>Мир развлечений</h3>
<p>Мы с нуля подготовили десятки 3D моделей для упаковки консоли KION, а также ролики с презентацией коробки, которые пересекаются с замыслом создателей и подчеркивают уже существующую мысль о погружении в мир фантазий и развлечений. </p>
</div>
</div>
<video
src="/uploads/Kion_Part_2_078900d40c.mp4"
loop
autoplay
muted
playsinline></video>
</div>

KION

МТС.png

Концептуальные 3D-анимации для двух разделов нового сайта МТС. 

<div>
<h3>Экоуправление</h3>
<p>В этом кейсе мы создали две масштабные и очень продуманные анимации для разделов сайта МТС. В работе мы процитировали философию МТС в рамках концепции ESG, направление на устойчивое развитие бизнеса и общества. Экоуправление — это сложное понятие, которое включает и подход бизнеса с экотрендами, и корпоративное направление с экотрендами. </p>
</div>
<video
src="/uploads/lenta00_9947bfd1ab.mp4"
loop
autoplay
muted
playsinline></video>
<img src="/uploads/T2_7b017d18a9.png" alt="enter image description here">
     <img src="/uploads/T3_0c166713dc.png" alt="enter image description here">
</div>

<div>
<h3>Стратегия Customer Lifetime Value 2.0</h3>
<p>Здесь основная идея в построении устойчивого экосистемного бизнеса на прочном фундаменте телекоммуникационного лидера. Шарик катится по кольцу с пазлами. Каждый пазл — направление бизнеса. Они отображены иконками: коммуникация с клиентом, телеком, интернет и проч. Кусочки пазла составляют единое кольцо. А шарик крутится вокруг стеклянной фигурки клиента, поскольку он постоянно в экосистеме МТС.</p>
</div>
<video
src="/uploads/cub00_ed350c8967.mp4"
loop
autoplay
muted
playsinline></video>
<img src="/uploads/R1_377d296a33.png" alt="enter image description here">
     <img src="/uploads/R2_abb43a6eca.png" alt="enter image description here">
</div>

<div>
<h3>Устойчивое развитие</h3>
<p>Цифровые технологии должны поддерживать устойчивость бизнеса и общества. Поэтому мы взяли кубик Рубика за основу: целостность с перемещаемыми элементами. Кубик Рубика состоит из разных цветов, а здесь это разные эконаправления и части устойчивого развития. Так и появились в качестве элементов крафтовые материалы, картон, растения, иконка переработки и проч.</p>
</div>
<video
src="/uploads/elements_6265cd0415.mp4"
loop
autoplay
muted
playsinline></video>
<img src="/uploads/R3_0af12636b8.png" alt="enter image description here">
</div>

     <div>
<h3>Целостность</h3>
<p>Это была концептуально сложная, но очень интересная работа. Мы вникли в новые гайдлайны МТС, быстро включились с материалами, светом, концепцией, пожеланиями. Результат очень порадовал клиента, а также является предметом гордости команды. </p>
</div>


Animation

hello@mish.design

Москва

Нижний Новгород