Редактор чувашских орнаментов и узоров онлайн: собираем узор в браузере

Редактор чувашских орнаментов работает по адресу daniilak.ru/pattern_editor. Он открывается в браузере, стоит ноль рублей и не просит регистрации. Вы берёте из палитры готовый мотив чувашской вышивки — кӗскӗ или дерево, — ставите его на сетку, поворачиваете и достраиваете мелкими деталями. Готовый узор редактор отдаёт двумя способами: файлом SVG без фона и списком координат. Координаты всех мотивов я выложил в chuvash-patterns как публичное достояние.

Коротко

• Что это. Конструктор чувашского узора в браузере. Сетка, привязка элементов к её узлам, палитра мелких деталей и палитра крупных мотивов.
• Где.daniilak.ru/pattern_editor.
• Цена. Нисколько. Рекламы нет, счёт создавать не нужно, узоры остаются в браузере и на сервер не уходят.
• Что на выходе. Файл SVG без фона. Это векторный рисунок: узор задан линиями, поэтому он остаётся чётким при любом увеличении. Ещё редактор отдаёт координаты узора в файле JSON — это обычный текст с числами.
• Права. Координаты и цифровые версии узоров лежат под лицензией CC0 1.0. Это публичное достояние: копируйте, меняйте, продавайте, авторство указывать не нужно.
• Кому пригодится. Мастерам вышивки и дизайнерам. Ещё учителям ИЗО и сувенирным цехам.

Зачем нужен отдельный редактор чувашских узоров

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

Я оцифровывал традиционные мотивы и убедился, что универсальные программы тут мешают. В Illustrator и Inkscape сетку и привязку приходится настраивать вручную, а потом следить, чтобы отрезок закончился точно в узле, а не рядом с ним. Paint даёт растровую картинку: она состоит из точек, и при увеличении вылезают квадратики. Программы для схем вышивки крестом требуют рисовать каждый крестик отдельно, а готовых чувашских мотивов там нет.

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

Сравнение с другими программами

Чувашский орнамент удобнее собрать в специализированном редакторе, а доводить файл там, где вы привыкли работать. Выгрузка в SVG для этого и нужна.

Сетка и координаты

Рабочее поле — бесконечный холст с сеткой. Каждый мотив хранится списком отрезков «точка — точка», у части мотивов есть ещё и залитые области. Такая запись даёт три полезных свойства.

1. Точность. Концы отрезков попадают в узлы сетки, поэтому соседние мотивы стыкуются без зазоров и наложений.
2. Обратимость. Поворот на 90° и отражение не портят геометрию: координаты остаются целыми числами.
3. Переносимость. Один и тот же узор можно нарисовать линиями в SVG, разложить по клеточкам в схему для вышивки или обработать программой. Это просто числа.

Кнопка Сетка прячет и показывает сетку. Кнопка Коорд подписывает координаты точек — так удобно записать узор в открытую библиотеку и проверить, где проходит ось симметрии. Колёсико мыши меняет масштаб. Инструмент «Панорама» и средняя кнопка мыши сдвигают холст, а кнопки Холст − и Холст + отдаляют и приближают его.

Каталог мотивов

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

Базовые элементы

• Ствол и Линия ½ — вертикальные отрезки полной и половинной длины. Из них растут стебли и оси.
• Диагональ — отрезок под 45°.
• Ромб и Ромб ½ — середина многих мотивов, в полном и уменьшенном вдвое размере.
• Ромб заливка и Ромб ½ заливка — те же ромбы, но закрашенные. В вышивке так передают плотное поле.
• Треугольник Л ½, Треугольник П ½ и их закрашенные версии — половинки ромба, разрезанные по вертикали.
• Завиток Л и Завиток П — боковые крючки, от которых идут ветви.
• Крона Л и Крона П — верхние отростки, которые завершают композицию.

Крупные фигуры

• Кӗскӗ 1, Кӗскӗ 2, Кӗскӗ 3 — варианты нагрудной розетки, самого узнаваемого чувашского мотива. Восемь лучей, полная симметрия.
• Кеске из сердца — та же розетка, собранная из сердец.
• Солнце — звезда с лучами.
• Дерево — составной мотив: ствол, ромб в середине, завитки и кроны.
• Птица и Птица заливка — контурный и закрашенный вариант.
• Человек и Человечек — фигуры разного размера.
• Крыло, Жук, Цветок, Сердце, Большое сердце, Взаимопонимание — мотивы для бордюров и заполнения полей.

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

