https://blog.infotanka.ru/tags/reaktivnye-dokumenty/ E2 (v3239; Aegea) https://blog.infotanka.ru/all/vopros-otvet-chto-uluchshit-v-predlozhennoy-sheme/ https://blog.infotanka.ru/all/vopros-otvet-chto-uluchshit-v-predlozhennoy-sheme/ https://blog.infotanka.ru/all/vopros-otvet-chto-uluchshit-v-predlozhennoy-sheme/ <p>Спрашивает Денис Балуев:</p> <div style="background-color: #fff6c7; padding: 15px; padding-left: 35px; width:700px; margin-bottom:20px;"><p>Мы разрабатываем систему управления производством. Это «облачная» система в браузере, но интерфейс у нее более-менее привычный менеджеру, работающему с 1С, Word или Outlook: документы, строки, кнопки. Проблема возникла, когда нас попросили дать рабочим цеха возможность создавать и утверждать производственные приказы. Мы пытались улучшить традиционный табличный интерфейс, чтобы им можно было пользоваться на планшетах в цехе, но получалось плохо. Тогда мы вспомнили об идеях Брета Виктора, в частности, его концепции <a href="http://worrydream.com/Tangle/" class="nu">«<u>реактивных документов</u>»</a>.</p> <p>Вместо громоздкого списка документов-приказов мы стали рисовать на экране планшета <a href="http://bizflow.tk/">мнемосхемы с рецептами</a>, количество изменяется перетаскиванием вправо-влево. При этом видно, как изменяются остатки компонентов при производстве. Идея оказалась богатой: таким образом оказалось удобно, например, контролировать допустимые остатки компонентов на складе (пример с остатками заложен в рецепт «Велосипед»).</p> <p>К сожалению, у нас в штате нет дизайнера или специалиста по интерфейсам. Скажите, что в предложенной схеме можно улучшить?</p> </div><div class="e2-text-picture"> <img src="https://blog.infotanka.ru/pictures/velosiped.png" width="700" height="245" alt="" /> </div> <p>Денис, идея отличная! Интерфейсу не достаёт наглядности и логики «изложения», но это легко исправить. Начните с заголовка, который объясняет назначение экрана. Название продукта управляет списком ингредиентов, включите его в заголовок. Подчёркнутые цифры — компактное решение, но не слишком наглядное. В вашем случае можно смело развернуть их в ползунки, которые покажут соотношение задействованных на производстве деталей и остатков:</p> <div class="e2-text-picture"> <img src="https://blog.infotanka.ru/pictures/velociped-0.png" width="700" height="470" alt="" /> </div> <p>Блок «Итого» закрепите у нижней границы экрана, чтобы он всегда был на виду и под рукой.</p> <p>Подчёркнутые ссылки отлично встраиваются в текст. В интерфейсах используйте более привычные и информативные элементы управления.</p> <p style="font-size:13px; margin-top:30px;">Присылайте вопросы о визуализации данных, организации времени, рабочем процессе, спорте и путешествиях на почту: <a href="mailto:mail@infotanka.ru">mail@infotanka.ru</a>. Ответы публикуются по понедельникам.</p> Mon, 10 Mar 2014 15:22:16 +0300