Разработка дизайна — это процесс, за которым очень интересно наблюдать со стороны. Мы предлагаем Вам увидеть, как создавался интерфейс с этапа черновика до коммерческой версии.
Это был долгий путь от простого наброска на бумаге до дизайна программного обеспечения.
Приветствую! Сегодня мы расскажем вам о том, как разрабатывали интерфейс нашего программного обеспечения SimplexPlan.
Что вам нужно знать о программе? По большому счёту софт является конструктором экономических моделей коммерческих предприятий. Внутри движка было заложено большое количество расчётов, код которых поместился на 44 страницах А4. Их цель — найти способ поднятия прибыли компании пользователя. Если вас интересует методы расчётов и их цель, то можете прочитать подробнее здесь.
Поэтому перед нами стояла задача не загрузить пользователя сложными расчётами, а создать систему, в которой он вносит небольшое количество информации, а после получает ценные рекомендации по управлению его бизнесом.
В идеале дизайн сам должен направлять пользователя, а также объяснять, какие данные куда необходимо внести. От клиента оставалось лишь указать свою информацию и запустить нужный вид анализа. Всё остальное программа делает сама.
Теперь, когда софт готов, а клиенты довольны, могу с уверенностью сказать, что мы смогли добиться нужного результата.
В этой статье вы увидите эволюционный процесс нашего интерфейса, а также узнаете фичи, которые позволили сделать наши таблицы в программе удобными, интерактивными и полезными. В конце статьи вас ждёт опрос, нас очень интересует ваше мнение.
Начнём!
Перво-наперво, для более удобной работы с данными, интерфейс приложения было решено разделить на вкладки.
Как уместить всю информацию о предприятии на пяти экранах? Мы быстро пришли к выводу, что необходимо использовать единый лаконичный набор экономических параметров, который был бы достаточен для любой компании. Около года ушло на его создание и утверждение. Прочитать о части из них вы можете здесь.
Фича № 1. Блок история
В ряде программ, которыми пользуется бизнес, не хватает возможности экспериментировать с данными. Ведь в случае обнаружения ошибок необходимо оперативно выявить проделанные изменения.
История — это блок, в котором фиксируются все действия, проделанные пользователем — суть изменения, его место и время.
Фича № 2. Менеджер проектов
Это модуль, который раскладывает информацию о компании по полочкам. Никакого бардака, всё наглядно и структурировано.
Со структурой можно работать из любой вкладки и она не занимает постоянно пространства на экране, благодаря функции «язычка», которая скрывает менеджер проекта за экран.
Выбор палитры
Выбрать подходящую палитру цветов — очень важная задача, ведь пользователю необходимо на протяжении длительного времени работать с таблицей. Мы рассмотрели множество цветовых решений. Стоит ли говорить, что зелёный цвет отлично подходил под формат экономической программы. Но фразы: «О, это же как в Excel!» мы не смогли уйти.
Мы даже сделали свою темную тем!
Фича № 3. Модуль «Анализ»
Сколько товаров и услуг произвести в следующем месяце, по какой цене их продавать? Нужно ли рискнуть? Какое количество ресурсов задействуется под каждый сценарий?
Это вопросы, которые задают себе руководители бизнеса каждый день.
Карта сценариев — это карта бизнеса. На ней изображено всё, что нужно для получения максимальной прибыли.
Переход на светлую сторону
По итогу было принято решение в пользу светлых тонов. Но оставалось масса нерешённых вопросов с удобством интерфейса.
Фича № 4. Модуль «Эластичность»
Задачей каждого экономиста в том числе является формирование предложений по улучшению экономики предприятия.
Что изменить в этой ситуации? С какими параметрами лучше работать? Окупятся ли изменения?
Модуль «Эластичность» с лёгкостью отвечал на все эти вопросы, а ответ лаконично отображался на уже известной вам карте сценариев.
Фича № 5. Графики всегда под рукой
Добавление модуля графиков в правый верхний угол сильно упростило работу с данными, но при это потребовало немалое количество пространства на мониторе.
Фича № 6. Лаунчер
Идея создания лаунчера позаимствована из мира компьютерных игр. Подробнее об использовании игрового опыта я рассказывал в своём ютуб-интервью.
Обычно стартовое окно программ для бизнеса не так эргономично или отсутствуют вовсе. Быстро продолжить работу с проектом или создать новый, одним кликом отправить запрос на проведения обучения или технической поддержки — все это в одном месте.
Итог
Итог удивил даже нас. Гамма выбрана в оттенках серого и фиолетового, количество элементов сведено к минимуму, а размер блоков адаптируется к любому разрешению монитора.
Понравился ли вам наш дизайн? Чтобы вы могли в нем улучшить? Нам очень интересно ваше мнение!
Подписывайтесь, мы открыто делимся нашими разработками! Уверен, вы найдете что-то интересное для себя!