Как собрать свой чувашский узор

1. Откройте редактор. Холст пустой, сетка включена. Если вы работали раньше, редактор подхватит черновик из памяти браузера.
2. Поставьте основу. Для симметричной композиции возьмите крупный мотив: перетащите на сетку Кӗскӗ или Дерево. Мотив встанет в ближайшие узлы, редактор подсветит точку стыковки.
3. Достройте детали. Добавьте ромбы, завитки и кроны из верхней палитры. Стрелки ←↑→↓ сдвигают выделенное на шаг сетки.
4. Сделайте симметрию. Выделите фрагмент, скопируйте его через Ctrl+C, вставьте через Ctrl+V и отразите кнопкой ⟷ Горизонт. или ↕ Вертикаль. Зеркальная половина готова. Повороты — кнопки ⟲ 90° и 90° ⟳.
5. Поменяйте размер части узора. Кнопки ×2 и ÷2 увеличивают и уменьшают выделенное вдвое. Пригодится, когда бордюр должен быть мельче середины.
6. Настройте вид. Ползунок Толщина задаёт толщину линий, два поля цвета — фон холста и цвет узора. Редактор запомнит выбор до следующего раза.
7. Проверьте композицию. Выключите сетку и отдалите холст колёсиком. В геометрическом орнаменте сбитая симметрия видна на общем плане.
8. Выгрузите результат. Кнопка SVG даёт вектор без фона. Кнопки Выделение и Весь холст — координаты. Кнопка JSON холста — файл, который потом откроется в редакторе.

Ошиблись — нажмите Ctrl+Z. Редактор ведёт историю по шагам, так что пробовать варианты безопасно.

Горячие клавиши

Выгрузка: SVG, координаты, сохранение холста

Правая панель «Экспорт / импорт» нужна тем, кто собирается узор использовать, а не просто посмотреть.

SVG без фона

Кнопка SVG скачивает векторный файл: контуры узора линиями, прозрачный фон, верные пропорции. Такой файл открывает любой векторный редактор, он не теряет качества при увеличении и годится для печати, резки и сайта. Имя файла редактор берёт из поля рядом с кнопками, так что мотив можно сразу назвать по-своему.

Координаты

Кнопки Выделение и Весь холст выводят в текстовое поле координаты: список отрезков и залитые области, если они есть. Это нужно, когда узор идёт в работу как данные — в генератор орнаментов или в программу, которая разложит узор по деталям изделия. Кнопка Копировать кладёт всё в буфер обмена.

Сохранение холста и загрузка своих мотивов

Кнопка JSON холста сохраняет работу целиком: все мотивы и настройки просмотра. Файл возвращается в редактор кнопкой Импорт, если вставить текст в поле, или кнопкой Файл…, если выбрать .json с диска. Редактор понимает три вида файлов: объект с полем segments (или segs) и необязательным fills, массив таких объектов и сохранённый холст { pieces, view }. Свои мотивы удобно хранить рядом с проектом и передавать коллегам.

Черновик редактор сохраняет сам, в памяти браузера. Закрыли вкладку, вернулись через день — узор на месте. Память эта локальная, поэтому важные работы выгружайте в файл.

Что делать с узором дальше

Векторные редакторы

Файл из редактора открывают Inkscape и Illustrator, а также CorelDRAW и Figma. Дальше вы делаете то, чего в узорном конструкторе нет: заливки и надписи.

Печать и сувениры

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

Лазерная резка и станки с ЧПУ

Узор из отрезков хорошо подходит для лазера и фрезера: контуры сходятся в узлах сетки, лишних точек нет. SVG принимают LightBurn и LaserGRBL, а также программы подготовки для станков. Так делают деревянные панно и накладки на мебель.

Машинная вышивка

Вышивальной машине нужен файл со стежками, а не с линиями. Самый доступный путь — бесплатное расширение Ink/Stitch для Inkscape. Оно превращает контуры и заливки в строчки, а потом сохраняет их в форматы вышивальных машин: PES, DST. Геометричный чувашский узор для этого подходит, но толщину линий и плотность заливки подбирайте под ткань.

