Итак, задача — разработать систему управления проектами по созданию и поддержке веб-сайтов со следующими возможностями:

• возможность раздельного отображения входящих и исходящих (поставленных пользователем) задач;
• возможность назначать задачам типы работ с определенной тарификацией и объединять задачи по проектам;
• возможность легко отмечать небольшие отрезки времени затраченного на задачу в течении дня, сразу же по завершении этого отрезка работы. Это актуально для менеджеров проектов и технической поддержки, которые тратят по 10 раз по 20-40 минут в день на проект, а проектов одновременно от 5 до 10;
• возможность участия клиентов в качестве пользователей (экстранет);
• возможность получения отчетов по загрузке сотрудников и биллинговой информации по выполненной работе для клиентов. Соответственно возможность установки различных тарифов на разные виды работ.

На экране входящих задач, с которого начинает работу пользователь, мы видим поставленные пользователю задачи. Зеленым выделены новые (в статусе «Регистрация»), оранжевым просроченные. Флажками отмечены задачи с высоким приоритетом. Всплывающий слой рядом с «плюсиком» позволяет не открывая карточку задачи добавить затраченное только что время.

Ниже списка задач расположена диаграмма Ганта, чтобы оценить время и уровень загрузки. Сейчас я сделал бы ее с переключателем, чтобы по умолчанию был табличный вид, а диаграмма включалась по желанию пользователя. Впрочем, так и сделано на экране исходящих задач, поскольку там гораздо больше данных.

Карточка задачи в общем обычная для таких систем. Цветом разделено содержание и свойства задачи. Набор доступных опций для редактирования свойств разный для каждой роли пользователя. Из приятного — выделены ключевые параметры задачи: дедлайн и приоритет. Приоритет снимается и назначается одним кликом по иконке флажка.

На экране добавления/редактирования проекта можно сразу установить доступ к проекту. В компании относительно небольшой штат и нет необходимости разделять доступ к проектам между сотрудниками. Поэтому по умолчанию проект сразу доступен всем сотрудникам компании, а сотрудников компаний-клиентов можно добавлять отдельно.

Локальная задача: разработать удобный интерфейс для сдачи экзамена на время при условии, что за 2 часа нужно ответить на 60-80 вопросов по 3-5 вариантов ответа в каждом.

Особенности: нужно предусмотреть возможность пропустить сложный вопрос и затем легко к нему вернуться, когда останется время (таймер).

Изначально заказчик ориентировался на следующий пример:

Как видите, возможности пропустить ответ нет, номера вопросов расположены в виде кубика Рубика, а головоломок хватает, достаточно вчитаться в текст вопросов. Самый главный недостаток такого решения то, что все 30 (в данном случае) вопросов находятся на одном экране и для того, чтобы ориентироваться в них, нужно не спеша прокручивать  страницу туда-сюда и поглощать массу ненужной информации.

Решение очевидно — поэкранное отображение вопросов. С возможностью выделения цветом тех вопросов, на которые дан ответ. Таймер выделить, чтобы экзаменующийся чувствовал себя спокойно :)

Кроме интерфейса прохождения теста, в рамках проекта нужно было разработать систему полностью: создание новых тестов, вопросов, ответов, архив, список учащихся и т.п.

Среди прочего, была интересная задача по отображению результатов пройденного теста. Поскольку у вопросов не было заголовков, а только номера, то список номеров с вариантами ответов данных пользователем и правильных ответов, представлял бы собой совершенно нечитаемую абракадабру. На помощь пришел JS и скрытые слои. При наведении на вопрос отображается его текст и варианты ответов. А поскольку эта информация в скрытых слоях, то таблица смотрится компактно.