Редизайн Демопримеров Loginom

Демопримеры

Демопримеры — это небольшие готовые сценарии на примере которых можно посмотреть как решится та или иная задача в программе Loginom. Предыдущий дизайн сайта был сложен для понимания и перегружен информацией. Нужно было срочно все упростить.

Проблема № 1 — слишком много информации

Старый сайт демопримеров

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

Проблема № 2 — тегирование материала

Со стороны UX-дизайнера мне нужно было решить как должна выглядеть работа с тегами в этом проекте. После того как внешний вид и поведение тегов были определены нужно было их реализовать. И вот тут возникла проблема — нет ни одного адекватного плагина для их реализации для Gitbook на базе которого будут работать демопримеры.

Gitbook — это в хорошая для своих задач система и так как выбор между ней и другой системой не стоял — пришлось реализовывать теги самим. Так как я занимаюсь веб-разработкой и знаком с JavaScript решил что стоит попробовать свои силы в написании системы реализующей такой функционал. Система работала, но кода было очень много и его сложно было бы поддерживать — требовался рефакторинг. Как раз в тот момент мне посоветовали присмотреться к TypeScript. Собственно в дальнейшем проект был переписан на нём. А паре с моим коллегой Замараевым Никитой мы доделали эту систему и теперь у нас в Gitbook есть теги. К сожалению реализовать это в виде плагина не представилось возможным из-за требований к тегам и особенностей работы Gitbook. Поэтому частично система работала до сборки проекта Gitbook, а часть — уже после. Таким образом теги работали как и было задумано. Ведь неважно что под капотом системы — главное чтобы она была понятной и удобной для пользователей.

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

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