medium_Olehn_sajt_d927031442.png

small_Olehn_sajt_d927031442.png

thumbnail_Olehn_sajt_d927031442.png

Olehn_sajt_d927031442.png

large_background profile (3).png

medium_background profile (3).png

small_background profile (3).png

thumbnail_background profile (3).png

background profile (3).png

Олехнович Артем

UI/UX

Product Design

Interfaces 

exolveBlack3.webm

Собрали сайт для облачного решения по автоматизации бизнес-коммуникаций.


<div>
<h3>Кейс о кейсе</h3>
<p>МТС Exolve&nbsp;&mdash; это коммуникационная платформа, которая помогает компаниям взаимодействовать с&nbsp;клиентами через различные каналы: мессенджеры, соцсети, SMS, звонки.</p>
</div>

<img src="/uploads/IMG_Block_1_72dc69f709.webp">

</div>
<div>
<h3>Взгляд на экосистему</h3>
<p>Мы&nbsp;объединили общим визуальным стилем МТС все части платформы: сайт, комьюнити-площадку, кабинет интегратора и&nbsp;ЛК разработчика. Задача проекта&nbsp;&mdash; привлечь целевую аудиторию в&nbsp;продукт и&nbsp;перевести аудиторию сайта в&nbsp;категорию полноценных пользователей. В&nbsp;ЛК&nbsp;разработчика можно посмотреть список заказов от&nbsp;бизнеса и&nbsp;вести коммуникацию напрямую через платформу для обсуждения задачи и&nbsp;нюансов. Разработчики дополнительно сделали фичу, чтобы отслеживать статистику обращений и&nbsp;выполненных проектов. Дополнительно разработали&nbsp;ЛК для бизнеса, где можно выбрать потенциального исполнителя и&nbsp;вести коммуникацию напрямую на&nbsp;площадке.</p>
</div> 

<img src="/uploads/IMG_Block_2_b5847f471c.webp">

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

<video src="/uploads/exolve_Black_loop_x2_3dcf004828.webm"
loop
autoplay
muted
playsinline></video>
</div>
<div>
</div>
<div>
<h3>Персонализация и&nbsp;автоматизация</h3>
<p>Структурно и&nbsp;визуально мы&nbsp;выстроили проект вокруг концепции объединения разных функций продукта в&nbsp;близкие блоки. Здесь и&nbsp;проявляется идея конструктора: для конкретных целей бизнес может выбрать отдельные продукты, которые лучше отвечают его потребностям.</p>
</div>
</div>

<img src="/uploads/IMG_Block_3_7d6eeeebe3.webp">

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

<img src="/uploads/IMG_Block_4_c7e09ad0b1.webp">
</div>
</div>

<video src="/uploads/2560_b4103ef081.webm"
loop
autoplay
muted
playsinline></video>
</div>
<div>
</div>
<div>
<h3>Простор выбора</h3>
<p>На&nbsp;общем экране собрали информацию о&nbsp;тарифах и&nbsp;полный каталог услуг и&nbsp;партнеров. Такое решение поможет пользователям МТС Exolve быстро выбирать необходимые продукты и&nbsp;упрощать касание с&nbsp;клиентами.</p>
</div>
</div>

<img src="/uploads/IMG_Block_6_e90a863bdf.webp">

</div>
<div>
<h3>Разговоры о важном</h3>
<p>Отдельной сущностью стала коммуникационная платформа проекта. На&nbsp;ресурсе собрана информация для внедрения решений МТС Exolve: документация, кейсы, блог, календарь событий, форум. Так пользователям и&nbsp;разработчикам проще следить за&nbsp;обновлениями, задавать вопросы и&nbsp;подбирать для себя продукты, которые лучше сработали у&nbsp;коллег по&nbsp;нише. Каждому пользователю коммуникационной платформы разработчики добавили рейтинг и&nbsp;возможность оценивать посты или комментарии других участников. В&nbsp;целом в&nbsp;проекте использовали технологии 1C: Битрикс, Vue.Js, MindBox, Keycloak.</p>
</div>
</div>

<img src="/uploads/IMG_Block_7_f4453c049c.webp">

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

<img src="/uploads/IMG_Block_8_26fabddee9.webp">

</div>
<div>
<h3>Что было дальше</h3>
<p>Всего мы&nbsp;предоставили клиенту около 150 вариантов макетов. Сейчас платформа запущена, и&nbsp;в&nbsp;планах&nbsp;&mdash; ее&nbsp;расширение.</p>
</div>
</div>

Frame 2.webp

Сайт МТС Exolve

Лисунова Карина

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

Ионин Максим 

Закиров Арсений

Всеволод Григорьев

Трипутень Максим

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

Толстых Кристина

VideoCover.webm

Сделали редизайн интернет-магазина для геймеров IGM.GG и повысили прямой трафик +192%

<div>
<h3>Кто наш заказчик</h3>
<p>IGM.GG&nbsp;&mdash; интернет-магазин от&nbsp;самого крупного игрового сообщества на&nbsp;просторах СНГ с&nbsp;4+&nbsp;млн подписчиков в&nbsp;VK.</p>
</div>

