medium_Savriko_sajt_foto_c45f3dbb2d.png

small_Savriko_sajt_foto_c45f3dbb2d.png

thumbnail_Savriko_sajt_foto_c45f3dbb2d.png

Savriko_sajt_foto_c45f3dbb2d.png

large_Саврик сайт.png

medium_Саврик сайт.png

small_Саврик сайт.png

thumbnail_Саврик сайт.png

Саврик сайт.png

Воронова Мария

Product Design

UI/UX

Product Support

Product Management

Product Analytics

Product Audit

NRJ case mocap web2.mp4

Редизайн сайта радио ENERGY, одной из крупнейших радиостанций России.

 <img src="/uploads/29_1dc7233e90.png">
<div>
<h3>Заряжающее радио</h3> 
<p>Радио ENERGY наши ребята слушают на постоянной основе, поэтому мы с большим воодушевлением приступили к работе над проектом. И прежде чем приступить к редизайну, начали с переосмысления подачи контента на сайте. А контента очень много: песни, тексты песен, информация об исполнителях, новости, передачи, информационные и развлекательные выпуски. Море информации, в которой нужно помочь слушателю сориентироваться.</p>
</div>

  <img src="/uploads/NRJ_Tagline_02_81951fff7c.jpg?updated_at=2023-03-31T14:19:36.024Z" alt="enter image description here">
  <img src="/uploads/NRJ_Tagline_03_b6c67272e3.jpg?updated_at=2023-03-31T14:19:36.803Z" alt="enter image description here">
<div>
<h3>Куда все это девать?</h3>
<div>
<p>Мы&nbsp;много работали над систематизацией огромного количество контента. Простая система тегов помогает найти исполнителя по&nbsp;жанру, список его треков, а&nbsp;также клипов. Все дополнили текстами песен с&nbsp;переводами, а&nbsp;также дополнительной интересной информацией. При этом пользователи могут помочь улучшить контент, предложив что-то редакции.</p>
</div>
</div>
  <img src="/uploads/NRJ_Tagline_04_80b795058c.jpg?updated_at=2023-03-31T14:19:34.328Z" alt="enter image description here">
  <img src="/uploads/NRJ_Tagline_05_3210874302.jpg?updated_at=2023-03-31T14:19:34.788Z" alt="enter image description here">
  <div>
<h3>Плеер</h3>
<div>
  <p>Самая главная фишка в&nbsp;плеере — ни&nbsp;у&nbsp;кого такого плеера нет. Звучит амбициозно? Да. Но если посмотреть, то на&nbsp;сайтах радиостанций вообще редко размещают полноценные плееры, а для ENERGY мы сделали историю прослушивания, тексты песен, переключения потоков. </p>
</div>
</div>
  <img src="/uploads/NRJ_Tagline_06_f3dbdc6c9d.jpg?updated_at=2023-03-31T14:19:34.774Z" alt="enter image description here">
  <img src="/uploads/NRJ_Tagline_07_f510b09f01.jpg?updated_at=2023-03-31T14:19:36.366Z" alt="enter image description here">
    <div>
<h3>Что же в итоге?</h3>
<div>
  <p>Над этим кейсом у нас работали самые основательные и вдумчивые ребята, потому что продумать логику такого количества контента было по-настоящему непросто. Но мы с задачей справились, ко всему прочему прикрутив еще полноценный плеер. Все это позволяет очень долго удерживать пользователя на сайте и вовлекать его в новые активности, получать обратную связь и постоянно совершенствовать контент. </p>

NRJ case mocap gor 2_00.png

Радио ENERGY

NRJ case mocap render_00.jpg

Хамзин Эдуард

Сычева Софья

Цаголов Владимир

SBI mocap.mp4

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

