From ac1eceefd113780f0bb3946e990000fd7e124f2d Mon Sep 17 00:00:00 2001 From: root Date: Fri, 2 Oct 2026 16:21:03 +0200 Subject: [PATCH] =?UTF-8?q?feat:=20=D0=BA=D0=B5=D0=B9=D1=81=20Primo=20AI?= =?UTF-8?q?=20Server=20=D0=BF=D0=BE=20=D1=84=D1=80=D0=B5=D0=B9=D0=BC=D0=B2?= =?UTF-8?q?=D0=BE=D1=80=D0=BA=D1=83=20STAR=20(=D1=81=D1=82=D1=80=D0=B0?= =?UTF-8?q?=D0=BD=D0=B8=D1=86=D0=B0=20=D0=B1=D0=B5=D0=B7=20=D1=81=D1=81?= =?UTF-8?q?=D1=8B=D0=BB=D0=BE=D0=BA=20=D0=BD=D0=B0=20=D1=81=D0=B0=D0=B9?= =?UTF-8?q?=D1=82=D0=B5,=20noindex,=20=D1=82=D0=BE=D0=BB=D1=8C=D0=BA=D0=BE?= =?UTF-8?q?=20ru)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- public/cases/primo-ai-server-star/index.html | 1301 ++++++++++++++++++ scripts/build-pages.mjs | 13 +- src/pages/cases/primo-ai-server-star.html | 525 +++++++ 3 files changed, 1837 insertions(+), 2 deletions(-) create mode 100644 public/cases/primo-ai-server-star/index.html create mode 100644 src/pages/cases/primo-ai-server-star.html diff --git a/public/cases/primo-ai-server-star/index.html b/public/cases/primo-ai-server-star/index.html new file mode 100644 index 0000000..f014834 --- /dev/null +++ b/public/cases/primo-ai-server-star/index.html @@ -0,0 +1,1301 @@ + + + + + + + Настройка AI Server без помощи внедрения — кейс + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ +
+ +
+
+
+ +
+
+ + +
+ + + +
+
+ +
+ + +
+
+

Product Design · AI · STAR

+

AI Server, который настраивают без внедренца

+

+ Как я снизил порог входа в Primo RPA AI Server,
+ разгрузил поддержку и отдел внедрения +

+ +
    +
  • + Роль + UX/UI-дизайнер +
    • +
  • + Продукт + Primo RPA AI Server +
    • +
  • + Платформа + Веб, on-premise +
    • +
  • + Структура кейса + STAR +
    • +
+ +
+

Ситуация

+

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

+

+ К моменту, когда меня позвали, продукт уже тестировали реальные клиенты. Собирали его разработчики своими силами, на + Ant Design под React со стилизацией под + Hope UI: у компании было несколько веб-продуктов и стояла задача унифицировать их вид. +

+
+ Главная страница AI Server до редизайна +
Так сервис выглядел, когда я пришёл в проект
+
+

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

+
+ +
+

Задача

+

+ Меня пригласили как UX/UI-дизайнера: проект делали одни разработчики, дизайнера в нём не было. Бизнес ждал, что настройку клиент сможет пройти сам, без постоянной помощи поддержки и внедрения. Моя задача звучала так: снизить порог входа, чтобы работать с сервисом могли люди без специальных знаний в ИИ и OCR. +

+ +

+ Остановить разработку и перерисовать всё целиком было нельзя, продукт уже в эксплуатации. Значит, менять придётся по частям, вкладываясь в текущие релизы. +

+
+ +
+

Действия

+ +

Погружение и разбор сценариев

+

+ Начал с команды: кто отвечает за продукт, кто за внедрение, как всё устроено сейчас. Разговаривал с экспертами по настройке, отделял ключевые сценарии от вспомогательных и собирал визуализацию того, как пользователь реально ходит по интерфейсу. Опыт в ИИ и в похожих веб-платформах помогал быстро понимать, о чём речь, и говорить с разработкой на одном языке. +

+

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

+ + +

Навигация: главная и внутри проекта

+

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

+
+ Обновлённая главная страница AI Server +
Обновлённая главная навигация: компактнее, под контент ушло заметно больше места
+
+

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

+
+
+
+ Навигация внутри NLP-проекта +
+
+ Навигация внутри OCR-проекта +
+
+
Одна и та же схема под разное число разделов: NLP-проект и OCR-проект
+
+

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

+
+ Вторичная навигация проекта со стрелочной формой пунктов +
Форма пунктов намекает на порядок, но не запирает в нём
+
+ +

Редактор разметки датасета

+

