Дизайн мобильной версии сайта
Заказчик
[no-member:pro]Алексей[/no-member:pro]Алексей
Параметры проекта
Вариант сотрудничестваОдноразовый проект
РазделДизайн и Мультимедиа
Предоплатабез предоплат
Способы оплатыБанковский перевод
Приём заявокзавершён
Описание проекта
Техническое задание на разработку дизайна мобильной версии Официального сайта г.Череповца
Адрес мобильной версии -
В мобильной версии сайта должны быть представлены основные сервисы сайта и несколько ключевых страниц. Мобильная версия имеет собственную структуру страниц, не зависящую от основной версии сайта.
Сервисы
1. Лента новостей
2. 500100 Онлайн-спасатель
3. Госуслуги
4. Гид Череповец
5. Поиск по сайту
Типовые страницы
1. Главная страница
2. Типовая страница
3. Архив новостей
4. Новость
5. Госуслуги
6. Гид: главная
7. Гид: рубрика
8. Гид: компания
9. Страница поиска
Общие требования к дизайну
1. Сохранение цветовой гаммы, набора шрифтов, общей визуальной концепции сайта.
2. Есть желание сверстать сайт с помощью фрэймворка bootstrap, потому визуальное использование элементов фрэймворка приветствуется
3. Дизайн должен предполагать “резиновую вёрстку”: ширина страницы растягивается до ширины разрешения экрана. Минимальная ширина страницы 320 px.
Общие элементы дизайна
1. Навигация в выезжающем сбоку меню.
2. В шапке - стандартная кнопка открытия/закрытия меню, заголовок, может быть кнопка для открытия поля для поиска, может быть анимированное появление поля поиска.
3. В верху сайта также должна быть предусмотрена возможность появления текстового сообщения о перенаправлении на мобильную версию, с кнопками “всегда открывать мобильную версию” и “вернуться на полную версию сайта”.
4. В меню или в подвале должна быть кнопка перехода к полной версии сайта.
5. В подвале - контактная информация, ссылки на сообщества, копирайт.
6. Рекламные места
Дизайн отдельных страниц
Главная страница
1. Главная страница должна включать в себя ленту новостей.
A. Количество отображаемых новостей в ленте должно быть ограничено. Должна быть предусмотрена кнопка подгрузки новостей (“ещё новости”, “далее” и т.п.).
B. Должны отображаться дата и время опубликования новости, значки видео, фото, в круглых скобках могут быть указаны жанры (статья, интервью, репортаж).
C. При возможности можно отображаться количество просмотров и лайков новости.
D. При возможностью фото. (c и d - необязательно, исходя из возможностей и вкуса).
2. Если получится, то можно отдельно выделить блок - 3 главные новости.
3. Блок кнопок или пиктограмм для перехода к другим разделам мобильной версии - Гид, Камеры, Госуслуги, Онлайн-спасатель
Типичная страница
На типичной странице необходимо прорисовать типичные элементы html:
- абзац
- гиперссылка
- изображение
- видео ролик с youtube
- таблица
- списки нумерованный и маркированный
Архив новостей
1. Выбор даты
2. Лента новостей на эту дату, формат ленты и новости ленты должен быть такой же, как на главной странице.
Новость
1. Заголовок
2. Фото
3. Текст новости
4. Дата и время публикации
5. Количество просмотров и лайков
6. Кнопка “Мне нравится” вконтакте
7. Блок кнопок “Поделиться” Yandex Share со счётчиками вконтакте, твиттер, фэйсбук, одноклассники, мой мир.
8. Перечень рубрик
Госуслуги
1. Аналог страницы
2. Рубрикатор должен содержать пиктограммы (муниципальные и социальные услуги) и официальные логотипы служб (государственные услуги), по которым пользователю предлагается оценка. Готовые пиктограммы будут предоставлены позже в процессе разработки дизайна, логотипы служб взять из открытых источников.
Гид: главная
1. Аналог страницы
Гид: рубрика
1. Перечень компаний, входящих в рубрику. Если получится, то логотип и какая-то краткая информация (м.б. Адрес или телефон?)
2. Яндекс-карта с отметками всех компаний.
3. Возможность подгрузки не поместившихся на первую страницу компаний
Гид: компания
1. Аналог страницы компании в основной версии сайта.
2. Адрес, телефон, контакты
3. Адреса и контактные данные филиалов организации
4. Просмотр на карте Яндекса
5. Список рубрик
Страница поиска
1. Строка поиска
2. Результаты поиска
3. Подгрузка “еще”
Техническое представление: файлы в формате psd, слои сгруппированы и имеют понятные названия.
ВНИМАНИЕ. Работа по гражданско-правовому договору. БЕЗ ПРЕДОПЛАТЫ!
Адрес мобильной версии -
В мобильной версии сайта должны быть представлены основные сервисы сайта и несколько ключевых страниц. Мобильная версия имеет собственную структуру страниц, не зависящую от основной версии сайта.
Сервисы
1. Лента новостей
2. 500100 Онлайн-спасатель
3. Госуслуги
4. Гид Череповец
5. Поиск по сайту
Типовые страницы
1. Главная страница
2. Типовая страница
3. Архив новостей
4. Новость
5. Госуслуги
6. Гид: главная
7. Гид: рубрика
8. Гид: компания
9. Страница поиска
Общие требования к дизайну
1. Сохранение цветовой гаммы, набора шрифтов, общей визуальной концепции сайта.
2. Есть желание сверстать сайт с помощью фрэймворка bootstrap, потому визуальное использование элементов фрэймворка приветствуется
3. Дизайн должен предполагать “резиновую вёрстку”: ширина страницы растягивается до ширины разрешения экрана. Минимальная ширина страницы 320 px.
Общие элементы дизайна
1. Навигация в выезжающем сбоку меню.
2. В шапке - стандартная кнопка открытия/закрытия меню, заголовок, может быть кнопка для открытия поля для поиска, может быть анимированное появление поля поиска.
3. В верху сайта также должна быть предусмотрена возможность появления текстового сообщения о перенаправлении на мобильную версию, с кнопками “всегда открывать мобильную версию” и “вернуться на полную версию сайта”.
4. В меню или в подвале должна быть кнопка перехода к полной версии сайта.
5. В подвале - контактная информация, ссылки на сообщества, копирайт.
6. Рекламные места
Дизайн отдельных страниц
Главная страница
1. Главная страница должна включать в себя ленту новостей.
A. Количество отображаемых новостей в ленте должно быть ограничено. Должна быть предусмотрена кнопка подгрузки новостей (“ещё новости”, “далее” и т.п.).
B. Должны отображаться дата и время опубликования новости, значки видео, фото, в круглых скобках могут быть указаны жанры (статья, интервью, репортаж).
C. При возможности можно отображаться количество просмотров и лайков новости.
D. При возможностью фото. (c и d - необязательно, исходя из возможностей и вкуса).
2. Если получится, то можно отдельно выделить блок - 3 главные новости.
3. Блок кнопок или пиктограмм для перехода к другим разделам мобильной версии - Гид, Камеры, Госуслуги, Онлайн-спасатель
Типичная страница
На типичной странице необходимо прорисовать типичные элементы html:
- абзац
- гиперссылка
- изображение
- видео ролик с youtube
- таблица
- списки нумерованный и маркированный
Архив новостей
1. Выбор даты
2. Лента новостей на эту дату, формат ленты и новости ленты должен быть такой же, как на главной странице.
Новость
1. Заголовок
2. Фото
3. Текст новости
4. Дата и время публикации
5. Количество просмотров и лайков
6. Кнопка “Мне нравится” вконтакте
7. Блок кнопок “Поделиться” Yandex Share со счётчиками вконтакте, твиттер, фэйсбук, одноклассники, мой мир.
8. Перечень рубрик
Госуслуги
1. Аналог страницы
2. Рубрикатор должен содержать пиктограммы (муниципальные и социальные услуги) и официальные логотипы служб (государственные услуги), по которым пользователю предлагается оценка. Готовые пиктограммы будут предоставлены позже в процессе разработки дизайна, логотипы служб взять из открытых источников.
Гид: главная
1. Аналог страницы
Гид: рубрика
1. Перечень компаний, входящих в рубрику. Если получится, то логотип и какая-то краткая информация (м.б. Адрес или телефон?)
2. Яндекс-карта с отметками всех компаний.
3. Возможность подгрузки не поместившихся на первую страницу компаний
Гид: компания
1. Аналог страницы компании в основной версии сайта.
2. Адрес, телефон, контакты
3. Адреса и контактные данные филиалов организации
4. Просмотр на карте Яндекса
5. Список рубрик
Страница поиска
1. Строка поиска
2. Результаты поиска
3. Подгрузка “еще”
Техническое представление: файлы в формате psd, слои сгруппированы и имеют понятные названия.
ВНИМАНИЕ. Работа по гражданско-правовому договору. БЕЗ ПРЕДОПЛАТЫ!