<img src="/uploads/001_0d8c7a6365.jpg?updated_at=2023-04-02T18:29:50.048Z" alt="enter image description here">
<div>
<h3>Семейный банкинг</h3>
<p>Мы&nbsp;отразили новую для рынка идею, family banking&rsquo;а, в&nbsp;виде детского и&nbsp;взрослого приложений, которые помогают вместе копить на&nbsp;общую мечту, вместе тратить и&nbsp;вместе зарабатывать кэшбэк.</p>
</div>

 <img src="/uploads/002_dcabe32094.jpg?updated_at=2023-04-02T18:29:49.955Z" alt="enter image description here">

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

  <img src="/uploads/004_1c73d338ba.jpg?updated_at=2023-04-02T18:29:49.990Z" alt="enter image description here">
  
<div>
<h3>Детское приложение</h3>
<div>
<p>Стиль детского приложения не&nbsp;такой строгий, как у&nbsp;взрослого: обращение на&nbsp;&laquo;ты&raquo;, яркие иллюстрации, возможность поставить на&nbsp;фон картинку из&nbsp;мультика или фото супергероя, но&nbsp;в&nbsp;то&nbsp;же время оно похоже на&nbsp;взрослое и&nbsp;выглядит как серьезный финансовый сервис.</p>
 <p>Такое решение позволяет формировать финансовую грамотность у&nbsp;подрастающего поколения. Приложение позволяет младшим членам семьи планировать свои накопления, расходы и&nbsp;получать переводы от&nbsp;родителей в&nbsp;интерактивной форме.</p>
</div>
</div>

  <img src="/uploads/006_f63ec80210.jpg?updated_at=2023-04-02T18:29:49.975Z" alt="enter image description here">
  <div>
  <h3>Элемент игры</h3>
  <p>Внутри приложения родители могут назначать задания детям и&nbsp;назначать им&nbsp;награду. Средства автоматически перечисляются в&nbsp;копилку ребенка после подтверждения родителем.</p>
  </div>
<video
src="/uploads/sbi_budget_abe241ab65.mp4"
loop
autoplay
muted
playsinline></video>
</div>
  <img src="/uploads/007_9ee6f66a1c.jpg?updated_at=2023-04-02T18:29:49.870Z" alt="enter image description here">
 
 <div>
 <h3>Комплексный сервис</h3>
<p>Мы&nbsp;реализовали все основные функции платежей: переводы между своими счетами, клиентам других банков, платежи за&nbsp;ЖКХ, интернет, телефон, по&nbsp;реквизитам и&nbsp;другие финансовые возможности.</p>
 </div> 

  <img src="/uploads/003_05939f2545.jpg?updated_at=2023-04-02T18:29:48.727Z" alt="enter image description here">
  <img src="/uploads/005_e8473fac76.jpg?updated_at=2023-04-02T18:29:49.501Z" alt="enter image description here">

<div>
<h3>Результат</h3>
<p>В&nbsp;процессе работы мы&nbsp;разработали большую дизайн-систему, отрисовали более 1500 экранов и&nbsp;выпустили MVP-версии взрослого и&nbsp;детского приложений для iOS и&nbsp;Android.</p>
</div>

SBI Bank.jpg

SBI Bank

SBI.jpg

Крестов Иван

Костромицкий Владимир

Кретинин Андрей

Чикильдин Илья

EuropaPlusMocapWeb2.mp4

Редизайн сайта для радиостанции «Европа Плюс» с учетом новой айдентики и с сохранением предыдущей структуры.

 <img src="/uploads/body1_700x400_0d5e17d877.jpg?updated_at=2023-04-05T12:49:04.771Z" alt="enter image description here">
 <div>
<h3>Радиостанция №1</h3>
<div>
<p>Европа Плюс – самая популярная радиостанция в России. Ребята пришли к нам с желанием сделать современный сайт и новое мобильное приложение. При этом в приложении должны быть фичи, которых нет на сайте (аудиторию надо удивлять и втягивать в продукт).</p>
</div>
</div>
  <video
src="/uploads/E_0e86114d6d.mp4"
loop
autoplay
muted
playsinline></video>
</div>
  <img src="/uploads/body2_700x400_c3926a2057.jpg?updated_at=2023-04-05T12:49:01.006Z" alt="enter image description here">
  <img src="/uploads/body3_700x400_849bd03597.jpg?updated_at=2023-04-05T12:49:03.529Z" alt="enter image description here">
 <div>
