Apple's design process @businessweek.com
— Pixel Perfect Mockups
— 10 to 3 to 1
— Paired Design Meetings
— Pony Meeting
Последний пункт особенно хорош, ниже перевод.Это возвращает нас к истории, рассказанной ранее (Michael) Lopp, в которой он рассказывал как главные менеджеры описывают что они хотят от каждого приложения: «Я хочу WYSIWYG ... Я хочу чтобы оно поддерживало осноные браузеры... Я хочу чтобы оно отражало дух нашей компании». Или, как переводит Lopp, «Я хочу пони!». Он добавляет «А кто не хочет? Пони — это прекрасно». Проблема, по его словам, заключается в том, что эти люди описывают то что они думаю что хотят. И даже если это чушь, их мнение нельзя игнорировать — они платят деньги!
Книга «Effective Prototyping for Software Makers» настолько хороша, что стоило бы порекомендовать её раньше. Это настоящая библия проектирования интерфейсов, постановки процессов, методов, инструментов. Она предназначена как для проектировщиков интерфейсов, так и для менеджеров проектов. С другой стороны, прочитать её полностью довольно сложно. В книге очень дотошно расписываются многие вещи, которые можно посчитать очевидными. Я не нашел в себе сил прочесть её полностью, поэтому пишу о ней только сейчас.
Книга очень основательна (около 600 страниц). В ней подробно рассматривается процесс проектирования в целом, какие шаги предшествуют прототипированию и какие данные нужны на входе, что получается в результате прототипирования и как полученное использовать в дальнейшем процесс разработки. Рассказывается как выбрать наиболее подходящие для конкретного проекта методы прототипирования. Подробно рассматриваются такие методы, как card sorting, wireframe, storyboard, paper prototype, blank model, video prototype, coded prototype.
Для выбора метода и средства прототипирования сначала предлагается выбрать детализацию составляющих прототипа: интерактивная составляющая, навигация, визуальная, текстовая, производительность, брендинг. Рассматриваются характеристики прототипов и то, как они влияют на результат и процесс прототипирования.
В каждой главе делаются специальные вставки для менеджеров проектов, а в конце главы рассматривается пример из жизни гипотетической компании.
Примерно половина книги посвящена подробному рассмотрению каждого из методов прототипирования, а также несколько есть глав о конкретных инструментах прототипирования — Microsoft Word, PowerPoint, Excel, Visio и Adobe Acrobat.
Читать всю книгу целиком — это несколько излишне, скорее она подходит в качестве справочника. Главы, посвященные конкретным методам и инструментам прототипирования, можно читать по мере необходимости.
Книга очень полезна для осознания процесса проектирования интерфейсов, и чтобы понять как этот процесс встроить в работу своей компании или отдела.
Книгу «Effective Prototyping for Software Makers» ( Jonathan Arnowitz, Michael Arent, Nevin Berger) можно купить на Амазоне или взять почитать у меня.
Встраивание звукового файла в страницу очень симпатично сделано на computerra.ru (например, в конце статьи).
Вот так выглядит плеер в неактивном виде:
А так выглядит плеер во время воспроизведения:
Ну, из недостатков — мне все-таки хотелось бы знать сколько времени всего длится семпл, и сколько трафика я потрачу на прослушивание (это я хотел бы знать до прослушивания).
Семинар сообщества RusCHI
ru_ucdesign на тему «Различные подходы к юзабилити-проектированию»В ноябре пройдет очередной юзабилити семинар сообщества RusCHI. Предварительная тема - "Различные подходы к юзабилити-проектированию". Множество конференций связанных с юзабилити пробудили общественный интерес, многие обсуждают какой подход "самый правильный". На семинаре несколько специалистов коротко опишут различные подходы (3-5 докладов по 15-20 минут), затем организуем круглый стол, обсудим эту информацию.
Я не разу не ходил на семинары RusCHI, тема интересная, постараюсь поприсутствовать. Действительно, на User Experience 2007 были два внятных доклада о сложившемся процессе проектирования, в компаниям IT-Online (Андрей Пономарев) и EPAM (Геннадий Драгун). Также был доклад 1С (Александр Безбородов), но тема процесса проектирования не была раскрыта. По двум остальным докладам заметно, что подход действительно сильно отличается. Было бы интересно послушать как с этим обстоит дело в других компаниях.
Из книги «Designing Interfaces: Patterns for Effective Interaction Design» получился бы неплохой сайт (кстати, есть сайт). На мой взгляд, оформление каталога типовых решений («best practices» в отношении паттернов лучше всего переводится как «типовые решения») для проектирования интерфейсов в виде книги — не самое правильное решение.
Принцип, на котором основана книга: простые в использовании приложения проектируются так, чтобы быть узнаваемыми. Именно для этого и нужны паттерны — обеспечивать узнаваемость интерфейса.
Согласно книге, паттерном можно назвать описание наилучших методик в определенной предметной области. Паттерны фиксируют распространенные решения для проблем проектирования, и, по определению, не являются чем-то новым
.
Паттерны полезны для формирования терминологии — проектировщики могут использовать единые названия паттернов, чтобы понимать о каком интерфейсном решении идет речь.
Возможно, мои ожидания были выше из-за того эффекта, который произвела на меня книга о паттернах в программировании. Нельзя всерьез воспринимать программиста, не знающего о паттернах. Паттерны в программировании — это практически единственный способ удаленно ознакомиться с лучшими практиками в отрасли. И эти паттерны необходимо действительно знать и обращаться за ними к справочнику по мере необходимости, вместо очередного изобретения велосипеда.
В то же время паттерны в интерфейсах находятся на виду. Любой проектировщик интерфейсов, имея достаточный опыт общения с интернетом и софтом, получает у себя в голове огромный справочник интерфейсных решений, к которому он обращается постоянно, на интуитивном уровне.
Таким образом, каталог паттернов может пригодиться начинающему проектировщику, чтобы получить обзор известных решений. Также книгу хорошо прочесть для систематизации имеющихся знаний. Если на протяжении всей книги вы не встретите для себя ничего нового, это не должно вас разочаровать, ведь задача автора — собрать и систематизировать всем известные типовые решения для интерфейсов.
В книге есть интересная глава о паттернах, относящихся к общим принципам разработки интерфейсов (выглядит наивно для психологов). Также, в книге есть неинтересная глава о паттернах, относящихся к визуальному дизайну (выглядит наивно для дизайнеров).
Книгу «Designing Interfaces: Patterns for Effective Interaction Design» by Jenifer Tidwell можно заказать на Амазоне или взять почитать у меня.
P.S. Появился русский перевод.
Pattern Library for Interaction Design @welie.comСайт содержит большое количество «наилучших практик» для проектирования взаимодействий. С годами я собрал примеры и находки по применению, которыми я хочу поделиться с вами на этом сайте. На самом деле, вы не найдете здесь новых открытий. Все эти решения уже применялись. Смотрите на это как на справочник или базовый инструментарий, который вы можете использовать для проектирования пользовательских интерфейсов. Это не заменит креативного подхода, это просто попытка описать наши знания о то чему мы научились, о широко распространенных решениях, в интернете и даже за его пределами. Каждое решение, описанное в наших паттернах, может работать в одном контекте, но провалиться в другом. Вы должны понимать как и почему решение зависит от контекста. Я высказываю на этом сайте свое мнение, но это повод для новых находок, так что сайт будет обновляться!
Ссылка на сайт найдена в книге «Designing Interfaces: Patterns for Effective Interaction Design» by J.Tidwell.
Книга «Information Dashboard Design» — первая прочитанная мною книга, в которой рассказывается именно о проектировании интерфейсов, точнее о проектировании экрана. Не о процессе проектирования, не о визуальном дизайне, не о юзабилити, не об информационной архитектуре и не о задачах пользователя. Иными словами, эта книга именно о том, что нужно проектировщику. Именно это я ожидал прочесть, открывая все эти книги до того. Это показывает основную проблему с заголовками книг — заголовок отражает содержание книги, но не то, что ты из этой книги вынесешь.
Информационная панель, dashboard, определяется как визуальное представление наиболее важной информации, необходимой для достижения определенных целей, полностью умещающейся на одном экране, так что её можно охватить одним взглядом.
Книга написана очень по-американски, она лаконична и хорошо структурирована, поэтому в малом количестве страниц сконцентрировано много важного. Ввиду специфической темы — проектирование именно информационных панелей, dashboard — в книге удалось обойтись без упоминания информационной архитектуры, навигации, анализа задач пользователя и многого другого, сконцентрировавшись на одном — как максимально эффективно отобразить на ограниченном пространстве экрана максимум информации, не утратив простоты, лаконичности и понятности.
Эта книга прекрасна не только содержанием, но и формой. Многие книги с Амазона приятно держать в руках благодаря хорошей полиграфии и верстке, но эта книга просто вызывает эстетический восторг. Выбор цветов, page layout и подача графиков, таблиц и иллюстраций полностью соответствует принципам, о которых в этой книге рассказывается. Нечасто встретишь такое единство содержания и формы. Что тут можно сказать — покупая книгу, взгляните на её оформление, благо сайт Амазона позволяет это сделать. Если книга о проектировании, а страницы не оставляют впечатления лаконичности и законченности — стоит задуматься о целесообразности покупки.
В книге дается определение информационной панели, предлагается классификация информационных панелей и приводятся рекомендации по проектированию для каждой категории. Затем приводятся частые ошибки при проектировании, при этом рассматривается много примеров реальных информационных панелей. Рассказывается о принципах визуального восприятия и графического дизайна, и как эти принципы применяются для проектирования. Описываются стандартные компоненты, хорошо подходящие для использования на информационных панелях. В заключение приводятся примеры проектирования панелей для различных целей, которые показывают как применяются описанные в книге принципы.
Центральное место в изложении отводится принципу, сформулированному еще Эдвардом Тафти, и переведенному в современную форму — ни одного лишнего пикселя. В соответствии с этим принципом, каждый пиксель на экране должен быть задействован и его применение должно быть логически обосновано и целесообразно.
Книга очень рекомендуется всем проектировщикам пользовательских интерфейсов, дизайнерам, а также всем, кто занимается подготовкой презентаций или составлением документов с большим количеством графиков и диаграмм.
Книгу «Information Dashboard Design: The Effective Visual Communication of Data» by Stephen Few можно купить на Амазоне или взять почитать у меня.
Хорошее замечание написал
synchro (автор briefly.ru):При проектировании интерфейс рассматривают не с точки зрения логики и простоты, а понятности для тупорылого пользователя. Эх, консерваторы… Так ещё долго интерфейсы не станут лёгкими и прозрачными.
И еще:Проектируя интерфейс, надо думать в первую очередь не о простоте выполнения пользователем сценариев, но о правильности оных.
Почему-то тестовые задания по юзабилити часто не юзабельны. Все ведь знают (или должны знать) определение юзабилити, в котором три раза упоминается слово «определенные»: определенные пользователи решают определенные задачи в определенном контексте. При этом тестовое задание обычно выглядит так: вот вам формочка (сайт, страница, приложение), как бы вы его улучшили? По прочтении таких тестовых заданий начинаешь понимать юзабилистов как некоторых волшебников, пришедших в этот мир со светлой целью сделать мир лучше. Как и положено волшебникам, юзабилисты не пользуются никакой дополнительной информацией, им достаточно взмахнуть волшебной палочкой, чтобы все проблемы разрешились, и формочка стала лучше.
Можно понять источник проблемы, когда тестовое задание ставится людьми, имеющими о юзабилити смутные представления. Но в таком случае непонятно как относиться к конторам, знающих о юзабилити не понаслышке.
Как реагировать на такие тестовые задания?
Вариант «сам себе аналитик» заключается в том, чтобы, исходя из интерфейса и документации к нему, сделать некоторые предположения о пользователях, задачах и контексте. Затем выделить наиболее важные задачи, или временные ограничения, или выбрать какой-то другой параметр оптимизации интерфейса, по нему и показать свои способности. Этот вариант возможен, если у вас есть детализированный и конкретный интерфейс.
Можно сделать некоторые предложения общего характера, приемлемые для данного вида интерфейсов — существуют check lists для веб-интерфейсов, для десктопных приложений, есть открытые и доступные всем стандарты, хорошие правила. Однако, эти правила плохи тем, что имеют широкую направленность, и некоторые правила для данного конкретного интерфейса могут быть вовсе неприменимы, а в некоторых случаях вы просто не найдете правил и стандартов, подходящих для вашего интерфейса.
На мой взгляд, наилучшим выходом является просветительская работа — вы рассказываете работодателю о сложностях с его тестовым заданием, делаете некоторые предложения, если элементы и проблемы интерфейса совсем уж очевидны, рассказываете о предварительной работе, которую необходимо выполнить, чтобы тестовое задание можно было выполнить. С одной стороны, вы оцениваете таким ответом адекватность заказчика, с другой стороны — проявляете свои познания и показываете пригодность для дальнейшей работы.
Для работодателей также будет полезно знать: если в ответ на предложения «улучшить интерфейс» человек выдает кучу ценных предложения типа «давайте покрасим кнопочки в синий цвет», то этого скорее дизайнер, чем специалист по юзабилити, или, того хуже, программист («давайте все переделаем на Java» или «табличная верстка давно уже не применяется»).
Best Practices For Form Design (Luke Wroblewski) (презентация в PdF, 3Mb, 112 слайдов) @lukew.com
Грамотная подборка советов о проектировании форм.
Три правила дизайна элегантных интерфейсов (Статья+презентация) @usethics.ru
Советы о создании эстетичных интерфейсов.