+ Здесь пользователь проводит больше всего времени. Разметка полей на сотнях изображений работа монотонная, но от неё зависит, насколько качественными будут данные для обучения модели. Прежний редактор выбивался из общего стиля сервиса, выглядел перегруженно и сбивал с толку в работе с полями. +

+
+ Редактор датасета до переработки +
Редактор до переработки
+
+

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

+
+ Редактор датасета после переработки +
Редактор после переработки, приведён к общей стилистике сервиса
+
+
+ Каркас редактора датасета, режим по умолчанию +
Каркас: почти всё пространство уходит под размечаемое изображение, действия сгруппированы по панелям
+
+

+ Добавил режим «Во весь экран». Продвинутые пользователи обычно прячут лишние панели и работают через горячие клавиши и нижнюю панель. Боковые панели сворачиваются, когда нужно больше места под изображение, на небольших мониторах это решает. +

+
+
+
+ Полноэкранный режим редактора с боковыми панелями +
+
+ Полноэкранный режим редактора без панелей +
+
+
Режим «Во весь экран»: с панелями и без
+
+
+ Нижняя панель инструментов редактора датасета +
Нижняя панель: переключение между изображениями и быстрые действия
+
+ +

Карточки настройки обучения

+

+ После разметки модель можно дообучить. Сценарий разобрали с командой так же, как остальные, и сделали несколько вариантов компоновки страницы. Выбрали ленту из карточек: она оказалась самой читаемой. +

+
+ Раздел обучения моделей в проекте +
Раздел обучения: лента карточек
+
+

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

+
+ Карточка настройки обучения модели +
Карточка настройки обучения: оценка качества разметки и параметры запуска
+
+

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

+ + +

Настройка параметров полей

+

+ Одна из страниц проекта требовала настройки уникальных параметров полей для датасета. Условия жёсткие: редактору нужна большая область под скан документа, полей может быть несколько десятков, у каждого свои зависимые параметры и типы. +

+
+
+ +
+
Прототип сопоставления полей в работе
+
+

+ Интерфейс получился компактным. Механика не считывается с первого взгляда, но после короткого обучения в нём работают уверенно. Это была самая длинная задача в проекте по числу черновиков: вариантов поведения перебрали много, пока не сошлись на том, что закрывает все сформулированные требования. +

+ +

Долгие процессы на отдельном экране

+

+ Часть задач в сервисе выполняется долго, и пользователю нужно параллельно делать что-то ещё. Для таких случаев сделали отдельную страницу с модальным окном процесса. +

+
+ Импорт датасета в модальном окне на отдельном экране +
Импорт датасета на отдельном экране
+
+

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

+
+ Заглушка с процессом импорта внутри проекта +
Заглушка внутри проекта: процесс виден, переход к нему в один клик
+
+

+ Тут сошлись удобство и стоимость разработки. Точечно блокировать кнопки на каждой странице вышло бы дороже, чем вынести процесс на отдельный экран. +

+
+ +
+

Результат

+

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

+

+ Что изменилось по сути: +

+
    +
  • порог входа снизился: работать с сервисом могут люди без знаний в ИИ и OCR;
    • +
  • часть настроек автоматизирована и спрятана от пользователя, рутины и ошибок меньше;
    • +
  • интерфейс стал консистентным, паттерны из одного раздела переезжают в другие;
    • +
  • под новые типы проектов и разделы заложено место, без переделок с нуля.
    • +
+ +

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

+
+ +
+

Что сделал бы иначе

+

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

+

+ И не тянул бы с юзерфлоу до середины проекта. Схемы сценариев окупились сразу, как только появились: они объясняли команде проблемы лучше любого описания. +

+
+
+
+ +
+
+

Смотрите также

+
    +
  1. + + +
    +

    Primo AI Server

    +
      +
    • UX/UI
      • +
    • Web App
      • +
    +

    Интерфейс для обучения и использования AI‑моделей в бизнес‑процессах: работа с данными, сценариями автоматизации и Smart OCR.

    +
    +     +
    2. +
  2. + + +
    +

    Lunacy

    +
      +
    • UX/UI
      • +
    • Desktop App
      • +
    +

    Работа над интерфейсом Lunacy в команде Icons8: user flow, сложные прототипы, улучшение функциональности и интерфейсной логики.

    +
    +     +
    3. + + +
  3. + + +
    +

    Primo Orc

    +
      +
    • Менторство и наставничество
      • +
    +

    Веб-кабинет оркестратора Primo RPA: проекты, запуск и контроль RPA-роботов. Редизайн ключевых экранов под продакшен без остановки релизов.

    +
    +     +
    4. + + +
+
+
+ + +
+
+

Контакты

