До и после: как мы редизайним интерфейсы
Подобно многим аутсорс-командам, мы до недавнего времени сидели у себя в Калининграде и создавали решения для стартапов. Проектировали, дизайнили и разрабатывали для ребят с горящими глазами и бюджетированием разной степени регулярности. А потом грянули кризисы разного толка, и у стартаперов резко кончились деньги.
Чтобы они так же резко не кончились у нас, пришлось внимательнее смотреть по сторонам. И что мы увидели? Множество зрелых компаний с сильными с точки зрения разработки продуктами и слабым дизайном, иногда — от слова «совсем».
Стало понятно, что вот она, наша возможность заработать и изменить мир к лучшему. Тем более появились соответствующие заявки по профилю. О некоторых реализованных кейсах мы хотим рассказать в этой статье.
e-Legion: свежий взгляд на сайт одного из российских лидеров мобильной разработки
e-Legion — это не только мобильная разработка, но и организация крупных отраслевых конференций, своя школа кодеров, тематические митапы и блоги. И всё это существовало будто само по себе, без стилистической привязки к бренду. Потому задачей номер один стало создание единого дизайн-пространства для всех активностей компании.
Мы работали над проектом в два этапа — создали новый дизайн сайта и реализовали кейсы. Основными элементами, «сделавшими» стиль, стали современная типографика, баблы с живой речью «легионеров», дополненные эмодзи, фирменная палитра из белого и голубого.
Для вёрстки кейсов разработали шаблон, который позволяет за короткий срок и без проблем оформить любой кейс. Знай себе меняй контент, а страница всегда будет выглядеть классно.
Ещё мы освежили логотип. Предлагали несколько смелых идей, но не попали в цель, в итоге остановились на актуальном гротескном написании в духе крупных интернет-корпораций.
170 часов — дизайн сайта.
164 часа — дизайн кейсов.
206 часов — вёрстка кейсов.
Хотите больше подробностей? Читайте в нашем полном обзоре.
ST Mobi — редизайн сайта продукта для контроля выездных сотрудников
«Системные технологии» занимаются разработкой решений по управлению выездными сотрудниками и дистрибьюцией с 2000 года. Корпоративный сайт выглядит довольно современно, а вот многостраничный лендинг об ST Mobi, одном из продуктов компании, нуждался в переработке.
Нам предстояло пересмотреть структуру главной, найти место для массива важной информации, найти свежую подачу, при этом не упустив деталей и не вводя пользователя в заблуждение.
Мы поменяли логику повествования, поместив обширные сведения об ST Mobi в новый раздел, который назвали «Тур по продукту». Реализовали идею заказчика и вынесли на главную ключевых героев продукта — мерчендайзеров, экспедиторов, супервайзеров, торговых представителей. Теперь каждый пользователь может быстро найти нужную ему информацию, исходя из сферы своей занятости.
В основе стиля — фирменная бело-голубая гамма, лёгкий и воздушный интерфейс, современная типографика. Отличительная особенность — использование в дизайне изометрических иллюстраций.
10 часов — описание структуры и контента.
8 часов — прототипирование.
16 часов — создание стилистики сайта.
89 часов — разработка дизайн-макетов.
32 часа — адаптив и подготовка макетов к разработке.
Новый UI для Direct Take
В разговоре о редизайне нельзя не вспомнить о нашем любимом (пусть и не таком свежем) кейсе, который мы реализовали для дружественной нам команды. Компания-разработчик профессионального ПО для захвата, микширования и обработки любых форматов видео захотела обновить дизайн интерфейса одного из своих продуктов — Direct Take, программы для записи и онлайн-трансляции.
Существовавший интерфейс софта явно был устаревшим: исключительно технический, собранный из нативных системных компонентов, не всегда используемых в правильной логике.
Поскольку программа является частью основного рабочего софта, то и выглядеть она должна была как все знакомые и привычные программы. Тёмный, нейтральный стиль, не отвлекающий от основной рабочей области (поток вещания), знакомая стилистика кнопок и иконок, позволяющая легко ориентироваться в программе. Так мы всё и сделали.
У нас была возможность влиять лишь на визуальный язык приложения, логика и структура программы должны были оставаться неизменными. Однако даже те небольшие улучшения, которые мы привнесли в интерфейс, упростили юзабилити и работу с программой.
200 часов — дизайн.
38 часов — менеджмент.
Работающему бизнесу иногда трудно признать, что продажи не растут, потому что с продуктом что-то не так. Может, стоит попробовать взглянуть на проект со стороны? Если ваша функциональность — пушка, а дизайн при этом слаб, как трёхмесячный младенец, стоит всерьёз задуматься о вложениях в новый UI.
Редизайн, проведённый качественно, положительно скажется на росте числа ваших пользователей — например, в одном из описанных кейсов их количество выросло на 30%. Не бойтесь вкладывать в эстетику и удобство интерфейса: такие инвестиции всегда оправдывают себя.