Ручная вышивка и схемы крестом

Если вы вышиваете руками, узор из редактора служит схемой: шаг сетки соответствует счёту нитей. Рабочий приём — выгрузить SVG, положить его поверх клетчатого фона в любом редакторе и обвести узор по клеточкам. Симметрия и пропорции уже выверены, рисовать мотив заново не придётся.

Почему координаты лежат под CC0

Координаты узоров я выложил в репозиторий github.com/daniilak/chuvash-patterns под лицензией CC0 1.0. Это публичное достояние: их можно копировать, менять, встраивать в свои продукты и продавать. Разрешения спрашивать не нужно, авторство указывать тоже.

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

Если вы делаете свой инструмент — приложение или шрифт с орнаментами, — координаты уже готовы. Библиотека растёт, и новые мотивы попадают и в репозиторий, и в редактор.

Что редактор не умеет

• Он не заменяет Illustrator. Редактор собирает геометрию узора. Цвет, эффекты и надписи — следующий шаг в векторном редакторе.
• Каталог неполный. Чувашский орнамент огромен, в редакторе пока часть мотивов. Список я пополняю по мере оцифровки.
• На телефоне сложнее. Панели прячутся в кнопки, касания работают, но точная сборка мышью идёт быстрее.
• Черновик лежит только в этом браузере. Почистили данные сайта или сели за другой компьютер — черновика нет. Сохраняйте JSON холста.
• Символику редактор не объясняет. Для трактовок мотивов берите этнографические книги и музейные описания.

Другие инструменты на сайте

• Генератор SVG-орнаментов — размножает один мотив в бесконечное полотно. Нужен, когда требуется заполнить площадь, а не собрать композицию.
• Игра с чувашскими узорами — слияние элементов на той же библиотеке мотивов. Заодно запоминаются формы.
• chuvash-patterns на GitHub — сами данные, координаты мотивов в открытом виде.

Частые вопросы

Существует ли онлайн-редактор чувашских орнаментов?

Да, он работает по адресу daniilak.ru/pattern_editor — в браузере на компьютере и на телефоне, бесплатно и без регистрации. Это инструмент под чувашский узор: сетка, привязка, библиотека традиционных мотивов.

Чем он отличается от Paint и Photoshop?

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

Как создать чувашский орнамент онлайн бесплатно?

Откройте редактор, перетащите на сетку крупный мотив, достройте композицию мелкими элементами, отразите половину для симметрии и нажмите SVG. Простой узор выходит за пару минут, сложный — за вечер.

Где скачать чувашский орнамент в векторе?

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

А PNG или JPG?

Отдельной кнопки нет, потому что вектор универсальнее. Картинка из точек получается в один шаг: откройте SVG в Inkscape или Figma и сохраните PNG нужного размера, при желании с прозрачным фоном.

Подойдёт ли узор для вышивки крестом?

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

Можно ли использовать узоры в коммерческих проектах?

Да. Координаты и цифровые версии узоров лежат под CC0 1.0, авторство указывать не требуется. Сервис работает «как есть»: за итоговые файлы и их применение отвечаете вы. Если вещь идёт в тираж, сверьтесь с источниками по традиционным мотивам.

Работает ли редактор на телефоне и планшете?

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

Нужен ли интернет во время работы?

Только чтобы загрузить страницу. Дальше редактор считает всё в браузере: узоры на сервер не уходят, счёт не нужен, черновик лежит локально.

Можно ли добавить свой мотив?

Да. Запишите узор координатами отрезков в JSON и загрузите его кнопкой Импорт или Файл…. Если мотив традиционный и вы готовы им поделиться, пришлите его в репозиторий — добавлю в библиотеку.

Is there an online Chuvash ornament editor in English?

The interface is in Russian, but it works by dragging and dropping, so you can use it without reading Russian: drag motifs onto the grid, rotate or mirror them, then save SVG or JSON. Pattern coordinates are public domain (CC0) in the chuvash-patterns repository.

Итог

Чувашский орнамент строится по сетке, и в цифре это его сильная сторона. Редактор чувашских орнаментов и узоров берёт на себя самый долгий шаг — сборку композиции из традиционных мотивов с точной геометрией. Готовый файл вы отправляете в печать или на лазерный станок.

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

Попробовать: daniilak.ru/pattern_editor