4 сентября 2020
Создание сайтов
3

Разработка корпоративного сайта для SimpleOne

О компании

SimpleOne — разработчик программного обеспечения для автоматизации бизнес-процессов всех подразделений компании, занимающихся процессной и проектной деятельностью в области оказания услуг. SimpleOne ставит своей целью занять лидирующее положение на рынке ESM-систем (Enterprise Service Management systems).

Screenshot 1: SimpleOne site made by Drozd.red

Задача

Разработать за ограниченный период времени (3 месяца) корпоративный сайт, который поможет вывести на рынок новый продукт. Ресурс должен наглядно показывать, как работает система, и в чем ее конкурентные преимущества для бизнеса.

Screenshot 2: SimpleOne site made by Drozd.red

Сложности

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

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

В то же время на начальном этапе саму CMS (WordPress) требовалось серьезно кастомизировать, чтобы в дальнейшем не тратить время на верстку новых страниц «с нуля» без использования шорткодов.

Порядок работ

  1. Интервью с владельцами продуктов.
  2. Выбор CMS и инструментов разработки, которые позволили бы выпустить сайт в сжатые сроки.
  3. Составление и согласование ТЗ.
  4. Написание контента.
  5. Создание прототипов.
  6. Разработка дизайна и согласование его с заказчиком.
  7. Разработка.
  8. Тестирование и выход в продакшен.

Screenshot 3: SimpleOne site made by Drozd.red

Screenshot 4: SimpleOne site made by Drozd.red

Технологии

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

Screenshot 5: SimpleOne site made by Drozd.red

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

Для работы с бэкэндом использовалась одна из последних версий PHP 7.4 — этим также объясняется высокая скорость работы сайта.

Фронтенд-составляющая использовала препроцессоры SASS+PostCSS, которые обеспечили меньший объем кода и упростили структуру наследования стилей. Выбор между SASS и LESS был сделан в пользу первого из-за более широкой функциональности.

Для автоматизации доставки обновлений в продакшен использовался GitLab CI/CD. Эти меры были направлены на то, чтобы разбить работу по спринтам, выпуская небольшие, но готовые блоки за каждый отрезок времени.

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

Итоги

Новый корпоративный сайт был запущен в оговоренный срок и получил всю закрепленную в техзадании функциональность.

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

Оцените данную статью