+ +
+
+ + + + + + + + + + + diff --git a/scripts/build-pages.mjs b/scripts/build-pages.mjs index e2e3148..f98379a 100644 --- a/scripts/build-pages.mjs +++ b/scripts/build-pages.mjs @@ -37,6 +37,13 @@ const NOINDEX_PAGES = new Set([ "cases/design-system", "cases/template-elements-demo", "cases/mini-projects-showcase", + "cases/primo-ai-server-star", +]); + +// Страницы, у которых пока нет перевода: собираются только в дефолтную локаль, +// чтобы /en/ не отдавал русскоязычный дубль и не попадал в sitemap. +const DEFAULT_LOCALE_ONLY_PAGES = new Set([ + "cases/primo-ai-server-star", ]); const titleRe = /([\s\S]*?)<\/title>/i; @@ -187,7 +194,8 @@ function buildSitemap(pageFiles) { if (NOINDEX_PAGES.has(noSlug)) continue; const lastmod = lastModFor(relNorm); const locUrl = canonicalFor(relNorm, DEFAULT_LOCALE); - const alternates = LOCALES.map( + const buildLocales = DEFAULT_LOCALE_ONLY_PAGES.has(noSlug) ? [DEFAULT_LOCALE] : LOCALES; + const alternates = buildLocales.map( (loc) => ` <xhtml:link rel="alternate" hreflang="${loc}" href="${canonicalFor(relNorm, loc)}" />` ); @@ -346,8 +354,10 @@ function build() { const isResume = relNorm === "resume.html"; const isCookiePolicy = relNorm === "cookie-policy.html"; const omitFile = isCase ? path.basename(pagePath) : null; + const noSlug = relNorm.replace(/\.html$/, ""); for (const loc of LOCALES) { + if (loc !== DEFAULT_LOCALE && DEFAULT_LOCALE_ONLY_PAGES.has(noSlug)) continue; const dict = i18n[loc] || {}; const isDefault = loc === DEFAULT_LOCALE; const langPrefix = isDefault ? "" : `${loc}/`; @@ -361,7 +371,6 @@ function build() { const source = readUtf8(sourcePath); // --- SEO-переменные для head-seo / json-ld --- - const noSlug = relNorm.replace(/\.html$/, ""); const isNoindex = NOINDEX_PAGES.has(noSlug); const canonicalUrl = canonicalFor(relNorm, loc); const metaSource = extractMeta(source); diff --git a/src/pages/cases/primo-ai-server-star.html b/src/pages/cases/primo-ai-server-star.html new file mode 100644 index 0000000..14028e5 --- /dev/null +++ b/src/pages/cases/primo-ai-server-star.html @@ -0,0 +1,525 @@ +<!DOCTYPE html> +<html lang="ru" data-theme="dark" data-radius="medium" data-font="merriweather"> + <head> + <meta charset="utf-8" /> + <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" /> + <meta + name="description" + content="Кейс по фреймворку STAR: как я упростил настройку проектов в Primo RPA AI Server и снизил порог входа для клиентов." + /> + <title>Настройка AI Server без помощи внедрения — кейс + {{> head-links}} + {{> head-plyr}} + + + + + {{> header-case}} +{{> fab-stack}} +
+
+

Product Design · AI · STAR

+

AI Server, который настраивают без внедренца

+

+ Как я снизил порог входа в Primo RPA AI Server,
+ разгрузил поддержку и отдел внедрения +

+ +
    +
  • + Роль + UX/UI-дизайнер +
    • +
  • + Продукт + Primo RPA AI Server +
    • +
  • + Платформа + Веб, on-premise +
    • +
  • + Структура кейса + STAR +
    • +
+ +
+

Ситуация

+

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

+

+ К моменту, когда меня позвали, продукт уже тестировали реальные клиенты. Собирали его разработчики своими силами, на + Ant Design под React со стилизацией под + Hope UI: у компании было несколько веб-продуктов и стояла задача унифицировать их вид. +

+
+ Главная страница AI Server до редизайна +
Так сервис выглядел, когда я пришёл в проект
+
+

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

+
+ +
+

Задача

+

+ Меня пригласили как UX/UI-дизайнера: проект делали одни разработчики, дизайнера в нём не было. Бизнес ждал, что настройку клиент сможет пройти сам, без постоянной помощи поддержки и внедрения. Моя задача звучала так: снизить порог входа, чтобы работать с сервисом могли люди без специальных знаний в ИИ и OCR. +

+ +

+ Остановить разработку и перерисовать всё целиком было нельзя, продукт уже в эксплуатации. Значит, менять придётся по частям, вкладываясь в текущие релизы. +

+
+ +
+

Действия

+ +

Погружение и разбор сценариев

+

