На этапе создания дизайна сайта был поставлен ряд задач, с одной стороны сложных, с другой — интересных и нетипичных.

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

Первое, чему уделялось внимание — это цветовая схема сайта. Мы сразу определились, что она должна быть в холодных тонах, но в тоже время не отталкивать пользователя этим «холодом». Цвет, который мы выбрали, стал сочетанием серого, бирюзового и серебристого. Этот цвет стал основным на сайте.

Вторым ключевым моментом стал выбор выбор шрифтов для сайта. Он должен был быть легким и в тоже время строгим, удобным глазу пользователя. И мы нашли таковой. Шрифт Roboto справился со своей задачей как нельзя лучше. Один из его видов Roboto Light стал основным шрифтом, придав сайту легкость и визуальную простоту.

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

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

Следующим этапом после создания дизайна стала верстка сайта. Здесь задачи были четкие и понятные. Сайт нужно было сверстать аккуратно. Он должен быть адаптирован под мобильные устройства для охвата большей аудитории интернет-пользователей. Для выполнения данных задач были использованы современные инструменты и техника верстки.

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

Т.к. функционал сайта был построен на базе 1С-Битрикс, то каждая страница содержит  отдельный компонент, а иногда и набор компонентов. Это означает, что требовалось выполнить верстку шаблонов всех компонентов, которые были использованы на сайте. Здесь возникли некоторые трудности в силу того, что многие компоненты 1С-Битрикс имеют табличную верстку. Она хороша когда речь идет о верстке самих таблиц, но для верстки страниц она не совсем подходит. Табличная верстка затрудняет представление страниц сайта на экранах мобильных устройств. Поэтому было принято решение привести верстку шаблонов компонентов к уже общепринятой блочной верстке.

Еще одной нетипичной задачей стало создание всплывающего меню. Это меню меняет свою высоту в зависимости от уровня пользователя. Если это анонимный пользователь, который еще не зарегистрирован в системе, то для него меню имеет одну высоту. Для зарегистрированного пользователя меню содержит больше элементов и имеет большую высоту. Это нужно было учесть для корректного отображения на различных устройствах и обеспечить прокрутку полотна, содержащего меню.

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