lipsync simple way.

Hi to everyone!

I have done tutorial about simple lip sync in Synfig Studio, but it in Russian. I’d like to make Eng version, but my skill in English is to weak. Maybe someone would help me with translating better then google. In this case i will be able to resound my video with English narration.

my tutorial: youtube.com/watch?v=waI3AwXfIy4

full text in Russian:

intro
Girl:
Эй, парни,
типа, привет!
Тут, вопрос есть:
Как можно с кожи фломастер отчистить?
END of intro

И в самом деле как?..
Да, здравствуйте дорогие ютубозрители! Речь у нас сегодня пойдет все же не о фломастерах, которые как известно на вкус и цвет все разные, а о простом методе синхронизации рта анимированного персонажа с записанным голосом.
Моделью нам послужит персонажек моего старого трехкадрового комикса. Недавно я пытался его анимировать используя шаблон стикмен разработанный Константином Дмитриевым.
Однако, для освещения сегодняшней темы подобная сложность модели, пожалуй, избыточна и будет только отвлекать от главного.
Поэтому я специально изготовил сильно упрощенную версию.
Сцена состоит из девочки и фона нужного, чтобы героиня не болталась в сером ничто.
Сама девочка так же состоит из png картинки и рта.
Причем рот вынесен в отдельный экспортированный слой. Хотя для данного примера это, конечно, не обязательно, просто мне так привычней и удобней.
Итак, рот у нас присутствует в двух экземплярах. Один нужен, чтобы молчать, другой – чтобы говорить. Ну да, почти как в том анекдоте про программиста и пустой и полный стаканы.
Оба рта устроены одинаково: губы, внутренняя область, зубы и язык.
Причем, верхние три точки внутренней область полностью связаны с верхней губой, а нижние три точки с нижней. Полностью – это значит не только точки, но и касательные. Таким образом всем ртом можно оперировать как единым объектом прямо на уровне точек.
Для зубов и языка применен режим смешивания “OnTo”, в русской версии он может называться “на”. Это сделано, чтобы они не высовывались наружу: Вот как-то так.
Режим смешивания “OnTo”.
Тоже самое для языка.
Так, убираем это безобразие, что мы тут по-натворили.
Казалось бы почему для молчащего рта не обойтись просто черточкой? А потому, что молчащий рот еще улыбается, ухмыляется и артикулирует междометия. В нашем случае вот это самое начальное “э-э!”
Говорящий рот состоит из таких же элементов:
губы, зубы и внутренняя область.
Однако, он еще и анимирован, и все эти элементы находятся в непрерывном движении.
Суть такова, что каждые три кадра рот принимает формы характерные для различных фонем. Причем система расстановки этих фонем, как таковая, отсутствует. Точнее, единственное требование, чтобы соседние формы были резко друг на друга не похожи.
Вся эта последовательность укладывается в секунду и пять кадров.
Соответственно, чтобы ее растянуть на всю длину сцены, в говорящий рот добавляется слой “петля времени” с такой же длинной действия: секунда и пять кадров.
Делаем предпросмотр.
Смотрим.

first insert
Резюмируем первый подготовительный этап.
Нужно создать два рта: один молчит, иногда кривляется экает, нукает, второй – беспрерывно тараторит.
END of first insert

Что же, мы научили нашу героиню говорить, теперь осталось научить её молчать. Точнее, говорить только тогда, когда надо.
Нам нужно связать прозрачности двух ртов. Но не напрямую, а так, что бы, когда у одного ноль, у другого единица, и наоборот.
Преобразовываем параметр величина в переключатель (switch).
Тоже самое делаем и для говорящего рта.
Разворачиваем получившийся составной параметр и разбиваем связь между LinkOff и LinkOn.
LinkOn это значение которое будет принимать прозрачность, когда переключатель включен, а LinkOff, соответственно, когда выключен.
Нужно, чтобы молчащий рот был виден, если переключатель включен и не виден в противном случае.
Вот как-то так.
Тоже самое, только с противоположными значениями LinkOff и LinkOn повторяем с говорящим ртом.
Возвращаемся в рот молчащий и экспортируем переключатель, точнее его значение.
Затем с этим экспортированным значением связываем переключатель говорящего рта.
Все. Подготовительный этап завершен.

second insert
Резюмируем второй подготовительный этап.
Нужно через переключатель связать оба рта таким образом, чтобы в любой момент времени видимым был только один.
END of second insert

