Sketch Mobile UI и интерактивный дизайн видео Объяснение Версия Xia Ziali Отредактированное эскиз рисование прототип рамки Прототип дизайна дизайна Android Interface Design Book Book
Вес товара: ~0.7 кг. Указан усредненный вес, который может отличаться от фактического. Не включен в цену, оплачивается при получении.
Описание товара
D1
Название: Sketch Mobile UI и интерактивный дизайн (видео объяснение)
Цена: 79,80 Юань
Автор: Xia Zhili
Издательство: люди и телекоммуникации издательство
Время публикации: август 2018 г.
Книга: 16
Бумага: пластическая версия бумага
Упаковка: Pacder-Plastic
ISBN: 9787115485342
ГЛАВА 1 ВВЕДЕНИЕ ВВЕДЕНИЕ ВЕБЯ
1.1 История разработки дизайна пользовательского интерфейса 2
1.1.1 Ранний стиль дизайна пользовательского интерфейса 3
1.1.2 Рост дизайна пользовательского интерфейса в среднесрочной перспективе 3
1.1.3 Разработка дизайна пользовательского интерфейса в более позднем периоде 5
Объяснение знаний—— IOS Система 6
Объяснение знаний—— Android System 6
Объяснение знаний—&Mdash; System 7 Windows 7
Объяснение знаний—— умеренный стиль дизайн 8
Объяснение знаний—— Flat Style Design 8
1.2 Процесс производственного процесса дизайна пользовательского интерфейса Web -Page Design 9
1.2.1 Стадия исследования продукта 10
1.2.2 Визуальное дизайн пользовательского интерфейса 10
1.2.3 Разработка технологий продукта 11
1.2.4 Тест ошибки 12
1.2.5 Линейка продуктов 12
1.2.6 Итерация продукта 13
1.3 Меры предосторожности для дизайна пользовательского интерфейса 13
1.3.1 Принципы усталости 13
Объяснение знаний—— шрифт 13
Объяснение знаний—— запись в форме 14
Объяснение знаний—— жест мыши 14
1.3.2 Принципы точности проекта 15
1.3.3 Принципы макета разумные принципы 16
1.3.4 Принципы операции разум 17
1.3.5 Принцип времени отклика системы 18
1.4 Влияние соответствия цвета на дизайн пользовательского интерфейса 18
1.4.1 Основная концепция цветовой схемы веб -страницы 18
Объяснение знаний—— веб -основной цвет 18
Объяснение знаний—— цвет веб -фона 19
Объяснение знаний—— Дополнение веб -страницы 19
Объяснение знаний—— веб -страница украшает цвет 20
1.4.2 Основной метод веб -цветовой схемы 20
Объяснение знаний—— определить основной цвет веб -страницы в соответствии с содержанием продукта 20
Объяснение знаний—— определить цветовую схему 21 в соответствии с основным цветом веб -сайта 21
1.4.3 Навыки соответствия веб -цвета 22
Объяснение знаний—— такая же цветовая система 23
Объяснение знаний—— прилегающий цвет 23
Объяснение знаний—— Contrast Color 25
Объяснение знаний—— дополнительный цвет 25
1.5 Сводка этой главы 26
Глава 2 знает эскиз в начале
2.1 Нарисуйте интерфейс обмена фотографиями iOS 28
2.1.1 Установка и запуск эскиза 28
Операционный случай—&Mdash; установите и запускайте набросок 28
2.1.2 Понять интерфейс Sketch 30
Объяснение знаний—— Главный интерфейс 31 эскиза 31
Объяснение знаний—— Бар меню 31
Объяснение знаний—— панель инструментов 34
Операционный случай—— пользовательская панель инструментов 34
2.1.3 Установите Ключ для сочетания эскиза 35
Объяснение знаний—— ярлык эскиза 35
Операционный случай—— пользовательский ярлык 37
2.1.4 Добавить картинки, форма 39
Объяснение знаний—— Sketch вставьте на панель 39
Объяснение знаний—— вставьте изображение 40
Объяснение знаний—— вставьте форму 41
2.1.5 Добавить текст 42
Объяснение знаний—— вставьте текст 43
2.2 Нарисуйте мобильный вход в систему 45
2.2.1 Новый и сохраненный файл эскиза 45
Объяснение знаний—— новое и сохранение файлов 45
Операционный случай—&Mdash; установите линейку эскиза 47
2.2.2 Используйте зарисованную чертежную доску 48
Объяснение знаний—— чертежная доска предусматривает 48
Объяснение знаний—— КЕПЕРСКИЙ КЕПИСКИЙ КЕПИ 50
2.2.3 Используйте шаблон эскиза 51
Объяснение знаний——&Ldquo; дизайн пользовательского интерфейса iOS” шаблон 52
2.3 Сводка этой главы 56
Глава 3 Прототип кадры линии чертежа
3.1 Нарисуйте мобильную информационную линию линии линии линии 58
3.1.1 Основная концепция прототипа линейной кадры 58
Объяснение знаний—— прототип линейного кадры концепция 60
Объяснение знаний—— визуальные характеристики прототипа линейной кадры 61
3.1.2 Меры предосторожности для прототипа линии линии чертежей 61
Объяснение знаний—— используйте свет и темный сравнение 63
Объяснение знаний—— не используйте скриншоты и цвет 64
Объяснение знаний—— отметьте высоту экрана 64
Объяснение знаний—— разумный макет и расстояние 65
3.2 Нарисуйте линию линии регистрации. Рисунок 65.
3.2.1.
Объяснение знаний—— краткое описание платы слоя 67
Операционный случай—— добавить и редактировать слой 68
Объяснение знаний—&Mdash; выберите слой 69
Операционный случай—— мобильный слой 70
3.2.2 Тип слоя 71
Объяснение знаний—— подробное объяснение слоя типа 73
Операционный случай—— изменить размер 75
3.2.3 Регулировка слоя 75
Операционный случай—— новый, переименованный, копировать и удалить страницу 78
Объяснение знаний—— копировать, вырезать и вставить слой 79
Объяснение знаний—— КЭСПИК 80 Группы слоев
3.3 Нарисуйте полную диаграмму прототипа линейной кадры 83
3.3.1 Рисунок шага по фрагментам приложения 01 84
3.3.2 Рисунок пошафтэффрагс фрагменты приложения 02 87
3.4 Сводка этой главы 91
Глава 4 Используйте эскиз, чтобы нарисовать значки
4.1 Нарисуйте IOS 11 Значок напоминания 93
4.1.1 векторный инструмент 93
Объяснение знаний—— Vector Graphics (форма) 95
Объяснение знаний—— точечный режим 95
Объяснение знаний—— Редактировать Vector Graphics 96
Случай случай—— Значок стрелки векторного инструмента 97
4.1.2 Использование пути 98
Объяснение знаний—— Путь 100
4.2 Нарисуйте значок камеры Android 101
4.2.1 Использование“ форма” нарисовать икону 102
Операционный случай—— используйте логическую операцию, чтобы нарисовать значок камеры 106
Объяснение знаний—— логические операции 107
4.2.2 Использование“ МОНГОЛИНА” нарисовать икона 108
Объяснение знаний—— МОНГОЛИНСКОЕ Правление командование 109
Операционный случай—— Сделайте простую икону 110 с прозрачной платой маски 110
4.2.3 Добавить эффект тени к значке Добавить текстуру 112
Объяснение знаний—&Mdash; основные атрибуты 113
4.3 Нарисуйте чрезвычайно упрощенный значок Android 116
4.3.1 Стандарт дизайна Android Design 116
Объяснение знаний—— критерии дизайна иконы 118
4.3.2 Три принципа дизайна иконы 120
Объяснение знаний—&Mdash; три принципа 122
4.3.3 Extreme Simplied Design 123
Объяснение знаний—— чрезвычайно упрощенный стиль дизайна 126
Операционный случай—&Mdash; рисуйте примечания, эта икона 127
4.4 Резюме этой главы 128
Глава 5 Дизайн пользовательского интерфейса Android
5.1 Нарисуйте интерфейс Android Music Player 130
5.1.1 Редактировать и использование компонентов 130
Объяснение знаний—— создать компонент 133
Объяснение знаний—&Mdash; замените текст 133
Объяснение знаний—— Компонент управления 134
Операционный случай—— используйте компонентные инструменты для рисования навигационной панели 135
5.1.2 Прикладной программный интерфейс Дизайн 136
Объяснение знаний—— что такое прикладное программное обеспечение дизайна 137
Объяснение знаний—— Спецификация дизайна пользовательского интерфейса программного интерфейса прикладного программного обеспечения 138
Объяснение знаний—— программный стартап -пользовательский интерфейс 139
5.1.3 Mobile App UI Design 140
Объяснение знаний—— что такое приложение 142
Объяснение знаний—— Trend Mobile UI Design 143
Объяснение знаний—— различия мобильного UI Мирного самолета UI 145
5.1.4 Android System Design 146
Объяснение знаний—— Android System System Text Design 148
Операционный случай—— нарисуйте кнопку возврата или меню 149
Объяснение знаний—— Android System Design Design имеет 150
5.2 Нарисуйте информационный интерфейс Android 151
5.2.1“ текст” команда 152
Объяснение знаний—— добавить текст 154
Объяснение знаний—— текстовое поле 154
5.2.2“ текст” Кетк 155
Объяснение знаний—— РЕДАКТИРОВАТЬ 157
Объяснение знаний—— стиль обмена 159
Операционный случай—— используйте общий стиль
Интерфейс рисования 160
5.2.3“ текст” вариант 161
Объяснение знаний—— текстовый путь 163
Объяснение знаний—— контур преобразования текста 164
Операционный случай—— преобразовать в контурное рисунок
Элемент интерфейса 164
Объяснение знаний—— экспортный текст 165
Объяснение знаний—— стиль применения 166
Объяснение знаний—— гибридный режим 168
5.3 Резюме этой главы 169
Глава 6 Дизайн интерфейса iOS
6.1 Нарисуйте интерфейс приложения для iPhone X 171
6.1.1 IOS System System UI Element 171
Объяснение знаний—&Mdash; Top Navigation Bar 173
Объяснение знаний—— метка и бака поиска 173
Операционный случай—— нарисуйте интерфейс iPhone X Startup 174
Объяснение знаний—&Mdash; таблица просмотр 176
6.1.2 Требования к дизайну пользовательского интерфейса IOS 177
Объяснение знаний—— убедитесь, что программа осуществима 178
Объяснение знаний—— убедитесь, что приложение может быть в
Universal 178 в iPhone и iPad
Объяснение знаний—— на основе веб -страницы
Уменьшить 179
6.1.3 Принципы проектирования систем IOS 179
Объяснение знаний—&Mdash; эстетика 182
Объяснение знаний—— последовательность 183
Объяснение знаний—— контроль осуществимости 184
Объяснение знаний—— своевременный 184
Объяснение знаний—— метафорический 184
Объяснение знаний—— автономия 185
6.1.4 IPhone X App Ui Design 185
Объяснение знаний—— Редактировать бит. Рисунок 188
Объяснение знаний—— размер экрана iPhone X 190
Объяснение знаний—&Mdash; iPhone X макет 190
6.2 Нарисуйте интерфейс приложения iPhone 8 191
6.2.1 Шаблон дизайна IOS приложения 192
Объяснение знаний—&Mdash; iPhone 8 компонент 193
Операционный случай—— Нарисуйте систему iPhone Video Playback Interface 194
Объяснение знаний—&Mdash; iPhone X компонент 195
6.2.2 Спецификация дизайна интерфейса iOS 195
Объяснение знаний—— размер интерфейса 198
Объяснение знаний—— размер значков 198
Объяснение знаний—— внутренний дизайн 199
6.2.3 Точки мобильного приложения 199
Объяснение знаний—— процесс проектирования пользовательского интерфейса APP 202
Операционный случай——
Объяснение знаний—— Приложение пользовательского интерфейса принцип 204
6.3 Сводка этой главы 206
Глава 7 Дизайн пользовательского интерфейса ПК
7.1 Интерфейс веб -сайта.
7.1.1 Разница между дизайном ПК и мобильным дизайном пользовательского интерфейса 208
Объяснение знаний—— веб -дизайн ПК Конечная гармония
Разница между мобильным терминалом 211
7.1.2 Инструменты и ножницы для карандашей 213
Объяснение знаний—— карандаш инструмент 215
Объяснение знаний—— ножницы инструмент 216
Операционный случай—— кнопка настройки дизайна и производства ① 216
Объяснение знаний—— вращение и копирование 217
Кнопка «Установить ② 218
Объяснение знаний—&Mdash; трансформатор 219
7.2 Нарисуйте медицинский веб -сайт Домашняя страница 219
7.2.1 Принципы проектирования пользовательского интерфейса ПК 220
Объяснение знаний—— пользователь -вятный 223
Объяснение знаний—— Visual Aesthetics 224
Объяснение знаний—— тема ясная 224
Объяснение знаний—— единый контент и форма 26
Объяснение знаний—— Organic в целом 227
Операционный случай—— рисунок“ повседневное пространство” начальная страница ① 227
7.2.2 PC -END UI DOANTIC 229
Объяснение знаний—— объединение дизайна и технологий 231
Объяснение знаний—&Mdash; визуальная ориентация 232
7.2.3 Стиль дизайна пользовательского интерфейса ПК 233
Объяснение знаний—— Volkswagen Design Style 234
Объяснение знаний—— персонализированный стиль дизайна 234
Операционный случай—— рисунок“ повседневное пространство” начальная страница ② 235
7.3 Эта глава является резюме 236
Глава 8 Вывод пользовательского интерфейса и интерактивный дизайн
8.1 Вывод изображения пользовательского интерфейса 238
8.1.1 Вывод значка 238
Объяснение знаний—&Mdash; адаптационное оборудование 238
Объяснение знаний—— экспортный слой 240
Объяснение знаний—— экспорт и срез 241
8.1.2 Выход интерфейса 241
Объяснение знаний—&Mdash; Slip Tool 242
Операционный случай—— переименован 245 для нарезки
8.2 Взаимодействие дизайна пользовательского интерфейса 245
Объяснение знаний—— знайте жест мобильных устройств 245
Объяснение знаний—— меры предосторожности для мобильного интерактивного эффекта Design 248
Объяснение знаний——
8.3 Sketch Plug -In Установка и используйте 250
Объяснение знаний—— Практический плагин -в 251
8.4 Сводка этой главы 252
Эта книга представляет использование, как использовать эскиз при разработке интерфейса веб -страницы с помощью большого количества производства дела.Выходные и взаимодействие вывода и взаимодействия прототипа рамки проволоки рисования эскиза, значка дизайна, дизайна интерфейса Android, дизайна интерфейса iOS, пользовательского интерфейса и взаимодействия пользовательского интерфейса ПК и взаимодействия пользовательского интерфейса.Через обучающие читатели должны быть знакомы со стандартами и точками дизайна мобильного дизайна пользовательского интерфейса и дизайна пользовательского интерфейса PC -END.В то же время освоите вывод интерфейса веб -страницы и метод добавления интерактивных эффектов.