Приложение 7 Пример доработки нотификаций

Приложение 7

Пример доработки нотификаций

А: Перечень нотификаций

Б: ТЗ на дизайн шаблона нотификаций

Задача

Разработать дизайн для автоматических писем shop-example.ru: новая учетная запись, напоминание пароля и т. п.

Материалы

• Сайт магазина: ссылка на интернет-магазин.

• Бренд-бук shop-example: ссылка на скачивание бренд-бука.

• Шаблон для массовой рассылки: ссылка на скачивание шаблона.

Общие требования

• Цвета, шрифты, изображения, ссылки, кнопки и другие графические элементы сделать в стиле сайта, бренд-бука и уже разработанного шаблона.

• Фон снаружи письма: светло-серый.

• Фон тела письма: белый.

• Рамка вокруг письма: тонкие серые линии, по углам скругление.

• Ширина письма: 600px.

• В результате предоставить исходники шаблонов в PSD.

Эскиз

1. «Шапка»

• Слева логотип магазина.

• Справа телефонная трубка и номер телефона + время работы:

+7 (777) 777–77–77

пн. – пт. с 10:00 до 19:00

2. Тело письма

• Заголовок: Здравствуйте, {Имя}!

• Горизонтальная серая линия.

• Текст:

Добро пожаловать на сайт «Shop-example». Для входа в свою учетную запись на сайте просто нажмите Войти или Моя учетная запись вверху справа на любой странице и введите адрес своей электронной почты (e-mail) и пароль.

• Блок с логином и паролем.

• Обрамление блока рамкой с тонкими серыми границами.

• Заливка фоном – таким же, как вокруг письма, или подобрать другой, но неяркий.

• Текст в рамке:

Данные для авторизации на сайте:

E-mail: testmail @ yandex. ru

Пароль: 123456

• Текст с маркированным списком (буллиты подобрать красивые, в цвете сайта):

• Добро пожаловать на сайт «Shop-Example».

• Для входа в свою учетную запись на сайте просто нажмите Войти или Моя учетная запись.

• Введите адрес своей электронной почты (e-mail) и пароль.

• Подзаголовок: Ваш заказ #000000000 (создан 11 апреля 2014 г. 12:06:55 MSK)

• 5 блоков с данными о заказе.

• Блоки 1–2 в один ряд, блоки 3–4 в один ряд, блок 5 по всей ширине.

• Блоки в рамках, залиты фоном, фон подзаголовков сделать темнее.

• Блок 1

Подзаголовок: Информация о плательщике

Текст:

Имя Фамилия

Город

Адрес

Страна

Тел.: +75555555555

• Блок 2

Подзаголовок: Метод оплаты

Текст:

Метод оплаты | Ссылка на оплату

• Блок 3

Подзаголовок: Информация о доставке

Текст:

Способ доставки

Адрес

Страна

Тел.: +75555555555

• Блок 4

Подзаголовок: Метод доставки

Текст:

Способ доставки, сроки доставки

• Блок 5

Блок с составом заказа, таблицей.

«Шапку» таблицы залить так же, как блоки 1–4.

Столбцы визуально разделить пустыми промежутками с другим фоном (вместо границ).

Предварительный итог: 10 250,00 руб.

Доставка и обработка: 950,00 руб.

Итого к оплате: 11 200,00 руб.

• Текст:

Если у Вас возникли вопросы по поводу Вашей учетной записи или любой другой вопрос, пожалуйста, свяжитесь с нами по адресу info @ shop-example. ru или по телефону +7 (777) 777–77–77.

• Кнопка: За покупками

(попробовать разные фирменные цвета, можно пробовать градиент)

• Горизонтальная серая линия

• Подпись: С уважением, Ваш Shop-example:-)

3. Футер

• Верхняя часть:

• 5 монохромных иконок в ряд, разделенных светлыми вертикальными линиями.

• Иконки подобрать, цвет подобрать. Под каждой иконкой подпись.

1. Акции

2. Новинки

3. Конкурсы

4. Адреса магазинов

5. Обратная связь

• Нижняя часть:

• Фон совпадает с фоном вокруг письма.

• Текст темно-серым, мелко, по центру:

Вы получили это сообщение, потому что зарегистрировались на shop-example.ru.

Сообщение было сгенерировано сайтом автоматически.

© 2014 Shop-example

В: ТЗ на внедрение нотификаций

Задача

Внедрить новый html-шаблон в нотификации магазина (письма о регистрации, заказе, восстановлении пароля и т. п.).

• Перечень нотификаций: ссылка на перечень нотификаций.

• E-mail отправителя: newsletter @ shop-example. ru.

• Имя отправителя: Shop-example Service.

{* Контент подставлять с таким же форматированием, как в шаблоне (выделение жирным, цвет шрифта и т. п.).}

Г: Напоминание о брошенной корзине

Данный текст является ознакомительным фрагментом.