Дальше нам нужно работать с записанным голосом. И, поскольку Synfig Studio не поддерживает (пока!) звуковую дорожку, нам придется воспользоваться сторонними приложениями.
Например, есть замечательный звуковой редактор Audacity, кстати он работает и под виндосом.
Однако есть одна проблема: время в редакторе отображается в секундах и долях секунды, тогда как в синфиг студио в секундах и кадрах. То есть придется каким-то образом переводить доли секунды в кадры.
Лично у меня под рукой имеется еще один вариант: загрузить звуковую дорожку в синелеру. Фишка в том, что в этом редакторе можно настроить таймлайн таким образом, чтобы он отображал время в том же самом формате, что и синфиг.
“Установки” (setings) -> “параметры” (preferences) -> и вкладка “вешний вид” (interface)
Вот здесь это настраивается. И, поскольку я все равно использую синелеру для любой более менее сложной работы с виде (в том числе и этот урок я тоже монтирую здесь), правило бритвы Окама я не нарушаю.
Зато, насколько упрощается задача синхронизации анимации со звуком!
Просто ставим курсор в нужное место и смотрим отметку времени.
Переключаемся в Synfig и выставляем в нужном месте ключи анимации.
Правда, из-за некоторых особенностей работы синфига с булевыми значениями, что бы включить говорящий рот нужно ставить один ключ, а чтобы выключить – два.
Но так даже лучше: сразу видно при беглом взгляде на таймлайн, где у нас герой начал говорить, а где закончил.

last insert
Резюмируем третий основной этап.
Нужно, используя сторонний софт, определить по звуковой дорожке моменты времени, когда персонаж молчит, а когда говорит. В Synfig Studio расставить соответствующие ключи в режиме анимации.

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

Метод имеет ограничения.
Вам категорически не удастся таким образом анимировать поющего персонажа. Именно поющего, не читающего, там, речитатив или рэп какой-нибудь, а, вот, там, где есть протяжные гласные и тому подобные вещи.

Thanks
Хочу выразить благодарность Константину Дмитриеву и проекту “Моревна” за создание шаблона стикмена и непрекращающуюся работу по его усовершенствованию.
Особое спасибо Олегу Куваеву. Именно анализируя по кадрам его мульты, я и дошел до мысли о ленивом липсинке. Да! Масяня, Хрюндель, Лохматый и прочие говорят именно так, как описано в этом ролике, ну с поправкой на другой инструмент, стиль и прочие детали.
Также огромное спасибо всем вам, дорогие мои ютубозрители! Оценивайте, комментируйте, если захотите.
Всем пока, всем до свидания!

yop,

just an idea about :
the video streaming website (ytb) have a subtitle+translate (on the fly!) function,
this can help you to get the synchro of your voice (.srt or equivalent from ytb can be retrieved)
the tutorials you did can stay in original russian version and have some subtitle (.str or equivalent) for other languages (and you don’t have to resound)

anayway, you stilll need someone who can translate better than ggl or ytb …

