Технолог-дизайнер в жизни

В Гетвеаре я не только ведущий разработчик, но и ведущий дизайнер, представьте себе! Мой сериал-фантазия «Технолог — тоже дизайнер» материализовался.

Не всё даётся быстро и просто, но мне нравится, сдаваться не собираюсь.

Вот моя любимая форма со всеми измерениями джинс, тело — выкройка — ожидаемые джинсы — получившиеся джинсы, так она выглядела до нашей эры:

Два месяца назад чуть лучше:

Перед передачей в производство операторы проверяют пользовательские мерки на ошибки. За время работы у них накопился ряд признаков, по которым можно определить явную диспропорцию. Такая проверка — на глаз по нескольким таблицам — неприятная рутина, почему бы не поручить её роботу.

Когда всё хорошо, он молчит:

Но это бывает редко, люди сделаны не по Левайсу, так выглядит допустимое отклонение:

Бывает всё совсем плохо, тогда надо написать человеку письмо и убедиться, что он не измерил себя линейкой:

Вроде хорошая форма. Плохо только то, что суть ошибки и инпут с ошибочным измерением далеки друг от друга. Чтобы хоть как-то их связать, я подчеркнул части тела в тексте дыдыдышками, клик по которым ставил фокус в нужное поле.

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

В таком месиве сложно разобраться что к чему.

Пришлось всё передизайнить — ошибки переехали прямо к инпутам, их текст стал более специфичным, красный фон сменился тоненьким бордюром:

Теперь, даже когда всё ужасно с мерками, интерфейс не взрывается.

Share
Send
Pin
← Ctrl →
5 comments
Вадим Макеев 2013

Левис же, какой Ливайс :(

Артём Поликарпов 2013

Что даже нос у смайлка забыл :-(

Сергей Дроганов 2013

Бессмысленный текст “Auto check: error”. Тем более трижды повторенный. Напиши что-нить типа “Measurement warning — it looks like... please check this and that”. Это больше похоже на инструкцию для оператора.

Артём Поликарпов 2013

Все пояснения у полей. Этот текст нужно убить, согласен. Саша Карпинский подсказал, что нужно просто кнопочку красной сделать.

Сергей Дроганов 2013

Плохая подсказка, если будут предупреждения по всем трем колонкам, то тогда можно будет на автомате решить, что кнопки задуманы быть красными и проморгать (sleep).

Нужно оставить кнопку синей, а слева указать количество предупреждений в каком-нить желтом тултипе.

Approve body < with 7 warnings |

Опять же, со стороны больше похоже, что ты имеешь дело с предупреждениями а не ошибками. Кажется что error не к месту употребляется.

Дмитрий 2013

Разрешите поинтересоваться стилем ворнинг сообщения в последнем варианте: почему выбран именно темный фон с белым шрифтом?
Не претендую на абсолют, но:

  • не кажется ли, что это утяжеляет всю страницу?
  • не лучше ли было бы иметь ворнинг поп-ап по стилю похожим на остальную – страницу (светло-розовый фон, красная рамка и стандартный текст)?
Артём Поликарпов 2013

Это стандартный тултип из Бутстрапа 2, не более.

Артем 2013

Реализовано явно лучше, чем было. Но как по мне, так это тривиальные задачи для фронтендера. Бутстрап верстка + немного JavaScript’а.

Popular