Для создания анимации из линий в современных веб-редакторах можно использовать, например, кроссплатформенный векторный редактор Inkscape. 1

Порядок действий: 1

1. Подобрать и обработать растровое изображение. 1 Если рисунок маленький, его можно увеличить и сразу обработать, улучшив качество с помощью бесплатных онлайн-сервисов, использующих искусственный интеллект. 1
2. Создать линию path в документе SVG при помощи инструмента Pen Tool в редакторе Inkscape. 1
3. Открыть панель слоёв, загрузить на нижний слой растровое изображение, создать новый слой и уже на нём обводить линию обводки контура. 1
4. Оптимизировать линию обводки в SVG. 1 Чем точнее линия, тем качественнее получится анимация. 1 Для плавности все узлы следует по возможности создавать симметричными. 1
5. Определить длину линии обводки. 1
6. Добавить в SVG стили и @keyframes анимацию рисования линии контура. 1

Также для создания анимации живых линий можно использовать HTML5 Canvas на JavaScript. 3