SlideShare une entreprise Scribd logo

Design Matters

•
•
Constantin Kichinsky
Constantin Kichinsky

Design Matters, Константин Горский, Клуб MAInfo.ru

1  sur  157
Télécharger pour lire hors ligne
Дизайн решает! Константин Горский дизайнер
1 Вступительная часть
1.1 Вот с чем мы сегодня познакомимся: Вступление Что такое дизайн и почему вам нужно об этом знать Основы теории юзабилити Проектирование интерфейса Некоторые идеи интерактивного дизайна Некоторые идеи графического дизайна Основные контролы и правила их использования Заключительная часть
1.2 Организационные моменты Пожалуйста, не стесняйтесь спрашивать меня, если вам что-то непонятно. Глупых вопросов не бывает!
2 Что такое дизайн и почему вам нужно об этом знать
2.1 А как вы понимаете, что такое «дизайн»?
2.2 Определения из словарей и энциклопедий Дизайн — это ... творческий метод, процесс и результат художественно-технического проектирования промышленных изделий, их комплексов и систем, ориентированного на достижение наиболее полного соответствия создаваемых объектов и среды в целом возможностям и потребности человека, как утилитарным, так и эстетическим вид деятельности по проектированию предметного мира специфический ряд проектной деятельности, объединивший художественно-предметное англ. design — проектировать, творчество и научно обоснованную чертить, задумать, а также инженерную практику в сфере проект, план, рисунок индустриального производства художественное конструирование предметного творческая деятельность, целью мира; разработка образцов которой является определение рационального построения предметной среды формальных качеств промышленных изделий
фото: Rune T (flickr) 2.3 Дизайн конфеты
2.4 Стив Джобс (глава Apple) — В речи большинства людей «дизайн» означает облицовку. Но это совершенно не так! Дизайн — это основа и душа любого человеческого творения. фото: msnbc.msn.com
2.5 Том Питерс (бизнес-гуру) — Дизайн — это страсть, эмоция и приверженность — и все это должно быть в сердце любого бизнеса. фото: www.tompeters.com
2.6 Гомер Симпсон — Да при чем тут дизайн, они меня пытали! Они сожрали мои пончики!
2.7 Понятие «user experience» Было Есть «Продукт» или «услуга» «Переживания» Это хороший товар Это кайф, писк Он работает Он оставляет воспоминания «Я рад, что купил его» «Я хочу еще!» Удовлетворенный клиент Член клуба Постоянный клиент Маркетинг из уст в уста Вы получаете то, за что Вы удивлены и в восторге от платите каждого поворота Товар вам по карману Товар вам по душе Удовлетворяет вашу Помогает вам потребность самоопределиться
2.8 Компании, пекущиеся о дизайне
2.9 Компании, пекущиеся о дизайне
2.10 Компании, пекущиеся о дизайне
2.11 Компании, пекущиеся о дизайне
2.12 Компании, пекущиеся о дизайне На этом слайде когда-нибудь будет ваша компания
2.13 К чему же приводит такой подход? Apple, Google, Nokia, Microsoft, ... 1 Повышается лояльность постоянных клиентов, легче и быстрее происходят все согласования 2 Многократно увеличивается вероятность привлечения новых заказчиков 3 Сокращается число обращений в службу поддержки, претензий и замечаний, увеличивается число положительных и восторженных отзывов
2.14 Почему именно вам нужно об этом знать Да задолбала эта документация!!!
2.15 Почему именно вам нужно об этом знать
3 Основы теории юзабилити
3.1 Дизайн должен быть простым.
3.2 В основе юзабилити лежит здравый смысл.
3.3 Согласно ISO 9241-11 Юзабилити — это степень эффективности, продуктивности и удовлетворенности, с которыми продукт может быть использован определенными пользователями при определенном контексте использования для достижения определенных целей. Usability — the extent to which a product can be used by specified users to achieve specified goals with efficiency, effectiveness and satisfaction in a specified context of use.
3.4
3.5 Значимые факторы юзабилити Фактическая скорость работы пользователя, субъективная скорость работы пользователя, скорость реакции системы, количество че- ловеческих ошибок, скорость обучения, успешность, мощность, стоимость разработ- ки, стандартность, совместимость, wow-фак- тор, настраиваемость, легкость исправления ошибок, воспринимаемая сложность, субъек- тивная удовлетворенность…
3.6 Характеристики Шнейдермана Бен Шнейдерман — американский ученый, профессор, изучающий фундаментальные основы взимодействия человека с компьютером. Превед! фото: cs.umd.edu/~ben/
3.7 Характеристики Шнейдермана — Скорость работы — Количество человеческих ошибок — Скорость обучения — Удовлетворенность пользователей — Запоминаемость
3.8 Юзабилити-тестирование — Насколько плох или хорош интерфейс? — Лучше ли он старого? — Быстро ли удается выполнить действия? — Ошибаются ли пользователи? — Есть ли проблемы? — Довольны ли пользователи?
3.9 Что нужно для тестирования — Респонденты — Метод тестирования — Тестовые сценарии — Рабочее место для теста — Протестированный тест
3.10 Респонденты УРААА!!! Нас снова пригласили на юзабилити-тестирование! фото: tookie (flickr)
3.11 Количество респондентов 70% проблем 85% проблем
3.12 Опыт работы с системой есть отсутствует
3.13 Уровень компьютерной грамотности высокий низкий
3.14 Возраст целевой старше
3.15 Пол Пропорциональное количество женщин стоит чуть увеличить по сравнению с целевой илл.: Артемий Лебедев аудиторией.
3.16 Пассивное наблюдение
3.17 Поток сознания Здесь, кажется, я должен поставить галочку...
3.18 Активное вмешательство А почему вы нажали сюда? Нууу...
3.19 Тестовые сценарии — Задачи пользователей должны быть реальными (из жизни) — Можно оставить только важные задачи (частотные, опасные)
3.20 Тестовые задания должны быть: — однозначно понятными — сформулированными полностью — при этом достаточно краткими — не содержащими в себе подсказок — содержащими точку начала выполнения задания — такими, чтобы респондент должен был сначала решить, нужно ли в данное время выполнять действие
3.21 Проведение тестирования 1 Ввести респондента в задачу 2 Выяснить его ожидания от системы 3 Протестировать интерфейс 4 Выяснить, насколько оправдались ожидания 5 Завершить тест
3.22 Анкетирование удовлетворенности Пожалуйста, подчеркните любые слова, которые, на ваш взгляд, подходят для описания этого интерфейса: Некрасивый Тусклый Устаревший Тупой Полезный Удобный Тормозящий Неэффективный Теплый Дружественный Непредсказуемый Тоскливый Наивный Управляемый Эффективный Опасный Нечеткий Непоследовательный Легкий Головоломный Ненадежный Привлекательный Любительский Стандартный Анкета: Владислав Головач Светлый Комфортабельный Запутанный Приятный Плохой Загадочный Профессиональный Безопасный Неприятный
4 Проектирование интерфейса
4.1 Дизайн всегда делается для людей фото: evie22 (flickr)
4.2 Концептуальные подходы Ориентация на пользователей на задачи/цели пользователей на деятельность пользователей
4.3 User-centered design На слэдущей виходишь, дарагой? фото: Edge of Space (flickr)
4.4 Анализ целей пользователя фото: lightplace (flickr)
4.5 Когнитивная психология Действие состоит из следующих этапов: 1 формирование цели 2 формирование намерения 3 определение конкретных действий 4 выполнение действий 5 восприятие нового состояния системы 6 интерпретация изменений 7 оценка результата
4.6 Оптимизация действия Хороший дизайн: 1 нагляден 2 имеет ясную концептуальную модель 3 указывает возможные действия 4 позволяет легко выполнить действия 5 говорит, находится ли система в необх. сост. 6 имеет хорошее соотв. между сост. и его отобр. 7 имеет внятную обратную связь
4.7 Прототипирование интерфейсов фото: www.DaveWard.net (flickr)
фото: Shawn Medero (A List Apart) 4.8 Бумажный прототип
фото: Shawn Medero (A List Apart) 4.9 Бумажный прототип
4.10 Структурный скетч илл.: Андрей Оконечников
4.11 Прототип в html
5 Некоторые идеи интерактивного дизайна
5.1 Логика! В интерфейсах логика важнее эстетики.
илл.: Макар и Студия Артемия Лебедева 5.2 Повелитель фотошопа
5.3 Тут всё понятно фото: Trendir.com
5.4 А вот это уже не совсем ясно... илл.: Студия Артемия Лебедева
5.5 А вот это уже совсем не ясно! илл.: Студия Артемия Лебедева
5.6 Информативность и наглядность Дизайн должен подсказывать, какие действия возможны в данный момент. Дизайн должен быть наглядным.
5.7 Как открыть дверь? фото: Thomas Hawk (flickr.com)
5.8 Аффорданс Объект должен показывать способ своего использования своими неотъемлемыми свойствами.
5.9 Вкладки Вопрос: в каком разделе я нахожусь?
5.10 Пример: заполнение формы
5.11 Пример: заполнение формы
5.12 Пример: заполнение формы
5.13 Пример: заполнение формы
5.14 Пример: четкое визуальное выделение
5.15 Пример: четкое визуальное выделение
5.16 Пример: четкое визуальное выделение
фото: Indesit 5.17 Мэппинг
5.18 Мэппинг
5.19 Мэппинг
илл.: Артемий Лебедев 5.20 Теория близости
илл.: Артемий Лебедев 5.21 Теория близости
идея илл. Артемия Лебедева 5.22 Теория близости
идея илл. Артемия Лебедева 5.23 Теория близости
5.24 Закон Фиттса 2 × расстояние до объекта Время прицеливания = k log2 размер
5.25 Закон Фиттса
5.26 Принцип обратной связи — Мгновенная проверка ввода — Индикация ошибок — Отображение прогресса — Подтверждение действия
5.27 Мгновенная проверка ввода
5.28 Роботизация
5.29 Обязательные для заполнения поля
5.30 Простота
6 Некоторые идеи графического дизайна
6.1 Незаметность дизайна
6.2 Незаметность дизайна
6.3 Пространственные отношения
6.4 Пространственные отношения
прим.: Mark Boulton 6.5
6.6 Гармоничные пропорции 3 2
6.7 Сетка — друг и помощник дизайнера
6.8 Сетка — друг и помощник дизайнера прим.: Артем Горбунов
6.9 Сетка — друг и помощник дизайнера Пример какой-то статьи Принцип модульной сетки очень прост. Полезная часть страницы состоит из ячеек-модулей, образующих ряды и колонки. На ячейки натягиваются объекты, содержащие изображения, графики или текст, причем каждый объект может занимать прямоугольник из целого числа ячеек. Эта нехитрая идея позволяет создавать безупречно аккуратные и красивые композиции. Беспристрастный анализ любого творческого акта показывает, что монтаж изящно образует культовый образ, Solitude vs loneliness by Matilde B. @ Flickr однако само по себе состояние игры всегда амбивалентно. Иными словами, холерик дает импрессионизм, таким образом, сходные законы контрастирующего развития
6.10 Сетка — друг и помощник дизайнера Пример какой-то статьи Принцип модульной сетки очень прост. Полезная часть страницы состоит из ячеек-модулей, образующих ряды и колонки. На ячейки натягиваются объекты, содержащие изображения, графики или текст, причем каждый объект может занимать прямоугольник из целого числа ячеек. Эта нехитрая идея позволяет создавать безупречно аккуратные и красивые композиции. Беспристрастный анализ любого творческого акта показывает, что монтаж изящно образует культовый образ, Solitude vs loneliness by Matilde B. @ Flickr однако само по себе состояние игры всегда амбивалентно. Иными словами, холерик дает импрессионизм, таким образом, сходные законы контрастирующего развития
6.11 Сетка — друг и помощник дизайнера Еще пример компоновки Фото слева: OneEighteen @ Flickr Фото справа: TerData @ Flickr Принцип модульной сетки очень Эта нехитрая идея позволяет создавать прост. Полезная часть страницы безупречно аккуратные и красивые состоит из ячеек-модулей, образующих композиции. ряды и колонки.
6.12 Сетка — друг и помощник дизайнера Еще пример компоновки Фото слева: OneEighteen @ Flickr Фото справа: TerData @ Flickr Принцип модульной сетки очень Эта нехитрая идея позволяет создавать прост. Полезная часть страницы безупречно аккуратные и красивые состоит из ячеек-модулей, образующих композиции. ряды и колонки.
6.13 Пустое пространство
6.14 Пустое пространство
6.15 Пустое пространство
6.16 Цвет
6.17 Тон
6.18 Яркость
6.19 Насыщенность
6.20 Есть некоторые стереотипы «Красный олицетворяет опасность».
6.21 Есть некоторые стереотипы «Серый — скучный».
6.22 Есть некоторые стереотипы
6.23 Есть некоторые стереотипы Да Нет
6.24 Универсальное решение Гипотеза и теории Онтогенез Фантазия трансформирует Его экзистенциальная тоска неизменный декаданс, таким выступает как побудительный мотив образом, сходные законы творчества, однако энтелехия контрастирующего развития заканчивает суггестивный характерны и для процессов классицизм, таким образом, все в психике. Либидо монотонно перечисленные признаки архетипа начинает комплекс априорной и мифа подтверждают, что действие бисексуальности, таким образом, механизмов мифотворчества сходные законы контрастирующего сродни механизмам художественно- развития характерны и для продуктивного мышления. процессов в психике. Развивая эту тему, цвет трансформирует персональный инвариант, так Г.Корф формулирует собственную антитезу.
6.25 Универсальное решение с красным
6.26 Универсальное решение с розовым
6.27 Универсальное решение с оранжевым
6.28 Универсальное решение с зеленым
6.29 Цветовой контраст Чем плохо такое сочетание цветов?
6.30 Цветовой контраст Чем плохо такое сочетание цветов?
6.31 Цветовой контраст Чем плохо такое сочетание цветов?
6.32 Про шрифты и типографику фото: soozika (flickr)
6.33 Виды начертаний abcdef abcdef abcdef abcdef abcdef abcdef
6.34 Вариации насыщенности abcdefghijklmnop abcdefghijklmnop abcdefghijklmnop abcdefghijklmnop abcdefghijklmnop
6.35 Классическая антиква
6.36 Переходная антиква Brick quiz whangs jumpy veldt fox! Brick quiz whangs jumpy veldt fox!
6.37 Новая антиква
6.38 Кларендон
6.39 Футура
6.40 Гельветика The quick brown fox jumps over the lazy dog.
6.41 Мета
6.42 Дефис, минус и тире Дефис Минус Тире илл.: Артемий Лебедев
6.43 Дефис Дефис употребляется, во-первых, для присоединения каких- либо частиц или префиксов, во- вторых, в словосочетаниях. А тире — для обозначения пауз в тексте или для выделения прямой речи.
6.44 Кавычки В русском языке традиционно применяются «ёлочки», а для «кавычек „внутри“ кавычек» — „лапки“.
6.45 Как сверстать текст красиво Функция, выпуклая кверху Скалярное произведение Отсюда естественно следует, что длина вектора изящно упорядочивает скачок функции, транслирует интеграл по что несомненно приведет нас к истине. Рациональное число последовательно транслирует бесконечной области, откуда нормальный предел функции, что неудивительно. Целое число категорически стабилизирует следует доказываемое эмпирический многочлен, таким образом сбылась мечта идиота — утверждение полностью равенство. Представляется доказано. Подынтегральное выражение необходимо и достаточно. логичным, что прямоугольная матрица очевидна не для всех. Правда, некоторые специалисты отмечают, что матожидание масштабирует абстрактный метод последовательных приближений, таким образом сбылась мечта идиота — утверждение полностью доказано. Собственное подмножество транслирует тригонометрический интеграл от функции, обращающейся в бесконечность вдоль линии, при этом, вместо 13 можно взять любую другую константу. Минимум, следовательно, соответствует интеграл по ориентированной области, таким образом, утверждение полностью доказано. Тройной интеграл расточительно проецирует косвенный математический анализ, что известно даже школьникам. Нормальное распределение непосредственно переворачивает интеграл Гамильтона, что известно даже школьникам. Первообразная функция притягивает критерий интегрируемости, что несомненно приведет нас к истине. Двойной интеграл, как следует из вышесказанного, стремительно синхронизирует стремящийся определитель системы линейных уравхорошонений, что несомненно приведет нас к истине.
6.46 Как сверстать текст красиво Функция, выпуклая кверху Скалярное произведение Отсюда естественно следует, что длина вектора изящно упорядочивает скачок функции, транслирует интеграл по что несомненно приведет нас к истине. Рациональное число последовательно транслирует бесконечной области, откуда нормальный предел функции, что неудивительно. Целое число категорически стабилизирует следует доказываемое эмпирический многочлен, таким образом сбылась мечта идиота — утверждение полностью равенство. Представляется доказано. Подынтегральное выражение необходимо и достаточно. логичным, что прямоугольная матрица очевидна не для всех. Правда, некоторые специалисты отмечают, что матожидание масштабирует абстрактный метод последовательных приближений, таким образом сбылась мечта идиота — утверждение полностью доказано. Собственное подмножество транслирует тригонометрический интеграл от функции, обращающейся в бесконечность вдоль линии, при этом, вместо 13 можно взять любую другую константу. Минимум, следовательно, соответствует интеграл по ориентированной области, таким образом, утверждение полностью доказано. Тройной интеграл расточительно проецирует косвенный математический анализ, что известно даже школьникам. Нормальное распределение непосредственно переворачивает интеграл Гамильтона, что известно даже школьникам. Первообразная функция притягивает критерий интегрируемости, что несомненно приведет нас к истине. Двойной интеграл, как следует из вышесказанного, стремительно синхронизирует стремящийся определитель системы линейных уравхорошонений, что несомненно приведет нас к истине.
6.47 Как сверстать текст красиво Функция, выпуклая кверху Скалярное произведение Отсюда естественно следует, что длина вектора изящно упорядочивает транслирует интеграл по скачок функции, что несомненно приведет нас к истине. Рациональное бесконечной области, откуда число последовательно транслирует нормальный предел функции, что следует доказываемое неудивительно. Целое число категорически стабилизирует эмпирический равенство. Представляется многочлен, таким образом сбылась мечта идиота — утверждение логичным, что прямоугольная матрица очевидна не для всех. полностью доказано. Подынтегральное выражение необходимо и достаточно. Правда, некоторые специалисты отмечают, что матожидание масштабирует абстрактный метод последовательных приближений, таким образом сбылась мечта идиота — утверждение полностью доказано. Собственное подмножество транслирует тригонометрический интеграл от функции, обращающейся в бесконечность вдоль линии, при этом, вместо 13 можно взять любую другую константу. Минимум, следовательно, соответствует интеграл по ориентированной области, таким образом, утверждение полностью доказано. Тройной интеграл расточительно проецирует косвенный математический анализ, что известно даже школьникам. Нормальное распределение непосредственно переворачивает интеграл Гамильтона, что известно даже школьникам. Первообразная функция притягивает критерий интегрируемости, что несомненно приведет нас к истине. Двойной интеграл, как следует из вышесказанного, стремительно прим.: Mark Boulton синхронизирует стремящийся определитель системы линейных уравхорошонений, что несомненно приведет нас к истине.
6.48 Как сверстать текст красиво Функция, выпуклая кверху Скалярное произведение Отсюда естественно следует, что длина вектора изящно упорядочивает транслирует интеграл по скачок функции, что несомненно приведет нас к истине. Рациональное бесконечной области, откуда число последовательно транслирует нормальный предел функции, что следует доказываемое неудивительно. Целое число категорически стабилизирует эмпирический равенство. Представляется многочлен, таким образом сбылась мечта идиота — утверждение логичным, что прямоугольная матрица очевидна не для всех. полностью доказано. Подынтегральное выражение необходимо и достаточно. Правда, некоторые специалисты отмечают, что матожидание масштабирует абстрактный метод последовательных приближений, таким образом сбылась мечта идиота — утверждение полностью доказано. Собственное подмножество транслирует тригонометрический интеграл от функции, обращающейся в бесконечность вдоль линии, при этом, вместо 13 можно взять любую другую константу. Минимум, следовательно, соответствует интеграл по ориентированной области, таким образом, утверждение полностью доказано. Тройной интеграл расточительно проецирует косвенный математический анализ, что известно даже школьникам. Нормальное распределение непосредственно переворачивает интеграл Гамильтона, что известно даже школьникам. Первообразная функция притягивает критерий интегрируемости, что несомненно приведет нас к истине. Двойной интеграл, как следует из вышесказанного, стремительно синхронизирует стремящийся определитель системы линейных уравхорошонений, что несомненно приведет нас к истине.
6.49 Как сверстать текст красиво Функция, выпуклая кверху Отсюда естественно следует, что длина вектора изящно упорядочивает Скалярное произведение скачок функции, что несомненно приведет нас к истине. Рациональное транслирует интеграл по число последовательно транслирует нормальный предел функции, что бесконечной области, откуда неудивительно. Целое число категорически стабилизирует эмпирический следует доказываемое многочлен, таким образом сбылась мечта идиота — утверждение равенство. Представляется полностью доказано. Подынтегральное выражение необходимо и логичным, что прямоугольная достаточно. матрица очевидна не для всех. Правда, некоторые специалисты отмечают, что матожидание масштабирует абстрактный метод последовательных приближений, таким образом сбылась мечта идиота — утверждение полностью доказано. Собственное подмножество транслирует тригонометрический интеграл от функции, обращающейся в бесконечность вдоль линии, при этом, вместо 13 можно взять любую другую константу. Минимум, следовательно, соответствует интеграл по ориентированной области, таким образом, утверждение полностью доказано. Тройной интеграл расточительно проецирует косвенный математический анализ, что известно даже школьникам. Нормальное распределение непосредственно переворачивает интеграл Гамильтона, что известно даже школьникам. Первообразная функция
6.50 Как сверстать текст красиво Функция, выпуклая кверху Отсюда естественно следует, что длина вектора изящно упорядочивает Скалярное произведение скачок функции, что несомненно приведет нас к истине. Рациональное транслирует интеграл по число последовательно транслирует нормальный предел функции, что бесконечной области, откуда неудивительно. Целое число категорически стабилизирует эмпирический следует доказываемое многочлен, таким образом сбылась мечта идиота — утверждение равенство. Представляется полностью доказано. Подынтегральное выражение необходимо и логичным, что прямоугольная достаточно. матрица очевидна не для всех. Правда, некоторые специалисты отмечают, что матожидание масштабирует абстрактный метод последовательных приближений, таким образом сбылась мечта идиота — утверждение полностью доказано. Собственное подмножество транслирует тригонометрический интеграл от функции, обращающейся в бесконечность вдоль линии, при этом, вместо 13 можно взять любую другую константу. Минимум, следовательно, соответствует интеграл по ориентированной области, таким образом, утверждение полностью доказано. Тройной интеграл расточительно проецирует косвенный математический анализ, что известно даже школьникам. Нормальное распределение непосредственно переворачивает интеграл Гамильтона, что известно даже школьникам. Первообразная функция
6.51 Как сверстать текст красиво Функция, выпуклая кверху Отсюда естественно следует, что длина вектора изящно упорядочивает Скалярное произведение транслирует интеграл по скачок функции, что несомненно приведет нас к истине. Рациональное бесконечной области, откуда число последовательно транслирует нормальный предел функции, что следует доказываемое неудивительно. Целое число категорически стабилизирует эмпирический равенство. Представляется многочлен, таким образом сбылась мечта идиота — утверждение логичным, что прямоугольная матрица очевидна не для всех. полностью доказано. Подынтегральное выражение необходимо и достаточно. Правда, некоторые специалисты отмечают, что матожидание масштабирует абстрактный метод последовательных приближений, таким образом сбылась мечта идиота — утверждение полностью доказано. Собственное подмножество транслирует тригонометрический интеграл от функции, обращающейся в бесконечность вдоль линии, при этом, вместо 13 можно взять любую другую константу. Минимум, следовательно, соответствует интеграл по ориентированной области, таким образом, утверждение полностью доказано. Тройной интеграл расточительно проецирует косвенный математический анализ, что известно даже школьникам. Нормальное распределение непосредственно переворачивает интеграл Гамильтона, что известно даже школьникам. Первообразная функция
6.52 Как сверстать текст красиво Функция, выпуклая кверху Отсюда естественно следует, что длина вектора изящно упорядочивает Скалярное произведение транслирует интеграл по скачок функции, что несомненно приведет нас к истине. Рациональное бесконечной области, откуда число последовательно транслирует нормальный предел функции, что следует доказываемое неудивительно. Целое число категорически стабилизирует эмпирический равенство. Представляется многочлен, таким образом сбылась мечта идиота — утверждение логичным, что прямоугольная матрица очевидна не для всех. полностью доказано. Подынтегральное выражение необходимо и достаточно. Правда, некоторые специалисты отмечают, что матожидание масштабирует абстрактный метод последовательных приближений, таким образом сбылась мечта идиота — утверждение полностью доказано. Собственное подмножество транслирует тригонометрический интеграл от функции, обращающейся в бесконечность вдоль линии, при этом, вместо 13 можно взять любую другую константу. Минимум, следовательно, соответствует интеграл по ориентированной области, таким образом, утверждение полностью доказано. Тройной интеграл расточительно проецирует косвенный математический анализ, что известно даже школьникам. Нормальное распределение непосредственно переворачивает интеграл Гамильтона, что известно даже школьникам. Первообразная функция
6.53 Как сверстать текст красиво Функция, выпуклая кверху Отсюда естественно следует, что длина вектора изящно упорядочивает Скалярное произведение транслирует интеграл по скачок функции, что несомненно приведет нас к истине. Рациональное бесконечной области, откуда число последовательно транслирует нормальный предел функции, что следует доказываемое неудивительно. Целое число категорически стабилизирует эмпирический равенство. Представляется многочлен, таким образом сбылась мечта идиота — утверждение логичным, что прямоугольная матрица очевидна не для всех. полностью доказано. Подынтегральное выражение необходимо и достаточно. Правда, некоторые специалисты отмечают, что матожидание масштабирует абстрактный метод последовательных приближений, таким образом сбылась мечта идиота — утверждение полностью доказано. Собственное подмножество транслирует тригонометрический интеграл от функции, обращающейся в бесконечность вдоль линии, при этом, вместо 13 можно взять любую другую константу. Минимум, следовательно, соответствует интеграл по ориентированной области, таким образом, утверждение полностью доказано. Тройной интеграл расточительно проецирует косвенный математический анализ, что известно даже школьникам. Нормальное распределение непосредственно переворачивает интеграл Гамильтона, что известно даже школьникам. Первообразная функция
7 Основные контролы и правила их использования
7.1 Кнопка Кнопка — это любой элемент, взаимодействие с которым ограничивается нажатием.
7.2 Кнопки Недоступные действия Текст в инфинитивной заблокированы форме глагола Есть достаточное пустое пространство между кнопками
7.3 Чекбоксы и радиокнопки Кликабельные Радиокнопок подписи к чекбоксам и не меньше двух; радиокнопкам одна обязательно установлена Действие запускается отдельно от выбора
7.4 Раскрывающийся список По умолчанию стоит В списке наиболее вероятное не слишком мало и значение не слишком много значений Элементы в списке Список имеет отсортированы достаточную ширину
7.5 Грид
8 Заключение
Дизайн — это впечатления
Тестирование юзабилити очень важно!
Дизайн всегда делается для людей
Дизайн должен быть простым
Дизайн спасёт мир
Здорово использовать инструменты по назначению
Давайте вместе делать окружающий мир прекраснее!
8.1 Что почитать Apple Human Interface Guidelines (http://developer.apple.com/documentation/ UserExperience/Conceptual/OSXHIGuidelines/ OSXHIGuidelines.pdf) Ководство Артемия Лебедева (http://www.artlebedev.ru/kovodstvo/) Дизайн привычных вещей (Дональд Норман) Веб-дизайн (Дмитрий Кирсанов)
8.2 Простота — необходимое условие прекрасного. Л. Н. Толстой.
Спасибо за внимание!

Recommandé

нужен ли россии
нужен ли россиинужен ли россии
нужен ли россииTimur AITOV
 
Press Kp Tatarstan
Press Kp TatarstanPress Kp Tatarstan
Press Kp Tatarstankpkazan
 
власть сми
власть смивласть сми
власть смиTimur AITOV
 
Brand Resources
Brand ResourcesBrand Resources
Brand Resourceschjuncu
 
вклад сетевых сообществ в образование
вклад сетевых сообществ в образованиевклад сетевых сообществ в образование
вклад сетевых сообществ в образованиеNovikovaOG
 
современный урок математики
современный урок математикисовременный урок математики
современный урок математикиNovikovaOG
 
Типичные проблемы выявления требований и их решение
Типичные проблемы выявления требований и их решениеТипичные проблемы выявления требований и их решение
Типичные проблемы выявления требований и их решениеSQALab
 
МАСТЕР-КЛАСС. Руководство командой разработчиков ПО
МАСТЕР-КЛАСС. Руководство командой разработчиков ПОМАСТЕР-КЛАСС. Руководство командой разработчиков ПО
МАСТЕР-КЛАСС. Руководство командой разработчиков ПОSQALab
 

Recommandé

нужен ли россии
нужен ли россиинужен ли россии
нужен ли россииTimur AITOV
 
Press Kp Tatarstan
Press Kp TatarstanPress Kp Tatarstan
Press Kp Tatarstankpkazan
 
власть сми
власть смивласть сми
власть смиTimur AITOV
 
Brand Resources
Brand ResourcesBrand Resources
Brand Resourceschjuncu
 
вклад сетевых сообществ в образование
вклад сетевых сообществ в образованиевклад сетевых сообществ в образование
вклад сетевых сообществ в образованиеNovikovaOG
 
современный урок математики
современный урок математикисовременный урок математики
современный урок математикиNovikovaOG
 
Типичные проблемы выявления требований и их решение
Типичные проблемы выявления требований и их решениеТипичные проблемы выявления требований и их решение
Типичные проблемы выявления требований и их решениеSQALab
 
МАСТЕР-КЛАСС. Руководство командой разработчиков ПО
МАСТЕР-КЛАСС. Руководство командой разработчиков ПОМАСТЕР-КЛАСС. Руководство командой разработчиков ПО
МАСТЕР-КЛАСС. Руководство командой разработчиков ПОSQALab
 
проект
проектпроект
проектNovikovaOG
 
БазэлЦемент
БазэлЦементБазэлЦемент
БазэлЦементlarshin
 
урок математики
урок математикиурок математики
урок математикиNovikovaOG
 
ruby manual
ruby manualruby manual
ruby manualguest053bdf
 
Assessing Competence Based Modules Ru
Assessing Competence Based Modules RuAssessing Competence Based Modules Ru
Assessing Competence Based Modules RuEU.project.vet.kazakhstan
 
Baikin Sef Req Elicitation
Baikin Sef Req ElicitationBaikin Sef Req Elicitation
Baikin Sef Req Elicitationsef2009
 
Живемо в стилі еко
Живемо в стилі екоЖивемо в стилі еко
Живемо в стилі екоНБУ для дітей
 
Winalite Health Ru
Winalite Health RuWinalite Health Ru
Winalite Health Rudanny_sh2000
 
GRI Sustainability Reporting Guidelines
GRI Sustainability Reporting GuidelinesGRI Sustainability Reporting Guidelines
GRI Sustainability Reporting Guidelinesvadimv
 
Программа лояльности
Программа лояльностиПрограмма лояльности
Программа лояльностиvseneshtiak
 
123
123123
123Yaroslav Yasinskiy
 
математика и математическое образование в современном мире
математика и математическое образование в современном мирематематика и математическое образование в современном мире
математика и математическое образование в современном миреNovikovaOG
 
Optimaza House SEO
Optimaza House SEOOptimaza House SEO
Optimaza House SEOValentin Pertsiya
 
Online strategy building, RIF 2009
Online strategy building, RIF 2009Online strategy building, RIF 2009
Online strategy building, RIF 2009HUNGRY BOYS Creative agency
 
SEO
SEOSEO
SEOJane V. Sinepol
 
Комплексные проекты для клиентов. Кейс AXE.
Комплексные проекты для клиентов. Кейс AXE.Комплексные проекты для клиентов. Кейс AXE.
Комплексные проекты для клиентов. Кейс AXE.HUNGRY BOYS Creative agency
 
линейные и квадратные уравнения с параметрами
линейные и квадратные уравнения с параметрамилинейные и квадратные уравнения с параметрами
линейные и квадратные уравнения с параметрамиNovikovaOG
 
экспресс тест экзамены
экспресс тест экзаменыэкспресс тест экзамены
экспресс тест экзаменыАлина Ветрова
 
Рекламные digital агентства в России, конец 2008 года
Рекламные digital агентства в России, конец 2008 годаРекламные digital агентства в России, конец 2008 года
Рекламные digital агентства в России, конец 2008 годаHUNGRY BOYS Creative agency
 
Why Design Matters
Why Design MattersWhy Design Matters
Why Design MattersWill Tschumy
 
Design matters
Design mattersDesign matters
Design mattersShuwei Huang
 
Blank Page to World Stage [Design Matters 2017]
Blank Page to World Stage [Design Matters 2017] Blank Page to World Stage [Design Matters 2017]
Blank Page to World Stage [Design Matters 2017] Cheryl Platz
 

Contenu connexe

Tendances

БазэлЦемент
БазэлЦементБазэлЦемент
БазэлЦементlarshin
 
урок математики
урок математикиурок математики
урок математикиNovikovaOG
 
Baikin Sef Req Elicitation
Baikin Sef Req ElicitationBaikin Sef Req Elicitation
Baikin Sef Req Elicitationsef2009
 
Winalite Health Ru
Winalite Health RuWinalite Health Ru
Winalite Health Rudanny_sh2000
 
GRI Sustainability Reporting Guidelines
GRI Sustainability Reporting GuidelinesGRI Sustainability Reporting Guidelines
GRI Sustainability Reporting Guidelinesvadimv
 
Программа лояльности
Программа лояльностиПрограмма лояльности
Программа лояльностиvseneshtiak
 
математика и математическое образование в современном мире
математика и математическое образование в современном мирематематика и математическое образование в современном мире
математика и математическое образование в современном миреNovikovaOG
 
Комплексные проекты для клиентов. Кейс AXE.
Комплексные проекты для клиентов. Кейс AXE.Комплексные проекты для клиентов. Кейс AXE.
Комплексные проекты для клиентов. Кейс AXE.HUNGRY BOYS Creative agency
 
линейные и квадратные уравнения с параметрами
линейные и квадратные уравнения с параметрамилинейные и квадратные уравнения с параметрами
линейные и квадратные уравнения с параметрамиNovikovaOG
 
Рекламные digital агентства в России, конец 2008 года
Рекламные digital агентства в России, конец 2008 годаРекламные digital агентства в России, конец 2008 года
Рекламные digital агентства в России, конец 2008 годаHUNGRY BOYS Creative agency
 

Tendances (19)

проект
проектпроект
проект
 
БазэлЦемент
БазэлЦементБазэлЦемент
БазэлЦемент
 
урок математики
урок математикиурок математики
урок математики
 
ruby manual
ruby manualruby manual
ruby manual
 
Assessing Competence Based Modules Ru
Assessing Competence Based Modules RuAssessing Competence Based Modules Ru
Assessing Competence Based Modules Ru
 
Baikin Sef Req Elicitation
Baikin Sef Req ElicitationBaikin Sef Req Elicitation
Baikin Sef Req Elicitation
 
Живемо в стилі еко
Живемо в стилі екоЖивемо в стилі еко
Живемо в стилі еко
 
Winalite Health Ru
Winalite Health RuWinalite Health Ru
Winalite Health Ru
 
GRI Sustainability Reporting Guidelines
GRI Sustainability Reporting GuidelinesGRI Sustainability Reporting Guidelines
GRI Sustainability Reporting Guidelines
 
Программа лояльности
Программа лояльностиПрограмма лояльности
Программа лояльности
 
123
123123
123
 
математика и математическое образование в современном мире
математика и математическое образование в современном мирематематика и математическое образование в современном мире
математика и математическое образование в современном мире
 
Optimaza House SEO
Optimaza House SEOOptimaza House SEO
Optimaza House SEO
 
Online strategy building, RIF 2009
Online strategy building, RIF 2009Online strategy building, RIF 2009
Online strategy building, RIF 2009
 
SEO
SEOSEO
SEO
 
Комплексные проекты для клиентов. Кейс AXE.
Комплексные проекты для клиентов. Кейс AXE.Комплексные проекты для клиентов. Кейс AXE.
Комплексные проекты для клиентов. Кейс AXE.
 
линейные и квадратные уравнения с параметрами
линейные и квадратные уравнения с параметрамилинейные и квадратные уравнения с параметрами
линейные и квадратные уравнения с параметрами
 
экспресс тест экзамены
экспресс тест экзаменыэкспресс тест экзамены
экспресс тест экзамены
 
Рекламные digital агентства в России, конец 2008 года
Рекламные digital агентства в России, конец 2008 годаРекламные digital агентства в России, конец 2008 года
Рекламные digital агентства в России, конец 2008 года
 

En vedette

Why Design Matters
Why Design MattersWhy Design Matters
Why Design MattersWill Tschumy
 
Blank Page to World Stage [Design Matters 2017]
Blank Page to World Stage [Design Matters 2017] Blank Page to World Stage [Design Matters 2017]
Blank Page to World Stage [Design Matters 2017] Cheryl Platz
 
Introducing Core Role Designer - Michael Marks Product Manager - Identity, Co...
Introducing Core Role Designer - Michael Marks Product Manager - Identity, Co...Introducing Core Role Designer - Michael Marks Product Manager - Identity, Co...
Introducing Core Role Designer - Michael Marks Product Manager - Identity, Co...Core Security
 
George Aye: Design education's big gap: Understanding the role of power
George Aye: Design education's big gap: Understanding the role of powerGeorge Aye: Design education's big gap: Understanding the role of power
George Aye: Design education's big gap: Understanding the role of powerService Design Network
 

En vedette (6)

Why Design Matters
Why Design MattersWhy Design Matters
Why Design Matters
 
Design matters
Design mattersDesign matters
Design matters
 
Blank Page to World Stage [Design Matters 2017]
Blank Page to World Stage [Design Matters 2017] Blank Page to World Stage [Design Matters 2017]
Blank Page to World Stage [Design Matters 2017]
 
Introducing Core Role Designer - Michael Marks Product Manager - Identity, Co...
Introducing Core Role Designer - Michael Marks Product Manager - Identity, Co...Introducing Core Role Designer - Michael Marks Product Manager - Identity, Co...
Introducing Core Role Designer - Michael Marks Product Manager - Identity, Co...
 
Form, Meaning and Design
Form, Meaning and DesignForm, Meaning and Design
Form, Meaning and Design
 
George Aye: Design education's big gap: Understanding the role of power
George Aye: Design education's big gap: Understanding the role of powerGeorge Aye: Design education's big gap: Understanding the role of power
George Aye: Design education's big gap: Understanding the role of power
 

Plus de Constantin Kichinsky

Прототипирование приложений в Expression Blend + Sketchflow
Прототипирование приложений в Expression Blend + SketchflowПрототипирование приложений в Expression Blend + Sketchflow
Прототипирование приложений в Expression Blend + SketchflowConstantin Kichinsky
 
Пользовательский интерфейс
Пользовательский интерфейсПользовательский интерфейс
Пользовательский интерфейсConstantin Kichinsky
 
Архитектура корпоративных систем
Архитектура корпоративных системАрхитектура корпоративных систем
Архитектура корпоративных системConstantin Kichinsky
 
Шаблоны проектирования 2
Шаблоны проектирования 2Шаблоны проектирования 2
Шаблоны проектирования 2Constantin Kichinsky
 
Шаблоны проектирования 1
Шаблоны проектирования 1Шаблоны проектирования 1
Шаблоны проектирования 1Constantin Kichinsky
 
Создание новых объектов
Создание новых объектовСоздание новых объектов
Создание новых объектовConstantin Kichinsky
 
jQuery: быстрая разработка веб-интерфейсов на JavaScript
jQuery: быстрая разработка веб-интерфейсов на JavaScriptjQuery: быстрая разработка веб-интерфейсов на JavaScript
jQuery: быстрая разработка веб-интерфейсов на JavaScriptConstantin Kichinsky
 
Django – фреймворк, который работает
Django – фреймворк, который работаетDjango – фреймворк, который работает
Django – фреймворк, который работаетConstantin Kichinsky
 
Ruby On Rails: Web-разработка по-другому!
Ruby On Rails: Web-разработка по-другому!Ruby On Rails: Web-разработка по-другому!
Ruby On Rails: Web-разработка по-другому!Constantin Kichinsky
 
Управление проектами
Управление проектамиУправление проектами
Управление проектамиConstantin Kichinsky
 
Код как низкоуровневая документация
Код как низкоуровневая документацияКод как низкоуровневая документация
Код как низкоуровневая документацияConstantin Kichinsky
 

Plus de Constantin Kichinsky (20)

Brain to brain communications
Brain to brain communicationsBrain to brain communications
Brain to brain communications
 
Прототипирование приложений в Expression Blend + Sketchflow
Прототипирование приложений в Expression Blend + SketchflowПрототипирование приложений в Expression Blend + Sketchflow
Прототипирование приложений в Expression Blend + Sketchflow
 
JavaScript OOP
JavaScript OOPJavaScript OOP
JavaScript OOP
 
Пользовательский интерфейс
Пользовательский интерфейсПользовательский интерфейс
Пользовательский интерфейс
 
Архитектура корпоративных систем
Архитектура корпоративных системАрхитектура корпоративных систем
Архитектура корпоративных систем
 
Шаблоны проектирования 2
Шаблоны проектирования 2Шаблоны проектирования 2
Шаблоны проектирования 2
 
Шаблоны проектирования 1
Шаблоны проектирования 1Шаблоны проектирования 1
Шаблоны проектирования 1
 
Обработка ошибок
Обработка ошибокОбработка ошибок
Обработка ошибок
 
Создание новых объектов
Создание новых объектовСоздание новых объектов
Создание новых объектов
 
Декомпозиция
ДекомпозицияДекомпозиция
Декомпозиция
 
Design Lecture
Design LectureDesign Lecture
Design Lecture
 
jQuery: быстрая разработка веб-интерфейсов на JavaScript
jQuery: быстрая разработка веб-интерфейсов на JavaScriptjQuery: быстрая разработка веб-интерфейсов на JavaScript
jQuery: быстрая разработка веб-интерфейсов на JavaScript
 
Оптимизация SQL
Оптимизация SQLОптимизация SQL
Оптимизация SQL
 
Django – фреймворк, который работает
Django – фреймворк, который работаетDjango – фреймворк, который работает
Django – фреймворк, который работает
 
Ruby On Rails: Web-разработка по-другому!
Ruby On Rails: Web-разработка по-другому!Ruby On Rails: Web-разработка по-другому!
Ruby On Rails: Web-разработка по-другому!
 
Silverlight 2
Silverlight 2Silverlight 2
Silverlight 2
 
Управление проектами
Управление проектамиУправление проектами
Управление проектами
 
Silverlight 2
Silverlight 2Silverlight 2
Silverlight 2
 
Код как низкоуровневая документация
Код как низкоуровневая документацияКод как низкоуровневая документация
Код как низкоуровневая документация
 
Imagine Cup
Imagine CupImagine Cup
Imagine Cup
 

Design Matters

  • 3. 1.1 Вот с чем мы сегодня познакомимся: Вступление Что такое дизайн и почему вам нужно об этом знать Основы теории юзабилити Проектирование интерфейса Некоторые идеи интерактивного дизайна Некоторые идеи графического дизайна Основные контролы и правила их использования Заключительная часть
  • 4. 1.2 Организационные моменты Пожалуйста, не стесняйтесь спрашивать меня, если вам что-то непонятно. Глупых вопросов не бывает!
  • 5. 2 Что такое дизайн и почему вам нужно об этом знать
  • 6. 2.1 А как вы понимаете, что такое «дизайн»?
  • 7. 2.2 Определения из словарей и энциклопедий Дизайн — это ... творческий метод, процесс и результат художественно-технического проектирования промышленных изделий, их комплексов и систем, ориентированного на достижение наиболее полного соответствия создаваемых объектов и среды в целом возможностям и потребности человека, как утилитарным, так и эстетическим вид деятельности по проектированию предметного мира специфический ряд проектной деятельности, объединивший художественно-предметное англ. design — проектировать, творчество и научно обоснованную чертить, задумать, а также инженерную практику в сфере проект, план, рисунок индустриального производства художественное конструирование предметного творческая деятельность, целью мира; разработка образцов которой является определение рационального построения предметной среды формальных качеств промышленных изделий
  • 8. фото: Rune T (flickr) 2.3 Дизайн конфеты
  • 9. 2.4 Стив Джобс (глава Apple) — В речи большинства людей «дизайн» означает облицовку. Но это совершенно не так! Дизайн — это основа и душа любого человеческого творения. фото: msnbc.msn.com
  • 10. 2.5 Том Питерс (бизнес-гуру) — Дизайн — это страсть, эмоция и приверженность — и все это должно быть в сердце любого бизнеса. фото: www.tompeters.com
  • 11. 2.6 Гомер Симпсон — Да при чем тут дизайн, они меня пытали! Они сожрали мои пончики!
  • 12. 2.7 Понятие «user experience» Было Есть «Продукт» или «услуга» «Переживания» Это хороший товар Это кайф, писк Он работает Он оставляет воспоминания «Я рад, что купил его» «Я хочу еще!» Удовлетворенный клиент Член клуба Постоянный клиент Маркетинг из уст в уста Вы получаете то, за что Вы удивлены и в восторге от платите каждого поворота Товар вам по карману Товар вам по душе Удовлетворяет вашу Помогает вам потребность самоопределиться
  • 17. 2.12 Компании, пекущиеся о дизайне На этом слайде когда-нибудь будет ваша компания
  • 18. 2.13 К чему же приводит такой подход? Apple, Google, Nokia, Microsoft, ... 1 Повышается лояльность постоянных клиентов, легче и быстрее происходят все согласования 2 Многократно увеличивается вероятность привлечения новых заказчиков 3 Сокращается число обращений в службу поддержки, претензий и замечаний, увеличивается число положительных и восторженных отзывов
  • 19. 2.14 Почему именно вам нужно об этом знать Да задолбала эта документация!!!
  • 20. 2.15 Почему именно вам нужно об этом знать
  • 22. 3.1 Дизайн должен быть простым.
  • 23. 3.2 В основе юзабилити лежит здравый смысл.
  • 24. 3.3 Согласно ISO 9241-11 Юзабилити — это степень эффективности, продуктивности и удовлетворенности, с которыми продукт может быть использован определенными пользователями при определенном контексте использования для достижения определенных целей. Usability — the extent to which a product can be used by specified users to achieve specified goals with efficiency, effectiveness and satisfaction in a specified context of use.
  • 25. 3.4
  • 26. 3.5 Значимые факторы юзабилити Фактическая скорость работы пользователя, субъективная скорость работы пользователя, скорость реакции системы, количество че- ловеческих ошибок, скорость обучения, успешность, мощность, стоимость разработ- ки, стандартность, совместимость, wow-фак- тор, настраиваемость, легкость исправления ошибок, воспринимаемая сложность, субъек- тивная удовлетворенность…
  • 27. 3.6 Характеристики Шнейдермана Бен Шнейдерман — американский ученый, профессор, изучающий фундаментальные основы взимодействия человека с компьютером. Превед! фото: cs.umd.edu/~ben/
  • 28. 3.7 Характеристики Шнейдермана — Скорость работы — Количество человеческих ошибок — Скорость обучения — Удовлетворенность пользователей — Запоминаемость
  • 29. 3.8 Юзабилити-тестирование — Насколько плох или хорош интерфейс? — Лучше ли он старого? — Быстро ли удается выполнить действия? — Ошибаются ли пользователи? — Есть ли проблемы? — Довольны ли пользователи?
  • 30. 3.9 Что нужно для тестирования — Респонденты — Метод тестирования — Тестовые сценарии — Рабочее место для теста — Протестированный тест
  • 31. 3.10 Респонденты УРААА!!! Нас снова пригласили на юзабилити-тестирование! фото: tookie (flickr)
  • 32. 3.11 Количество респондентов 70% проблем 85% проблем
  • 33. 3.12 Опыт работы с системой есть отсутствует
  • 34. 3.13 Уровень компьютерной грамотности высокий низкий
  • 35. 3.14 Возраст целевой старше
  • 36. 3.15 Пол Пропорциональное количество женщин стоит чуть увеличить по сравнению с целевой илл.: Артемий Лебедев аудиторией.
  • 38. 3.17 Поток сознания Здесь, кажется, я должен поставить галочку...
  • 39. 3.18 Активное вмешательство А почему вы нажали сюда? Нууу...
  • 40. 3.19 Тестовые сценарии — Задачи пользователей должны быть реальными (из жизни) — Можно оставить только важные задачи (частотные, опасные)
  • 41. 3.20 Тестовые задания должны быть: — однозначно понятными — сформулированными полностью — при этом достаточно краткими — не содержащими в себе подсказок — содержащими точку начала выполнения задания — такими, чтобы респондент должен был сначала решить, нужно ли в данное время выполнять действие
  • 42. 3.21 Проведение тестирования 1 Ввести респондента в задачу 2 Выяснить его ожидания от системы 3 Протестировать интерфейс 4 Выяснить, насколько оправдались ожидания 5 Завершить тест
  • 43. 3.22 Анкетирование удовлетворенности Пожалуйста, подчеркните любые слова, которые, на ваш взгляд, подходят для описания этого интерфейса: Некрасивый Тусклый Устаревший Тупой Полезный Удобный Тормозящий Неэффективный Теплый Дружественный Непредсказуемый Тоскливый Наивный Управляемый Эффективный Опасный Нечеткий Непоследовательный Легкий Головоломный Ненадежный Привлекательный Любительский Стандартный Анкета: Владислав Головач Светлый Комфортабельный Запутанный Приятный Плохой Загадочный Профессиональный Безопасный Неприятный
  • 45. 4.1 Дизайн всегда делается для людей фото: evie22 (flickr)
  • 46. 4.2 Концептуальные подходы Ориентация на пользователей на задачи/цели пользователей на деятельность пользователей
  • 47. 4.3 User-centered design На слэдущей виходишь, дарагой? фото: Edge of Space (flickr)
  • 48. 4.4 Анализ целей пользователя фото: lightplace (flickr)
  • 49. 4.5 Когнитивная психология Действие состоит из следующих этапов: 1 формирование цели 2 формирование намерения 3 определение конкретных действий 4 выполнение действий 5 восприятие нового состояния системы 6 интерпретация изменений 7 оценка результата
  • 50. 4.6 Оптимизация действия Хороший дизайн: 1 нагляден 2 имеет ясную концептуальную модель 3 указывает возможные действия 4 позволяет легко выполнить действия 5 говорит, находится ли система в необх. сост. 6 имеет хорошее соотв. между сост. и его отобр. 7 имеет внятную обратную связь
  • 52. фото: Shawn Medero (A List Apart) 4.8 Бумажный прототип
  • 53. фото: Shawn Medero (A List Apart) 4.9 Бумажный прототип
  • 54. 4.10 Структурный скетч илл.: Андрей Оконечников
  • 57. 5.1 Логика! В интерфейсах логика важнее эстетики.
  • 58. илл.: Макар и Студия Артемия Лебедева 5.2 Повелитель фотошопа
  • 59. 5.3 Тут всё понятно фото: Trendir.com
  • 60. 5.4 А вот это уже не совсем ясно... илл.: Студия Артемия Лебедева
  • 61. 5.5 А вот это уже совсем не ясно! илл.: Студия Артемия Лебедева
  • 62. 5.6 Информативность и наглядность Дизайн должен подсказывать, какие действия возможны в данный момент. Дизайн должен быть наглядным.
  • 63. 5.7 Как открыть дверь? фото: Thomas Hawk (flickr.com)
  • 64. 5.8 Аффорданс Объект должен показывать способ своего использования своими неотъемлемыми свойствами.
  • 65. 5.9 Вкладки Вопрос: в каком разделе я нахожусь?
  • 70. 5.14 Пример: четкое визуальное выделение
  • 71. 5.15 Пример: четкое визуальное выделение
  • 72. 5.16 Пример: четкое визуальное выделение
  • 73. фото: Indesit 5.17 Мэппинг
  • 76. илл.: Артемий Лебедев 5.20 Теория близости
  • 77. илл.: Артемий Лебедев 5.21 Теория близости
  • 78. идея илл. Артемия Лебедева 5.22 Теория близости
  • 79. идея илл. Артемия Лебедева 5.23 Теория близости
  • 80. 5.24 Закон Фиттса 2 × расстояние до объекта Время прицеливания = k log2 размер
  • 82. 5.26 Принцип обратной связи — Мгновенная проверка ввода — Индикация ошибок — Отображение прогресса — Подтверждение действия
  • 85. 5.29 Обязательные для заполнения поля
  • 94. 6.7 Сетка — друг и помощник дизайнера
  • 95. 6.8 Сетка — друг и помощник дизайнера прим.: Артем Горбунов
  • 96. 6.9 Сетка — друг и помощник дизайнера Пример какой-то статьи Принцип модульной сетки очень прост. Полезная часть страницы состоит из ячеек-модулей, образующих ряды и колонки. На ячейки натягиваются объекты, содержащие изображения, графики или текст, причем каждый объект может занимать прямоугольник из целого числа ячеек. Эта нехитрая идея позволяет создавать безупречно аккуратные и красивые композиции. Беспристрастный анализ любого творческого акта показывает, что монтаж изящно образует культовый образ, Solitude vs loneliness by Matilde B. @ Flickr однако само по себе состояние игры всегда амбивалентно. Иными словами, холерик дает импрессионизм, таким образом, сходные законы контрастирующего развития
  • 97. 6.10 Сетка — друг и помощник дизайнера Пример какой-то статьи Принцип модульной сетки очень прост. Полезная часть страницы состоит из ячеек-модулей, образующих ряды и колонки. На ячейки натягиваются объекты, содержащие изображения, графики или текст, причем каждый объект может занимать прямоугольник из целого числа ячеек. Эта нехитрая идея позволяет создавать безупречно аккуратные и красивые композиции. Беспристрастный анализ любого творческого акта показывает, что монтаж изящно образует культовый образ, Solitude vs loneliness by Matilde B. @ Flickr однако само по себе состояние игры всегда амбивалентно. Иными словами, холерик дает импрессионизм, таким образом, сходные законы контрастирующего развития
  • 98. 6.11 Сетка — друг и помощник дизайнера Еще пример компоновки Фото слева: OneEighteen @ Flickr Фото справа: TerData @ Flickr Принцип модульной сетки очень Эта нехитрая идея позволяет создавать прост. Полезная часть страницы безупречно аккуратные и красивые состоит из ячеек-модулей, образующих композиции. ряды и колонки.
  • 99. 6.12 Сетка — друг и помощник дизайнера Еще пример компоновки Фото слева: OneEighteen @ Flickr Фото справа: TerData @ Flickr Принцип модульной сетки очень Эта нехитрая идея позволяет создавать прост. Полезная часть страницы безупречно аккуратные и красивые состоит из ячеек-модулей, образующих композиции. ряды и колонки.
  • 107. 6.20 Есть некоторые стереотипы «Красный олицетворяет опасность».
  • 108. 6.21 Есть некоторые стереотипы «Серый — скучный».
  • 109. 6.22 Есть некоторые стереотипы
  • 110. 6.23 Есть некоторые стереотипы Да Нет
  • 111. 6.24 Универсальное решение Гипотеза и теории Онтогенез Фантазия трансформирует Его экзистенциальная тоска неизменный декаданс, таким выступает как побудительный мотив образом, сходные законы творчества, однако энтелехия контрастирующего развития заканчивает суггестивный характерны и для процессов классицизм, таким образом, все в психике. Либидо монотонно перечисленные признаки архетипа начинает комплекс априорной и мифа подтверждают, что действие бисексуальности, таким образом, механизмов мифотворчества сходные законы контрастирующего сродни механизмам художественно- развития характерны и для продуктивного мышления. процессов в психике. Развивая эту тему, цвет трансформирует персональный инвариант, так Г.Корф формулирует собственную антитезу.
  • 116. 6.29 Цветовой контраст Чем плохо такое сочетание цветов?
  • 117. 6.30 Цветовой контраст Чем плохо такое сочетание цветов?
  • 118. 6.31 Цветовой контраст Чем плохо такое сочетание цветов?
  • 119. 6.32 Про шрифты и типографику фото: soozika (flickr)
  • 120. 6.33 Виды начертаний abcdef abcdef abcdef abcdef abcdef abcdef
  • 121. 6.34 Вариации насыщенности abcdefghijklmnop abcdefghijklmnop abcdefghijklmnop abcdefghijklmnop abcdefghijklmnop
  • 123. 6.36 Переходная антиква Brick quiz whangs jumpy veldt fox! Brick quiz whangs jumpy veldt fox!
  • 127. 6.40 Гельветика The quick brown fox jumps over the lazy dog.
  • 129. 6.42 Дефис, минус и тире Дефис Минус Тире илл.: Артемий Лебедев
  • 130. 6.43 Дефис Дефис употребляется, во-первых, для присоединения каких- либо частиц или префиксов, во- вторых, в словосочетаниях. А тире — для обозначения пауз в тексте или для выделения прямой речи.
  • 131. 6.44 Кавычки В русском языке традиционно применяются «ёлочки», а для «кавычек „внутри“ кавычек» — „лапки“.
  • 132. 6.45 Как сверстать текст красиво Функция, выпуклая кверху Скалярное произведение Отсюда естественно следует, что длина вектора изящно упорядочивает скачок функции, транслирует интеграл по что несомненно приведет нас к истине. Рациональное число последовательно транслирует бесконечной области, откуда нормальный предел функции, что неудивительно. Целое число категорически стабилизирует следует доказываемое эмпирический многочлен, таким образом сбылась мечта идиота — утверждение полностью равенство. Представляется доказано. Подынтегральное выражение необходимо и достаточно. логичным, что прямоугольная матрица очевидна не для всех. Правда, некоторые специалисты отмечают, что матожидание масштабирует абстрактный метод последовательных приближений, таким образом сбылась мечта идиота — утверждение полностью доказано. Собственное подмножество транслирует тригонометрический интеграл от функции, обращающейся в бесконечность вдоль линии, при этом, вместо 13 можно взять любую другую константу. Минимум, следовательно, соответствует интеграл по ориентированной области, таким образом, утверждение полностью доказано. Тройной интеграл расточительно проецирует косвенный математический анализ, что известно даже школьникам. Нормальное распределение непосредственно переворачивает интеграл Гамильтона, что известно даже школьникам. Первообразная функция притягивает критерий интегрируемости, что несомненно приведет нас к истине. Двойной интеграл, как следует из вышесказанного, стремительно синхронизирует стремящийся определитель системы линейных уравхорошонений, что несомненно приведет нас к истине.
  • 133. 6.46 Как сверстать текст красиво Функция, выпуклая кверху Скалярное произведение Отсюда естественно следует, что длина вектора изящно упорядочивает скачок функции, транслирует интеграл по что несомненно приведет нас к истине. Рациональное число последовательно транслирует бесконечной области, откуда нормальный предел функции, что неудивительно. Целое число категорически стабилизирует следует доказываемое эмпирический многочлен, таким образом сбылась мечта идиота — утверждение полностью равенство. Представляется доказано. Подынтегральное выражение необходимо и достаточно. логичным, что прямоугольная матрица очевидна не для всех. Правда, некоторые специалисты отмечают, что матожидание масштабирует абстрактный метод последовательных приближений, таким образом сбылась мечта идиота — утверждение полностью доказано. Собственное подмножество транслирует тригонометрический интеграл от функции, обращающейся в бесконечность вдоль линии, при этом, вместо 13 можно взять любую другую константу. Минимум, следовательно, соответствует интеграл по ориентированной области, таким образом, утверждение полностью доказано. Тройной интеграл расточительно проецирует косвенный математический анализ, что известно даже школьникам. Нормальное распределение непосредственно переворачивает интеграл Гамильтона, что известно даже школьникам. Первообразная функция притягивает критерий интегрируемости, что несомненно приведет нас к истине. Двойной интеграл, как следует из вышесказанного, стремительно синхронизирует стремящийся определитель системы линейных уравхорошонений, что несомненно приведет нас к истине.
  • 134. 6.47 Как сверстать текст красиво Функция, выпуклая кверху Скалярное произведение Отсюда естественно следует, что длина вектора изящно упорядочивает транслирует интеграл по скачок функции, что несомненно приведет нас к истине. Рациональное бесконечной области, откуда число последовательно транслирует нормальный предел функции, что следует доказываемое неудивительно. Целое число категорически стабилизирует эмпирический равенство. Представляется многочлен, таким образом сбылась мечта идиота — утверждение логичным, что прямоугольная матрица очевидна не для всех. полностью доказано. Подынтегральное выражение необходимо и достаточно. Правда, некоторые специалисты отмечают, что матожидание масштабирует абстрактный метод последовательных приближений, таким образом сбылась мечта идиота — утверждение полностью доказано. Собственное подмножество транслирует тригонометрический интеграл от функции, обращающейся в бесконечность вдоль линии, при этом, вместо 13 можно взять любую другую константу. Минимум, следовательно, соответствует интеграл по ориентированной области, таким образом, утверждение полностью доказано. Тройной интеграл расточительно проецирует косвенный математический анализ, что известно даже школьникам. Нормальное распределение непосредственно переворачивает интеграл Гамильтона, что известно даже школьникам. Первообразная функция притягивает критерий интегрируемости, что несомненно приведет нас к истине. Двойной интеграл, как следует из вышесказанного, стремительно прим.: Mark Boulton синхронизирует стремящийся определитель системы линейных уравхорошонений, что несомненно приведет нас к истине.
  • 135. 6.48 Как сверстать текст красиво Функция, выпуклая кверху Скалярное произведение Отсюда естественно следует, что длина вектора изящно упорядочивает транслирует интеграл по скачок функции, что несомненно приведет нас к истине. Рациональное бесконечной области, откуда число последовательно транслирует нормальный предел функции, что следует доказываемое неудивительно. Целое число категорически стабилизирует эмпирический равенство. Представляется многочлен, таким образом сбылась мечта идиота — утверждение логичным, что прямоугольная матрица очевидна не для всех. полностью доказано. Подынтегральное выражение необходимо и достаточно. Правда, некоторые специалисты отмечают, что матожидание масштабирует абстрактный метод последовательных приближений, таким образом сбылась мечта идиота — утверждение полностью доказано. Собственное подмножество транслирует тригонометрический интеграл от функции, обращающейся в бесконечность вдоль линии, при этом, вместо 13 можно взять любую другую константу. Минимум, следовательно, соответствует интеграл по ориентированной области, таким образом, утверждение полностью доказано. Тройной интеграл расточительно проецирует косвенный математический анализ, что известно даже школьникам. Нормальное распределение непосредственно переворачивает интеграл Гамильтона, что известно даже школьникам. Первообразная функция притягивает критерий интегрируемости, что несомненно приведет нас к истине. Двойной интеграл, как следует из вышесказанного, стремительно синхронизирует стремящийся определитель системы линейных уравхорошонений, что несомненно приведет нас к истине.
  • 136. 6.49 Как сверстать текст красиво Функция, выпуклая кверху Отсюда естественно следует, что длина вектора изящно упорядочивает Скалярное произведение скачок функции, что несомненно приведет нас к истине. Рациональное транслирует интеграл по число последовательно транслирует нормальный предел функции, что бесконечной области, откуда неудивительно. Целое число категорически стабилизирует эмпирический следует доказываемое многочлен, таким образом сбылась мечта идиота — утверждение равенство. Представляется полностью доказано. Подынтегральное выражение необходимо и логичным, что прямоугольная достаточно. матрица очевидна не для всех. Правда, некоторые специалисты отмечают, что матожидание масштабирует абстрактный метод последовательных приближений, таким образом сбылась мечта идиота — утверждение полностью доказано. Собственное подмножество транслирует тригонометрический интеграл от функции, обращающейся в бесконечность вдоль линии, при этом, вместо 13 можно взять любую другую константу. Минимум, следовательно, соответствует интеграл по ориентированной области, таким образом, утверждение полностью доказано. Тройной интеграл расточительно проецирует косвенный математический анализ, что известно даже школьникам. Нормальное распределение непосредственно переворачивает интеграл Гамильтона, что известно даже школьникам. Первообразная функция
  • 137. 6.50 Как сверстать текст красиво Функция, выпуклая кверху Отсюда естественно следует, что длина вектора изящно упорядочивает Скалярное произведение скачок функции, что несомненно приведет нас к истине. Рациональное транслирует интеграл по число последовательно транслирует нормальный предел функции, что бесконечной области, откуда неудивительно. Целое число категорически стабилизирует эмпирический следует доказываемое многочлен, таким образом сбылась мечта идиота — утверждение равенство. Представляется полностью доказано. Подынтегральное выражение необходимо и логичным, что прямоугольная достаточно. матрица очевидна не для всех. Правда, некоторые специалисты отмечают, что матожидание масштабирует абстрактный метод последовательных приближений, таким образом сбылась мечта идиота — утверждение полностью доказано. Собственное подмножество транслирует тригонометрический интеграл от функции, обращающейся в бесконечность вдоль линии, при этом, вместо 13 можно взять любую другую константу. Минимум, следовательно, соответствует интеграл по ориентированной области, таким образом, утверждение полностью доказано. Тройной интеграл расточительно проецирует косвенный математический анализ, что известно даже школьникам. Нормальное распределение непосредственно переворачивает интеграл Гамильтона, что известно даже школьникам. Первообразная функция
  • 138. 6.51 Как сверстать текст красиво Функция, выпуклая кверху Отсюда естественно следует, что длина вектора изящно упорядочивает Скалярное произведение транслирует интеграл по скачок функции, что несомненно приведет нас к истине. Рациональное бесконечной области, откуда число последовательно транслирует нормальный предел функции, что следует доказываемое неудивительно. Целое число категорически стабилизирует эмпирический равенство. Представляется многочлен, таким образом сбылась мечта идиота — утверждение логичным, что прямоугольная матрица очевидна не для всех. полностью доказано. Подынтегральное выражение необходимо и достаточно. Правда, некоторые специалисты отмечают, что матожидание масштабирует абстрактный метод последовательных приближений, таким образом сбылась мечта идиота — утверждение полностью доказано. Собственное подмножество транслирует тригонометрический интеграл от функции, обращающейся в бесконечность вдоль линии, при этом, вместо 13 можно взять любую другую константу. Минимум, следовательно, соответствует интеграл по ориентированной области, таким образом, утверждение полностью доказано. Тройной интеграл расточительно проецирует косвенный математический анализ, что известно даже школьникам. Нормальное распределение непосредственно переворачивает интеграл Гамильтона, что известно даже школьникам. Первообразная функция
  • 139. 6.52 Как сверстать текст красиво Функция, выпуклая кверху Отсюда естественно следует, что длина вектора изящно упорядочивает Скалярное произведение транслирует интеграл по скачок функции, что несомненно приведет нас к истине. Рациональное бесконечной области, откуда число последовательно транслирует нормальный предел функции, что следует доказываемое неудивительно. Целое число категорически стабилизирует эмпирический равенство. Представляется многочлен, таким образом сбылась мечта идиота — утверждение логичным, что прямоугольная матрица очевидна не для всех. полностью доказано. Подынтегральное выражение необходимо и достаточно. Правда, некоторые специалисты отмечают, что матожидание масштабирует абстрактный метод последовательных приближений, таким образом сбылась мечта идиота — утверждение полностью доказано. Собственное подмножество транслирует тригонометрический интеграл от функции, обращающейся в бесконечность вдоль линии, при этом, вместо 13 можно взять любую другую константу. Минимум, следовательно, соответствует интеграл по ориентированной области, таким образом, утверждение полностью доказано. Тройной интеграл расточительно проецирует косвенный математический анализ, что известно даже школьникам. Нормальное распределение непосредственно переворачивает интеграл Гамильтона, что известно даже школьникам. Первообразная функция
  • 140. 6.53 Как сверстать текст красиво Функция, выпуклая кверху Отсюда естественно следует, что длина вектора изящно упорядочивает Скалярное произведение транслирует интеграл по скачок функции, что несомненно приведет нас к истине. Рациональное бесконечной области, откуда число последовательно транслирует нормальный предел функции, что следует доказываемое неудивительно. Целое число категорически стабилизирует эмпирический равенство. Представляется многочлен, таким образом сбылась мечта идиота — утверждение логичным, что прямоугольная матрица очевидна не для всех. полностью доказано. Подынтегральное выражение необходимо и достаточно. Правда, некоторые специалисты отмечают, что матожидание масштабирует абстрактный метод последовательных приближений, таким образом сбылась мечта идиота — утверждение полностью доказано. Собственное подмножество транслирует тригонометрический интеграл от функции, обращающейся в бесконечность вдоль линии, при этом, вместо 13 можно взять любую другую константу. Минимум, следовательно, соответствует интеграл по ориентированной области, таким образом, утверждение полностью доказано. Тройной интеграл расточительно проецирует косвенный математический анализ, что известно даже школьникам. Нормальное распределение непосредственно переворачивает интеграл Гамильтона, что известно даже школьникам. Первообразная функция
  • 141. 7 Основные контролы и правила их использования
  • 142. 7.1 Кнопка Кнопка — это любой элемент, взаимодействие с которым ограничивается нажатием.
  • 143. 7.2 Кнопки Недоступные действия Текст в инфинитивной заблокированы форме глагола Есть достаточное пустое пространство между кнопками
  • 144. 7.3 Чекбоксы и радиокнопки Кликабельные Радиокнопок подписи к чекбоксам и не меньше двух; радиокнопкам одна обязательно установлена Действие запускается отдельно от выбора
  • 145. 7.4 Раскрывающийся список По умолчанию стоит В списке наиболее вероятное не слишком мало и значение не слишком много значений Элементы в списке Список имеет отсортированы достаточную ширину
  • 155. 8.1 Что почитать Apple Human Interface Guidelines (http://developer.apple.com/documentation/ UserExperience/Conceptual/OSXHIGuidelines/ OSXHIGuidelines.pdf) Ководство Артемия Лебедева (http://www.artlebedev.ru/kovodstvo/) Дизайн привычных вещей (Дональд Норман) Веб-дизайн (Дмитрий Кирсанов)
  • 156. 8.2 Простота — необходимое условие прекрасного. Л. Н. Толстой.