Прототипирование сайтов. Разбор примера прототипирования страницы каталога интернет-магазина.

1. Прототипирование сайтов

2. Для кого?

3. Владельцы веб-студий
Менеджеры проектов
Маркетологи
Заказчики
Фрилансеры
Дизайнеры

4. Прототипирование сайта позволяет
одновременно уменьшить
себестоимость разработки сайта и
повысить качество готового продукта

5. Это — прототип страницы сайта

6. Прежде чем Вы начали
создавать прототип
1) Определите цели сайта
Какие задачи должен выполнять готовый проект?
2) Исследуйте тематику
Хотя бы минимально

7. Разбор типичных ошибок
прототипирования на примере страницы
каталога товаров в интернет магазине

8. Прототип должен быть
1 к 1 в масштабе сайта.

10. Лесенка в строке товаров

11. Перечеркнутая цена

12. Расположение нескольких стикеров на 1 товаре

13. Все возможные варианты
переключателей
в фильтре товара

14. а) Не забыть постраничную навигацию, если она будет на сайте.
б) Текст должен быть на языке сайта.*
в) Картинка в тексте.
*Может пригодиться vesna.yandex.ru

15. Не забывайте:
Оставлять ссылку на разработчика;
показывать счетчик, если он будет

16. Если есть всплывающие окна на сайте - прототипируйте.

17. Плагины wp для работы с
прототипами

18. https://wordpress.org/plugins/design-feedback/

19. Позволяет:
Загрузить картинку дизайна на страницу сайта
Переключаться между страницами прототипа
Оставлять комментарии к прототипам/дизайну
http://www.mockupplugin.com/mockup/mac-page/

20. Инструменты

21. NinjaMock
http://ninjamock.com/
Omnigraffle (mac)
ConceptDrawPro (pc)
Pidoco (online)
Mockingbird (online)
Pencil (pc, mac, linux)
Axure (pc, mac)

22. Спасибо!

23. Рябов Иван
skype: ivan-ryabov
vk: vk.com/ivan_ryabov
tel: +7 916 657 36 43