Обычно разработчиков мало беспокоит дизайн продукта. А ведь его тщательная разработка экономит и время, и деньги.

Часто можно наблюдать, как программисты начинают работу без оглядки на дизайн будущей программы. Функционал при этом остается вполне работоспособным, но дружелюбного для пользователя интерфейса может не быть совсем. А кому нужна программа, в которой невозможно разобраться? Если ситуация запущена окончательно, может возникнуть необходимость привлечь к работе дизайнера, когда проект почти готов. А это, в свою очередь, потребует времени и дополнительных затрат - надо будет переписывать код, тестировать, дорабатывать. В итоге, можно просто не успеть закончить работу в срок, потерять время, израсходовать дополнительные средства. Хорошо, если удастся избежать штрафных санкций.

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

"Но неужели программисты не могут сами спроектировать удобный, интуитивный интерфейс? - спросите вы. Ведь все они отлично знают, как он должен выглядеть!".

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

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

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

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

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

На что следует обращать внимание дизайнеру в работе?

Конечно же, на простоту и удобство интерфейса ПО для конечного пользователя. И здесь придется опираться на опыт и интуицию. До конца оценить качество разработки интерфейса вряд ли удастся. Заключительный вердикт, как правило, остается за теми, для кого предназначена программа.

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

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

...Дизайнер разработал графические новшества или часть интерфейса. Как ему донести свои идеи до программиста, заказчика, до руководителя проекта?

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

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

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

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

Впрочем, и у скриншотов есть свои минусы. В программировании нередко используется "опенсорсный" Linux, в котором графика выглядит не так, как в Windows. Там другие шрифты, выравнивание, отступы. Реализация интерфейса под Linux по скриншоту может вызвать небольшие ошибки.

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

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

Как дизайнеру наладить связь с программистами?

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

Избежать этого, как ни странно, помогут профессионализм и знания дизайнера в смежных областях - языках программирования, PHP, HTML. Знающий специалист в состоянии оценить трудозатраты программистов на реализацию его собственных идей и на основании этого решить, внедрять их или нет.

Желательно, чтобы дизайнер был немного психологом - поскольку общение в коллективе специалистов требует терпения и умения слушать. И, конечно, ему потребуются внимание и точность - качества, без которых немыслима работа в программинге.

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

Разбивая программу на блоки, можно добиться ускорения и повышения качества разработки интерфейса. При создании графической части ПО необходимо работать над ее упрощением и пользовательской навигацией. В ходе взаимодействии дизайнера с программистами и заказчиком необходимо комбинировать использование прототипов и скриншотов. И при этом нельзя забывать об огромной роли межличностных отношений в коллективе.

Эдуард ТРОШИН

Автор благодарит компанию EPAM за помощь в подготовке материала.