Разработка сайта для Всероссийского Научно-Исследовательского Института Биологической Защиты Растений из Краснодара (ВНИИБЗР)

1. Вводная задача от заказчика, проблематика, цели

Клиент:

Всероссийский Научно-Исследовательский Институт Биологической Защиты Растений из Краснодара.

На момент обращения имел очень печальный опыт разработки сайта. Это накладывает неудобство в том, что теперь никому не доверяют.

Usability

Спроектировать и разработать удобную структуру сайта, с помощью которой пользователь в минимальное количество кликов сможет найти нужную информацию, оформить заявку или зарегистрироваться в Личном кабинете.

Дизайн

Представить деятельность института, в частности мероприятия, проводимые два раза в год.

Программирование

Настроить панель администрирования сайта CMS 1С-Битрикс под задачи проекта для самостоятельной работы с контентом

сделать необходимые настройки для дальнейшего продвижения по CEO.

Разработка макета главной страницы

• Аналитика и проработка структуры будущего сайта.
• Создание общей концепции проекта, основных элементов, шрифтов, цветов, паттернов, изображения.
• Отрисовка макета главной страницы без ограничений в правки макета.

Макет дизайна страницы «мероприятия»

• Верстка страниц.
• Выбор мероприятия.
• Мероприятие.
• Личный кабинет.

Программирование:

• Мероприятия.
• Документы для скачивания.
• Спонсоры.
• Карта с метками и аннотациями.
• Форма обратной связи.
• Регистрация/ авторизация.
• Возможность прикреплять файлы.

HTML-верстка макетов

Подбор элементов анимации при помощи HTML5/CSS3 и JavaScript. Кроссбраузерная верстка десктоп с поддержкой:

• Chrome не ниже 77 версии;
• Firefox не ниже 69 версии;
• Opera не ниже 64 версии;
• Яндекс.Браузер не ниже 19 версии;
• Safari для iOS не ниже 13 версии.

Адаптивная верстка под мобильные устройства с поддержкой:

• Chrome;
• Яндекс. Браузер;
• Safari Mobile.

Поддержка разрешений:

320px - 1920px (ширина устройства).

Точки контроля верстки:

320, 768, 1024, 1366, 1440, 1600, 1920

2. Описание реализации кейса и творческого пути по поиску оптимального решения

Мы разделили работу на несколько этапов. Каждый этап решает определенную задачу и заканчивается согласованным итогом.

При нажатии в главном меню на раздел «XI международная..» открывает страницу «выбора мероприятия». В списке выбора есть текущие мероприятие (нажатие на которое ведет на «Страницу мероприятия») и два прошедших, а также «архив».

Страница «выбора мероприятия» состоит из набора блоков – 4 единицы. Где самый большой блок, это текущие мероприятие (картинка, текст, анимация), два поменьше – прошедшие мероприятия (картинка, текст, анимация) и еще меньше архив.

Главная.

Блок эмблем. Через панель администрирования возможна вставка изображений в блок.

Фоновое изображение также меняется из панели администрирования.

Блок с названием мероприятия представляет из себя картинку и название мероприятия.

Приветственный текст на странице мероприятия можно редактировать из панели администрирования следующим образом: вставка и удаление из него изображений, видеофайлов, текста.

На странице мероприятия из административной панели можно менять:

• Шрифт и его размеры.
• Размеры изображений и видеофайлов: во всю ширину блока, в половину, в треть, в четверть.
• Месторасположение изображений и видеофайлов: в центре, в одном из боков.
• Возможность размещения текста сбоку от изображения.
• Проигрывание видеофайлов: автоматически при открытии страницы, по желанию пользователя.
• Звук видеофайла при проигрывании: выключен или включен.

Личный Кабинет

Регистрация новых пользователей происходит через специальную форму с указанием: ФИО, электронного адреса. Форма защищена от спам регистраций. После регистрации пользователю на почту приходит пароль его учетной записи. Логином является электронный адрес пользователя, указанный при регистрации.

Все вновь зарегистрированные пользователи получают статус «пользователь». Администратор может повысить роль учетной записи до «аспирант», «преподаватель» или «администратор» в ручном режиме. Тип учетной записи влияет на права доступа к ряду разделов на сайте.

В личном кабинете пользователю доступны для заполнения следующие данные о себе:

• Дата рождения.
• Полное название организации.
• Должность.
• Ученая степень.
• Контактный телефон.

Пользователь может оставить в личном кабинете один или несколько файлов, общим объёмом не более 20 мегабайт с комментарием.

Администратор в свою очередь имеет возможность отключить эту возможность у одного или всех пользователей сразу. Оставленные файлы должны быть доступны администратору и идентифицироваться каким пользователем, когда и с каким комментарием они оставлены. Оставленные файлы, вместе с комментарием, ФИО пользователя, после нажатия пользователем кнопки «сохранить» должны быть автоматически направлены по указанному электронному адресу.

На «странице мероприятия» есть следующие разделы ведущие на соответствующие страницы (доступ к ним осуществляется через меню и подменю.)

Участникам:

• Условия участия – возможность скачать квитанцию (три варианта с разницей в сумме).
• Договор на участие в конференции – возможность скачать договор.
• Подача статей WoC и РИНЦ — возможность разместить файл с комментарием.
• Требования к оформлению публикаций – возможность скачивания файла.
• Требования к оформлению докладов - возможность скачивания файла.

Раздел «Спонсоры и выставка»:

• Спонсоры – набор блоков с логотипом. При наведении на блок, карточка переворачивается и появляется описание.
• Спонсорский пакет.
• Заявка на участие – форма с полями для заполнения.

Информация

• Информационные письма.
• Место проведения конференции – встроенная карта с возможностью масштабирования. Добавили возможность выбора точки приезда (аэропорт, ж/д вокзал, автовокзал) для получения карты с направлением движения и маршрутами транспорта. На странице также указывается таблица с маршрутом проезда до места проведения конференции.
• Гостиничное размещение.
• Обеды/ужины (+праздничный ужин).
• Отчет о проведенном мероприятии - текст с модулем просмотра фотографий. Все фотографии будут отсортированы на несколько разделов и модуль должен предусматривать выбор нужного раздела.
• Раздел Контакты: Красиво оформленные наши контакты с формой обратной связи (заполненная форма уходит на указанный почтовый адрес), предусмотреть защиту от спама.
• Раздел регистрация – страница формы регистрации. Уже сделана.
• Приветственное слово - страница с картинками и текстом.
• Оргкомитет – набор текстов.
• Программа – сложно сконструированный текст (возможно картинка, для упрощения)
• Заполнять страницы текстом и картинками, будем сами.
• Все страницы кроме «контактов», «отчета о проведении мероприятия» и «места проведения», выполнены по единому
• шаблону. Предоставить для утверждения шаблон этих страниц с небольшими элементами дизайна на ваш выбор (фон,
• цветовой переход и т.п.).

3. Результаты сотрудничества

Нам удалось расположить клиента к себе и довериться нам в создании сайта. Благодаря чему, мы смогли совместно разработать удобный для пользователей сайт.