see(:ya!

It is not a big problem to make subs. The main difficulties is translating. I try to make some. Please, tell me does it understandable? If my translating enough ok, i’ll finish it.

draft translation:

Ah!
Hey, guys,
Here is the question:
How to remove the marker from a skin?

And really how?..

Hello dear viewers! Nevertheless today we’ll talk not about the markers, but simple method of synchronizing lips of animated character with recorded voice.

Character of my old 3-frame comics will serve for us as a model. Recently I was trying to animate this using the stickman template, which developed by Konstantin Dmitriev.

However, to cover current topics such complexity of the model is probably redundant and will only distract from the essentials.

Therefore, I made ​​the highly simplified version.

The scene consists of the girl and the background which is necessary to replace the gray nothingness.

Girl herself also consists of png picture and mouth.

And the mouth placed in a separate exported layer. Although for this example it is not necessarily, I just so familiar and comfortable.

So, the mouth presented by two copies. One needs to keep quiet, the other – to talk. Well, almost like that old joke about the programmer and full and empty glasses.

Both mouths have the same structure: lips, inner region, teeth and tongue.

And the top three points of the inner region is completely linked with the upper lip and the bottom three points with the bottom lip.

Completely – this means not only points, but also tangents. Thus all the mouth can be controlled as a single entity at the level of the points.

For teeth and tongue used the blend method “OnTo”. This is done that they do not protrude out:

Here’s something like that.

Blend method “OnTo”.

The same goes for the tongue.

So, clean this mess that we’re here have done.

It is possibly to draw silent mouth just by dash. But silent mouth not only keep silent! It is smiling, grinning and articulates interjections. In our case, this is the initial “ah!”

Talking mouth consists of the same elements:

lips, teeth and inner region.

However, it is also animated, and all these elements permanently moves.

The point is that every three frames mouth makes forms specific to different phonemes. And there is no the rule of placement of these phonemes, the only requirement is that the neighboring forms were looks strongly different at each other.

This entire sequence is placed in a second and five frames.

Accordingly, in order to stretch it to the full length of scene, we add into talking mouth, a “time loop” layer with the same long action: one second and five frames.

Make a preview.

Viewing it.

Lets summarize the first preparatory stage.
We need to create two mouths, one silent, occasionally hamming, smiling and grinning, the second – constantly chattering.

Has i’m french, i can easily (mal)understand malformed english … :wink:
So for me at least the first draft is comprehensible.

see(:ya!

Second part of draft translation:

So… we had done teach the girl to speak. Now we have to teach her to keep quiet.
Make her speak just when it necessary, I mean.

It is necessary to connect transparency of two mouth. But not straight. When visibility of one mouth is zero, visibility of other should be 1.

Let’s convert “amount” property into “switch”.

And for another mouth let’s do same thing.

Expanding the resulting composite parameters and break the link between LinkOff and LinkOn.

“LinkOn” is the value that transparency will take, when the “switch” is on and “LinkOff” when turned off.

We need to silent mouth be visible if “switch” is on and be transparent in opposite case.

Something like this.

Same thing we do for speaking mouth, but using opposite values of LinkOff and LinkOn.

Let’s return to silent mouth and export the switch. Value of the switch, in real.

Then we will connect switch of speaking mouth to this exported value.

That’s all. Preparing stage is done.

Lets summarize the second preparatory stage.

We need to connect two mouths by their switches in way that only one mouth can be visible at any moment of time.

Final part of draft translation:

Next, we need to work with recorded voice. And since Synfig Studio does not support Audio track (not yet!) we have to use third party applications.

For example, there is a wonderful sound editor Audacity, the way it works and under windows too.

However, there is one problem:

Time is displayed in seconds and fractions of a second, whereas in Synfig Studio in seconds and frames. So we need somehow translate fractions of a second into frames.

I have another option: load audio track into Cinelerra.

The main goal is that is possible to tune timeline in the way it starts to show time in same format as Synfig Studio.

(setings) -> (preferences) -> (interface)

Here it is. And, since I’m anyway using Cinelerra for work with videos (including this lesson for example), Occam’s razor I do not break.

But how much simpler becomes task of synchronizing animation with sound!

Just put the cursor in the right place and look timestamp.

Switch back to Synfig and set in the right place the animation keys.

However, because of some features of the Synfig with Boolean values, to enable the speaker’s mouth we have to put one key, and to turn off put two.

But it’s even better: one can see at a cursory glance at the timeline where character began to speak, and where he stops.

Lets summarize the last and the main stage.
It is necessary, using third-party software, find in the soundtrack moments when the character is silent, and when he or she speaks. In Synfig Studio put the corresponding keys in the animation mode.

Well, summing up the whole process, you should pay attention to such a point that the rate of change of the speaker’s mouth phonemes should be consistent with the rate of speech, the speaker’s character. In this case, both have to be fast enough, or just in the mind of the viewer does not happen the synchronous with one another.

The method has a limit.
You absolutely can not animate singing character by this way. Exactly singing, not reading some rap, but, where there is a drawn-out vowels and things like that.

Thanks:
I want to thank Konstantin Dmitriev and the project “Morevna” for stikmen template creation and ongoing work to improve it.

A special thanks to Oleg Kuvaev. By analyzing his cartoons, and I got to thinking about a lazy lip Sync.

Also many thanks to all of you, my dear viewers! Rate this and comment if you wish. Good luck and goodbye!

If there is no objections, I will make subtitles from this translations.

MOdification proposition
And since Synfig Studio does not support Audio track (not yet in 0.64!)

Extra info
Synfig can configure how the time is displayed in Menu/File/Setupe/Misc./Timestamp

zmeyk, can you try to work with .srt (if you nto have planned to) or something equivalent to permit easy translation on other languages ?

Extra info2 /// check scripting … will post something about synchro with external soft’

ENG subtitles added: youtube.com/watch?v=waI3AwXfIy4

Unfortunately Synfig does not show time in fraction of second at any case.

I had worked with .srt in time when youtube was not exist. :slight_smile: It is not a problem at all.
lipsync_tut.srt.zip (4.18 KB)