<video
src="/uploads/1_0fe85b136f.webm"
loop
autoplay
muted
playsinline></video>

<div>
<h3>Что нужно было сделать</h3>
<p>Совместно с&nbsp;разработчиками из&nbsp;IT-компании KTS приступили к&nbsp;работе. Нашей целью было улучшить опыт пользователей интернет-магазина, упростить механику покупки игровых ключей, повысить лояльность аудитории и&nbsp;мотивировать к&nbsp;новым покупкам&nbsp;&mdash; всё&nbsp;с&nbsp;помощью дизайна с&nbsp;нашей стороны. Заказчику было важно сохранить тёмную тему и&nbsp;красные акцентные блоки из&nbsp;первой версии сайта, а&nbsp;в&nbsp;части механик и&nbsp;оформления мы&nbsp;были абсолютно свободны.</p>
</div>

<img src="/uploads/2_5dddb39e48.webp"> 

<div>
<h3>Геймерам&nbsp;&mdash; геймерский дизайн</h3>
<p>Что ассоциируется с&nbsp;геймингом в&nbsp;первую очередь? Нет, не&nbsp;светодиодная подсветка, навороченные кресла и&nbsp;наушники с&nbsp;гарнитурами&nbsp;&mdash; это всё частности. То,&nbsp;что&nbsp;объединяет всех геймеров независимо от&nbsp;уровня,&nbsp;&mdash;&nbsp;это&nbsp;экран запуска, который видит каждый. При разработке концепции мы&nbsp;взяли за&nbsp;основу интерфейс консоли: с&nbsp;плитками, подвижными элементами и&nbsp;градиентными цветами, от&nbsp;одного вида которых появляется предвкушение захватывающей игры.</p>
</div>

<video
src="/uploads/3_3ed10833a0.webm"
loop
autoplay
muted
playsinline></video>

<div>
<h3>Проработка библиотеки UI-компонентов</h3>
<p>Каждый элемент типографики, цветов, иконок, кнопок, селектов и&nbsp;других UI-компонентов был тщательно проработан для дальнейшего масштабирования площадки. Мы&nbsp;распределили компоненты по&nbsp;группам: фильтры, комментарии, кнопки и&nbsp;другие элементы интерфейса. Выполнили их&nbsp;в&nbsp;единой стилистике, заданной концептом. Основным графическим решением стала плитка из&nbsp;12&nbsp;колонок. Это сочетание можно компоновать сразу в&nbsp;нескольких вариантах: по&nbsp;2, 3, 4&nbsp;или 6&nbsp;колонок на&nbsp;одном экране. Благодаря этому мы&nbsp;получили динамичный дизайн главной страницы и&nbsp;подборок.</p>
</div>

<video
src="/uploads/4_ee6459127c.webm"
loop
autoplay
muted
playsinline></video>

<div>
<h3>Сделали покупку игры событием</h3>
<p>В&nbsp;наш век e-commerce стало так легко делать покупки, что это уже не&nbsp;вызывает никаких эмоций. Просто подтверждаем покупку, получаем пуш о&nbsp;списании и&nbsp;чек&nbsp;&mdash; всё. Мы&nbsp;решили сделать отсылку к&nbsp;аналоговой эпохе и&nbsp;временам, когда ты&nbsp;трясущимися руками открываешь коробку с&nbsp;диском в&nbsp;первый раз. Сделали это через проработку анимаций.</p>
</div>

<video
src="/uploads/5_1e42625209.webm"
loop
autoplay
muted
playsinline></video>

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

<video
src="/uploads/7_b51f4e215f.webm"
loop
autoplay
muted
playsinline></video>

<img src="/uploads/8_41256a9e8d.webp"> 

<div>
<h3>Как мы&nbsp;делали адаптивный дизайн</h3>
<p>Каждый макет создали в&nbsp;трех брейкпоинтах, отрисовали все состояния каждого интерактивного элемента, показали примеры анимаций и&nbsp;поведения при скролле.</p>
</div>

<img src="/uploads/9_88d1e55962.webp"> 

<div>
<h3>Результат проекта</h3>
<p>У&nbsp;нас получился яркий сайт, который сочетает в&nbsp;себе актуальный дизайн и&nbsp;отсылки ко&nbsp;временам, когда игровая индустрия только завоевывала наши сердца и&nbsp;умы. Но&nbsp;самое главное: редизайн позволил IGM.GG достичь своих бизнес-целей. Выручка продукта выросла в&nbsp;1,5 раза с&nbsp;момента запуска новой версии сайта, а&nbsp;глубина просмотра выросла на&nbsp;30%. Пользователи проводили на&nbsp;23% больше времени на&nbsp;новой версии сайта, чем на&nbsp;предыдущей, а&nbsp;просмотры страниц выросли на&nbsp;126%.</p>
</div>

<img src="/uploads/10_b5dc1a0142.webp"> 

<video
src="/uploads/6_ae4206df72.webm"
loop
autoplay
muted
playsinline></video>

<img src="/uploads/12_6c64cf3db7.webp"> 


Олехнович Артем

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

hello@mish.design

Москва

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