На 10 минут круче: скетчинг и прототипирование

1,480 views
1,221 views

Published on

Первый выпуск «На 10 минут круче» на нашем youtube-канале учит основам скетчинга и прототипирования веб-интерфейсов.
Вот, чему вы научитесь:
—узнаете, что такое скетч, и почему это не рисунок
— выберите правильные инструменты для работы
— научитесь простым упражнениям, чтобы поставить руку
— научитесь делать скетчи понятными

Пройти курс Станиславы Балакиревой «Основы скетчинга и прототипирования»: http://bit.ly/1qVgc2c

Перейти на youtube-канал «Нетологии»: http://www.youtube.com/user/netologytv

Published in: Design

На 10 минут круче: скетчинг и прототипирование

  1. 1. ЯНДЕКС.   ДИРЕКТ. CLICK 
 TO EDIT
 MASTER CLICK TO EDIT
 MASTER ОНЛАЙН-КУРС: «ЯНДЕКС. ДИРЕКТ. НАЧАЛО РАБОТЫ.» СКЕТЧИНГ И ПРОТОТИПИРОВАНИЕ Станислава
 Балакирева
 Проектировщик пользовательских
 интерфейсов   В «UsabilityLab»
  2. 2. ЧТО ТАКОЕ
 СКЕТЧИНГ? Скетч — это эскиз, быстрый рисунок
 Скетчинг — процесс создания скетчей
  3. 3. Я
 НЕ УМЕНЮ РИСОВАТЬ НЕВЕРНЫЕ УСТАНОВКИ ОСНОВНАЯ ЦЕЛЬ СКЕТЧИНГА — ПЕРЕДАТЬ ИДЕЮ, НАВЫКИ РИСОВАНИЯ НЕ ИМЕЮТ ЗНАЧЕНИЯ
  4. 4. ИНСТРУМЕНТЫ
  5. 5. ЗАПАСИТЕСЬ ИНСТРУМЕНТАМИ • Блокноты из плотной бумаги • Листы А4 в огромных количествах
  6. 6. ТРЕНИРУЙТЕСЬ
  7. 7. ИЩИТЕ ЛЕГКИЕ ПУТИ ! Элементы интерфейсов ! • Научитесь рисовать стандартный элементы интерфейсов • Добавляйте тени, объем
  8. 8. ИЩИТЕ ЛЕГКИЕ ПУТИ ! Элементы интерфейсов ! Стандартные поля ввода данных
  9. 9. ЛЕГКИЕ ПУТИ
  10. 10. ДЕТАЛИЗИРУЙТЕ
  11. 11. ДЕТАЛИЗИРУЙТЕ Работайте со слоями ! • Начните с маркера серого цвета и постепенно добавляйте темные слои (маркеры+ручки) • Не начинайте с ручки, если вы потом добавите маркер, чернила расплывутся
  12. 12. РАБОТА СО СЛОЯМИ С помощью различных оттенков серого, шриховки, а также насыщенных темных линий можно передать многослойность в скетче ! ПРИМЕР
  13. 13. ДЕТАЛИЗИРУЙТЕ Изображайте взаимодействия ! • Используйте стикеры и добавляйте с их помощью подсказки, окна и любые интерактивные элементы на свой скетч • Используйте разные цвета, чтобы обозначить разные типы взаимодейстия
  14. 14. ОТОБРАЖЕНИЕ ВЗАИМОДЕЙСТВИЯ С помощью стрелок можно показать переходы между состояниями системы, а с помощью стикеров можно отобразить интерактивные элементы, например, выпадающее меню ! ПРИМЕР
  15. 15. ВЫВОДЫ • Важно понимать, в чем основная роль скетчинга на начальных этапах • Используйте правильные инструменты • Тренируйтесь, используйте существующие приемы, придумывайте свои
  16. 16. Занятия от ведущих специалистов Рунета Обучение с любого устройства Открытые занятия c экспертами Рунета. 3 раза в неделю. Онлайн-интенсивы для обучения интернет- профессиям. 1,5–2,5 месяца. Интерактивные курсы по маркетингу и интернет- бизнесу, 2–3 часа, 40+ курсов. Доступ 24/7! FREE
  17. 17. ПРИСОЕДИНЯЙТЕСЬ! vk.com/netology facebook.com/netology.ru youtube.com/netologytv netology.ru/blog slideshare.net/netology twitter.com/netology_ru

×