Что такое прототип сайта?
Прототип сайта — это схема будущего сайта, которая помогает визуализировать размещение информации (контента) на сайте.
Каким может быть прототип сайта?
Прототип сайта может быть представлен как в графическом виде, составленный в любой графической программе или нарисованный от руки на листе бумаги, так и в текстовом виде, описанный простыми словами.
Прототип может выглядеть как угодно. Его главная задача — схематически передать оформление и содержание будущей страницы сайта.
Примеры прототипа сайта
Графический прототип (пример)
Текстовый прототип (пример)
_____ 1 блок _____
Заголовок: "Свежие морепродукты с доставкой на дом"
Подзаголовок: "Свежая рыба, красная икра, морские деликатесы и множество других морепродуктов по низким ценам."
Кнопка "Заказать" (переход на всплывающее окно с формами имени, телефона и кнопкой "отправить". Заголовок: "Оставьте свой телефон и мы вам перезвоним")
Этот блок должен быть ярким, мне бы хотелось видеть фотографию морепродуктов на заднем фоне.
_____ 2 блок _____
Заголовок: "Почему заказывать морепродукты следует у нас: "Следующий текст оформите на свой вкус:
- Доставка в Новосибирске и Новосибирской области
- Собственный склад в пределах города
- Доставка до квартиры в течение 1 суток
Кнопка "Узнать больше" (будет вести на блок ниже, под названием "Мы гарантируем качество нашего товара")
_____ 3 блок _____
Заголовок: "Мы гарантируем качество нашего товара "Тут следует разместить фотографии наших сертификатов, которые находятся по ссылке "ссылка"
_____ 4 блок _____
Заголовок: "Отзывы наших клиентов" Тут следует разместить отзывы наших клиентов, которые находятся в текстовом документе.
_____ 5 блок _____
Заголовок: "Контакты"
Телефон: +7 999 999 99 99
E-mail: mail@mail.ru
Далее нужно сделать форму обратной связи
Подзаголовок: "Оставьте свой телефон и мы вам перезвоним"
Поля для ввода имени и телефона и кнопка "отправить".
Заголовок: "Свежие морепродукты с доставкой на дом"
Подзаголовок: "Свежая рыба, красная икра, морские деликатесы и множество других морепродуктов по низким ценам."
Кнопка "Заказать" (переход на всплывающее окно с формами имени, телефона и кнопкой "отправить". Заголовок: "Оставьте свой телефон и мы вам перезвоним")
Этот блок должен быть ярким, мне бы хотелось видеть фотографию морепродуктов на заднем фоне.
_____ 2 блок _____
Заголовок: "Почему заказывать морепродукты следует у нас: "Следующий текст оформите на свой вкус:
- Доставка в Новосибирске и Новосибирской области
- Собственный склад в пределах города
- Доставка до квартиры в течение 1 суток
Кнопка "Узнать больше" (будет вести на блок ниже, под названием "Мы гарантируем качество нашего товара")
_____ 3 блок _____
Заголовок: "Мы гарантируем качество нашего товара "Тут следует разместить фотографии наших сертификатов, которые находятся по ссылке "ссылка"
_____ 4 блок _____
Заголовок: "Отзывы наших клиентов" Тут следует разместить отзывы наших клиентов, которые находятся в текстовом документе.
_____ 5 блок _____
Заголовок: "Контакты"
Телефон: +7 999 999 99 99
E-mail: mail@mail.ru
Далее нужно сделать форму обратной связи
Подзаголовок: "Оставьте свой телефон и мы вам перезвоним"
Поля для ввода имени и телефона и кнопка "отправить".
В каком виде нужно передавать прототип дизайнеру?
Во-первых: Весь контент в одном месте.
Весь текстовый контент нужно собрать в один документ расставив поочередно, все фотографии пронумеровать и разделить по папкам (страницам).
Во-вторых: Пример дизайна, который вам нравится.
Приведите в пример любой сайт или несколько сайтов, которые вам нравятся. Они послужат реферансами (ориентиром) и будут взяты за основу вашего сайта.
Если вам нравятся отдельные элементы с разных сайтов, то так и распишите в ТЗ: Адрес сайта www.site.ru, мне нравится оформление главной страницы, адрес сайта www.site2.ru, мне нравится как сделан каталог товаров и т.п.
В-третьих: Выделите заголовки, пункты, акценты.
Информация должна быть разделена на смысловые блоки. Сплошной и длинный текст сложно читать.
В-четвертых: Дополнительные пожелания.
Напишите уточнения (пожелания) по картинкам, блокам, кнопкам, формам, всплывающим окнам и другим элементам.
Весь текстовый контент нужно собрать в один документ расставив поочередно, все фотографии пронумеровать и разделить по папкам (страницам).
Во-вторых: Пример дизайна, который вам нравится.
Приведите в пример любой сайт или несколько сайтов, которые вам нравятся. Они послужат реферансами (ориентиром) и будут взяты за основу вашего сайта.
Если вам нравятся отдельные элементы с разных сайтов, то так и распишите в ТЗ: Адрес сайта www.site.ru, мне нравится оформление главной страницы, адрес сайта www.site2.ru, мне нравится как сделан каталог товаров и т.п.
В-третьих: Выделите заголовки, пункты, акценты.
Информация должна быть разделена на смысловые блоки. Сплошной и длинный текст сложно читать.
В-четвертых: Дополнительные пожелания.
Напишите уточнения (пожелания) по картинкам, блокам, кнопкам, формам, всплывающим окнам и другим элементам.
Заключение
Заключение
Прототип сайта является важным инструментом при создании сайта, позволяющим определить основные элементы дизайна и функционала и получить представление о том, как будет выглядеть ваш готовый сайт. Прототип поможет сэкономить время и ресурсы на этапе разработки, предотвратит ошибки и позволит быстро внести изменения.
Прототип сайта является важным инструментом при создании сайта, позволяющим определить основные элементы дизайна и функционала и получить представление о том, как будет выглядеть ваш готовый сайт. Прототип поможет сэкономить время и ресурсы на этапе разработки, предотвратит ошибки и позволит быстро внести изменения.