<h3>Преемственность</h3>
<div>
<p>Нельзя было просто взять и снести весь существующий дизайн и сделать новый. Особенность кейса заключалась в поддержании преемственности с существующими архитектурой и визуальным образом любимого бренда. Нам нужно было обновить UI, сохранив привычные для пользователей элементы. И они были переработаны, чтобы не вызывать сложностей у слушателей. Например, мультиплеер для быстрого доступа к аудио-материалу и видеотрансляции или удобная схема перехода между потоками.</p>
</div>
</div>
  <img src="/uploads/body4_700x400_0a6f74a53e.jpg?updated_at=2023-04-05T12:49:05.091Z" alt="enter image description here">
  <img src="/uploads/body5_700x400_077d36a6f3.jpg?updated_at=2023-04-05T12:49:07.257Z" alt="enter image description here">
  <img src="/uploads/body6_700x400_1_2627fb1de3.jpg?updated_at=2023-04-05T12:57:34.700Z" alt="enter image description here">
  <img src="/uploads/body7_700x400_c4024ac8fc.jpg?updated_at=2023-04-05T12:48:53.036Z" alt="enter image description here">

 <div>
<h3>Что же получилось?</h3>
<div>
<p>В итоге мы разработали красивый и удобный сервис в соответствии с требованиями UX и UI. Интерфейс стал адаптивным, а значит приятным для использования на всех популярных устройствах. В рамках всего проекта было отрисовано более 200 уникальных страниц сервиса, собран большой и подробный UI Kit с основными элементами, иконками, стилями и шрифтами.</p>
</div>

EuropaPlusMocapGor_01.png

Европа Плюс

Европа+.jpg

Баталова Анна

Acra small.png

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

<img src="/uploads/1_ad22cdc68d.png" alt="enter image description here">

<div>
<h3>Кому делали</h3>
<p>Рейтинговому агентству АКРА с аккредитацией Банка России. АКРА присваивает кредитные рейтинги эмитентам по национальной и международной шкалам, а значит должно отвечать зарубежным требованиям к функциональности платформы.</p>
</div>
 
  <img src="/uploads/2_d58c433869.png" alt="enter image description here">
  <img src="/uploads/3_c67f0838c4.png" alt="enter image description here">
<div>
<h3>Обновление для результата</h3>
<div>
<p>Обычно рабочие инструменты настраиваются под бизнес-процессы. В нашей истории все по-другому. Сайт АКРА базировался на нишевом языке, поэтому обслуживать софт было долго и дорого. Из-за этого приходилось плясать от неудобного функционала — а там и ошибки, и сложности, и риски. Агентство обратилось к нам, чтобы мы создали удобный портал для работы.<p>
</div>
</div>
  <img src="/uploads/4_40053c47a7.png" alt="enter image description here">

<div>
<h3>Погружение в процессы</h3>
<p>Одно дело — просто обновить визуал на сайте. Совсем другое — обновить его в соответствии с бизнес-процессами клиента, чтобы сайт был не просто красивый, но и удобный. Для этого мы погрузились в детали работы агентства и изучили процесс присвоения и поддержания рейтингов. Да, даже арт-директоры иногда занимаются такими задачами. Дальше пошло-поехало: построили архитектуру сервиса и навигацию, проработали UX, собрали UI-кит и обновили визуал сайта под утвержденный фирменный стиль.</p>
</div>
</div>
  <img src="/uploads/5_4dbe5a2fdd.png" alt="enter image description here">

  <div>
<h3>Проектная разведка</h3>
<div>
  <p>Вся работа совместная с клиентом — это про результат, а не разделение ответственности. Мы предложили оптимизировать рабочий флоу агентства и под него адаптировать сайт. В итоге разработали объектную модель сайта, взяли в руки и в реализацию перечень фичей проекта и поняли, куда копать дальше.</p>
