Как стать автором
Обновить

Акция «Интерфейс=понимание»: первые результаты работы

Время на прочтение5 мин
Количество просмотров617
imageДоброго дня, друзья!

Меня зовут Бьорн Лундстрем, и я руковожу командой дизайнеров клиентских приложений (CAUID team) в рамках акции «Интерфейс=понимание».

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

Тем не менее, давайте посмотрим, к чему мы пришли на данный момент.

Orga


Картинки кликабельны

image image
Рассказывает Питер Вельдерсон:

«Идея комплексного органайзера для секретаря и руководителя вовсе не нова. Я встречал подобные программы и в конце девяностых, и в начале двухтысячных, когда сайты вроде softpedia стали объектами массового внимания начинающих разработчиков.

Тем не менее, в этой концепции есть то, что принципиально отличает её от всех других — весьма привлекательный набор функций, которые отлично интегрируются в рабочий цикл руководителя — календарь, почтовый и RSS-клиенты, CRM-подобная система контактов, и т. п.

К сожалению, это не только основной плюс, но и основная проблема этого проекта. Дело в том, что каждую функцию органайзера программист представил на отдельной вкладке. Это не только не упорядочивает работу с программой, но и делает её хаотичной, заставляя пользователя метаться по разным вкладкам для просмотра смежной информации.

Моя основная работа над этим проектом будет заключаться в… максимальном объединении функций. С одной стороны, это упростит восприятие органайзера, с другой — увеличит итоговую продуктивность.

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

Работу над юзабилити я решил начать с вкладки „Почта“ — здесь модификации наиболее очевидны. Я избавился от вкладок второго уровня „Новости“ и »Факсы", объединив все три сущности на одной вкладке "Почтовый ящик".

Воспользовавшись прекрасным набором иконок Fugue (всегда использую его для скетчей), я выбрал иконки, наиболее подходящие для олицетворения основных функций работы с сообщениями, факсами и новостями.

Учитывая то, что не каждый менеджер или секретарь может позволить себе монитор с большим разрешением, при реализации окна сообщений я решил опираться на опыт Mozilla Thunderbird, а не Outlook. Список сообщений, таким образом, расположен сверху, а окно просмотра сообщения — непосредственно над ним. Над списком сообщений я расположил небольшую, но функциональную панель, на которой, в зависимости от выделенного элемента, будет отображаться список действий".

Chameleon Windows Startup Manager


Картинки кликабельны

image image
Рассказывает Сванте Стрикхольм:

«Вероятно, мне повезло в большей степени, чем другим разработчикам, так как Chameleon Startup Manager — достаточно продуманная программа. Конкуренция на рынке конфигураторов автозагружаемых приложений под Windows заставила автора продумать и юзабилити, и нюансы оформления.

Мои претензии к главному окну программы минимальны. Диалоговые окна вызывают гораздо большее количество вопросов. Слишком большое количество полей ввода, чересчур яркие ссылки на справочные разделы, дублирующие функции — работа над всем этим предстоит впоследствии.

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

В новом дизайне я решил пойти на необычный и спорный ход — несколько изменить новейшие метафоры оформления Windows и добавить к ним иконки с закруглёнными краями „а-ля iPhone“.

Параллельно я оптимизировал панель инструментов, перенеся на неё быстрый поиск по элементам и убрав второстепенные элементы в строку меню. Это помогло придать ей более чёткий и аскетичный вид.

Аналогичному разграничению элементов подверглись и боковая панель (там дополнительные функции вынесены в меню „More...“), и список приложений (там второстепенные значения выглядят немного светлее). Текстовые поля в нижней панели были упорядочены, благодаря чему туда поместился дополнительный SpinEdit для настройки задержки.

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

CodySafe


Картинки кликабельны

image image
Рассказывает Туве Сиверс:

«Четыре года назад мне подарили „флэшку“ на 512 мегабайт, чему я была несказанно рада. Тогда это ещё было редкостью. Сегодня любого человека, связанного с IT, сложно представить без flash-накопителя. Такая распространённость двигает рынок portable-приложений к небывалому развитию.

CodySafe — простое, но необходимое приложение. По сути, это удобное меню, появляющееся из системного трея при вставке flash-дисковода, и позволяющее запустить любое из присутствующих на нём портативных приложений.

В качестве первого шага я решила обновить дизайн самого меню — на мой взгляд, он был слишком перегружен метафорами Windows Vista — излишними градиентами, выпуклостями и эффектами „стекла“. Я немного уменьшила меню в ширину и привела его в большее соответствие с метафорами Windows 7. При отрисовке с нуля потерялся объём, над этим ещё предстоит работать. Цвет заголовков пунктов был изменён с чёрного (контурная обводка показалась мне ужасной) на белый с лёгкой тенью.

Я перегруппировала элементы в правой части меню, вынеся логотип программы в отдельный прозрачный шилд над ним, и сделав первым пунктом ссылку на Проводник. Логично, что обычный пользователь с гораздо большей частотностью будет обращаться к корню flash-диска, чем к отдельным тематическим папкам. В левой части меню добавилась панель быстрого поиска — по моей мысли она поможет искать портативные приложения не только на диске, но и — при наличии подключения — в Интернете.

Вопреки метафорам Windows 7, я не стала избавляться от иконок для правой части меню, а использовала их системные аналоги, более приятные и сбалансированные по цвету. Для отрисовки кнопок извлечения и остановки диска мне пришлось вернуться к метафорам Vista. Я сделала градиенты кнопок менее агрессивными.

В целом, меню стало выглядеть гораздо лучше. Окончательная доработка оформления и работа с окном настроек поможет сделать приложение комфортным для повседневного использования».

От руководителя команды:


Наша акция продолжается. Если вы хотите заказать дизайн или редизайн интерфейса клиентского приложения у нашей команды и получить скидку в 40% от рыночной стоимости, напишите заявку в свободной форме на interface[at]iunderstand.ru; для заказа юзабилити-тестирования отправьте заявку в свободной форме на usability[at]iunderstand.ru

С уважением,
Бьорн Лундстрем.
Теги:
Хабы:
+1
Комментарии42

Публикации

Истории

Ближайшие события

Weekend Offer в AliExpress
Дата20 – 21 апреля
Время10:00 – 20:00
Место
Онлайн
Конференция «Я.Железо»
Дата18 мая
Время14:00 – 23:59
Место
МоскваОнлайн