+ Начал с команды: кто отвечает за продукт, кто за внедрение, как всё устроено сейчас. Разговаривал с экспертами по настройке, отделял ключевые сценарии от вспомогательных и собирал визуализацию того, как пользователь реально ходит по интерфейсу. Опыт в ИИ и в похожих веб-платформах помогал быстро понимать, о чём речь, и говорить с разработкой на одном языке. +

+

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

+ + +

Навигация: главная и внутри проекта

+

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

+
+ Обновлённая главная страница AI Server +
Обновлённая главная навигация: компактнее, под контент ушло заметно больше места
+
+

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

+
+
+
+ Навигация внутри NLP-проекта +
+
+ Навигация внутри OCR-проекта +
+
+
Одна и та же схема под разное число разделов: NLP-проект и OCR-проект
+
+

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

+
+ Вторичная навигация проекта со стрелочной формой пунктов +
Форма пунктов намекает на порядок, но не запирает в нём
+
+ +

Редактор разметки датасета

+

+ Здесь пользователь проводит больше всего времени. Разметка полей на сотнях изображений работа монотонная, но от неё зависит, насколько качественными будут данные для обучения модели. Прежний редактор выбивался из общего стиля сервиса, выглядел перегруженно и сбивал с толку в работе с полями. +

+
+ Редактор датасета до переработки +
Редактор до переработки
+
+

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

+
+ Редактор датасета после переработки +
Редактор после переработки, приведён к общей стилистике сервиса
+
+
+ Каркас редактора датасета, режим по умолчанию +
Каркас: почти всё пространство уходит под размечаемое изображение, действия сгруппированы по панелям
+
+

+ Добавил режим «Во весь экран». Продвинутые пользователи обычно прячут лишние панели и работают через горячие клавиши и нижнюю панель. Боковые панели сворачиваются, когда нужно больше места под изображение, на небольших мониторах это решает. +

+
+
+
+ Полноэкранный режим редактора с боковыми панелями +
+
+ Полноэкранный режим редактора без панелей +
+
+
Режим «Во весь экран»: с панелями и без
+
+
+ Нижняя панель инструментов редактора датасета +
Нижняя панель: переключение между изображениями и быстрые действия
+
+ +

Карточки настройки обучения

+

+ После разметки модель можно дообучить. Сценарий разобрали с командой так же, как остальные, и сделали несколько вариантов компоновки страницы. Выбрали ленту из карточек: она оказалась самой читаемой. +

+
+ Раздел обучения моделей в проекте +
Раздел обучения: лента карточек
+
+

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

+
+ Карточка настройки обучения модели +
Карточка настройки обучения: оценка качества разметки и параметры запуска
+
+

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

+ + +

Настройка параметров полей

+

+ Одна из страниц проекта требовала настройки уникальных параметров полей для датасета. Условия жёсткие: редактору нужна большая область под скан документа, полей может быть несколько десятков, у каждого свои зависимые параметры и типы. +

+
+
+ +
+
Прототип сопоставления полей в работе
+
+

+ Интерфейс получился компактным. Механика не считывается с первого взгляда, но после короткого обучения в нём работают уверенно. Это была самая длинная задача в проекте по числу черновиков: вариантов поведения перебрали много, пока не сошлись на том, что закрывает все сформулированные требования. +

+ +

Долгие процессы на отдельном экране

+

+ Часть задач в сервисе выполняется долго, и пользователю нужно параллельно делать что-то ещё. Для таких случаев сделали отдельную страницу с модальным окном процесса. +

+
+ Импорт датасета в модальном окне на отдельном экране +
Импорт датасета на отдельном экране
+
+

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

+
+ Заглушка с процессом импорта внутри проекта +
Заглушка внутри проекта: процесс виден, переход к нему в один клик
+
+

+ Тут сошлись удобство и стоимость разработки. Точечно блокировать кнопки на каждой странице вышло бы дороже, чем вынести процесс на отдельный экран. +

+
+ +
+

Результат

+

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

+

+ Что изменилось по сути: +

+
    +
  • порог входа снизился: работать с сервисом могут люди без знаний в ИИ и OCR;
    • +
  • часть настроек автоматизирована и спрятана от пользователя, рутины и ошибок меньше;
    • +
  • интерфейс стал консистентным, паттерны из одного раздела переезжают в другие;
    • +
  • под новые типы проектов и разделы заложено место, без переделок с нуля.
    • +
+ +

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

+
+ +
+

Что сделал бы иначе

+

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

+

+ И не тянул бы с юзерфлоу до середины проекта. Схемы сценариев окупились сразу, как только появились: они объясняли команде проблемы лучше любого описания. +

+
+
+
+ + {{> projects-related}}{{> projects-section}} +{{> contact-section}} +{{> footer}} +{{> cookie-notice}} +{{> nav-more-floating}} + + + +