</div>
</div>
 <img src="/uploads/6_dcd9330bbb.png" alt="enter image description here">

  <div>
<h3>Проработка UI</h3>
<div>
  <p>Второй этап — переработка юзабилити сайта. За основу взяли европейский стиль «чистого» дизайна и предложили минималистичный интерфейс и цифровой гайд с уникальными графическими элементами. Получилось, как там говорят, вкусно.</p>
</div>
</div>

 <img src="/uploads/7_d7a2678d4a.png" alt="enter image description here">

  <div>
<h3>Что в итоге</h3>
<div>
  <p>В итоге — новая визуалка сайта: современная, минималистичная, подходящая под образ клиента. А еще юзабилити, которое отвечает своим основным принципам — делать так, как удобно, и не делать так, как неудобно. В общем, конфетка.</p>
</div>
</div>

Acra.png

АКРА

MTS Travel (2).png

Спроектировали с нуля web-интерфейс сервиса для бронирования отелей за границей

</div>
<div>
<h3>Тендер</h3>
<p>Весной 2022 года ребята из МТС решили запустить направление МТС Путешествия. Новый на рынке TravelTech продукт должен был стать удобной площадкой для бронирования отелей за границей. С этим запросом будущие МТС Путешествия вышли на тендер. Чтобы забрать проект, наша команда должна была представить свое видение продукта и создать концепт главной страницы сайта.</p>
</div>
</div>

<img src="/uploads/3_7_8a2d92d728.png">

</div>
<div>
<h3>Концепция главной</h3>
<p>Для тендера мы работали с турецким направлением. Вдохновлялись известными российскими и международными сервисами, но стремились сделать оригинальный продукт. Основным акцентом главной стало крупное анимированное изображение, которое подстраивалось под выбранное пользователем направление. В итоге наша концепция выиграла тендер, и мы приступили к созданию десктопной версии платформы.</p>
</div>
</div>

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

<div>
<h3>Задачи проекта</h3>
<div>
<p>На все про все у дизайнеров Mish было около двух месяцев. Все про все — это::</p>
<ul>
  <li>построение понятного юзер-флоу от главной страницы до покупки тура;</li>
  <li>проектирование взаимодействия пользователя с продуктом;</li>
  <li>визуальный дизайн на основе корпоративной системы МТС.</li>
</ul>
</div>
</div>

<img src="/uploads/MTS_Travel_case_2_f4ccbc6107.png">
<img src="/uploads/MTS_Travel_case_4_6a6947c8f0.png">
<img src="/uploads/MTS_Travel_case_5_c840e2c401.png">

</div>
<div>
<h3>Дизайн-система</h3>
<p>Чтобы сохранить единообразие продуктов экосистемы МТС, мы собирали визуальную часть платформы на дизайн-системе Granat от самих МТС, которую они используют во всех своих продуктах. Под нее разработали часть недостающих компонентов в заданной стилистике.</p>
</div>
</div>

<img src="/uploads/MTS_Travel_case_3_5a4ac136c3.png">

</div>
<div>
<h3>Разработка</h3>
<p>Готовые макеты передали команде разработке. Затем провели подробное дизайн-ревью, чтобы наши UX/UI-идеи были корректно реализованы. Когда десктопная версия была готова, команда адаптировала ее под планшетный и мобильный форматы.</p>
</div>
</div>

<img src="/uploads/MTS_Travel_case_6_26b3d6d2bb.png">

</div>
<div>
<h3>Результат</h3>
<p>Сейчас МТС Путешествия — готовый работающий продукт, который позволяет бронировать отели не только в Турции. Среди направлений — страны Средней Азии, Ближнего Востока, Европы. А мы продолжаем работать с МТС по другим проектам.</p>
</div>
</div>

<img src="/uploads/MTS_Travel_case_1_c48939c2f9.png">

MTS Travel-1 (2).png

МТС Путешествия

Ионин Максим 

Воронова Мария

Бриф сам себя не заполнит

hello@mish.design

Москва

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