Sync Audio and Text Replacement

Replacements allow the content of the layer being replaced with a different content.

The Sync Audio and Text Replacement window allows you to configure a text layer that will highlight the words while an audio file plays in the background (from now on we will call it Synced layer). Synced layers will not render as images but as real text (be careful because text renders differently in different platforms. It is always a good idea to test the final project in the destination device – check this posting to learn a bit more about how text from Photoshop works with Corona code: Select the layer you want to add the Sync feature and click the Sync audio and text replacement. The following window appears:

Information about the current layer content will appear in the top of the window (position and size).

When enabled, the Use native system font (do not import external font files) checkbox will use the device’s default font, instead the original font used in Photoshop. The benefit of doing that is the fact you will not need to worry importing and testing the original font in the devices. If disabled, Kwik will ask for the font file when publishing (it will be copied and attached to the final build folder).

External fonts may require some manual input. For more info, read the How to Use Custom Fonts from Corona documentation. Important: you must have the rights to use an external font. Kwiksher is not responsible for any font used in your projects.

As the layer content will be exported as real text and devices work with different font settings, it may be a good idea to add some Padding (space in pixels between words) and Offset (space in pixels between lines).

The Select audio file panel allows you to inform which audio will be used to sync with the text. When enabled, the Use page Read Me audio file will attached the Sync feature to an audio previously checked as “Read to Me” type (more on that at Add Audio). If you are planning to sync with another audio file, select it in the Audio list.

The next step is to set the time code time, in milliseconds, for each word, meaning when the audio file “speaks” the word. You must enter the start and end positions. Double-click one of the lines and the following window will appear for data entry:

Important: Your File entries must be written using only A-Z/0-9 characters. Tests in some Eastern languages corrupted the project file.

If word clicking is not enabled, the field File will become empty. This is to avoid automatic entry of Eastern languages that may corrupt the project file (XML is not compatible with them).

Now you can trigger different actions every time a word is highlighted. This may produce nice effects, for example, a fireworks can be triggered when the work “congratulations” is read. In the example above, the words “father” and “nice” will trigger an action called “printa” when they are highlighted.

In order to facilitate this process, you can use Audacity (free software) to set labels and time codes to be imported into Kwik. If you do it, simply click the Import from Audacity button and import your label file. Important: after importing an Audacity file, make sure the table shows all label words and their respective positions, otherwise you may have errors in the final code. Read the Working with Audacity below for more info.

Important: Make sure your label file has the extension .txt in the name (for example: labels.txt will work, labels will not).

Enable word clicking allows users to click words and hear individual audio files for each word (an auto animation happens also when you click the word). If you enable this, besides having the audio file containing the full text content, you must have individual files for each word. For example, if your text is “I love you”, you will need 3 files: “i.mp3”, “love.mp3” and “you.mp3” in the same project folder (Kwik will import them automatically). If you are creating a multilingual project and the text “I love you” is set to appear only in English selection (considering you set English language ID as “en”), you audio files must be named “en_i.mp3”, “en_love.mp3” and “en_you.mp3”. Important: only mp3 file format is accepted with this feature.

In the example above, the words “my”, “father” and “nice” will be highlighted and will play their independent audio files when pressed. The word “is” will not be considered a “word clicking” area because its file was set to blank (meaning it does not have an independent audio to be played when pressed).

If enabled, the This language reads right to left checkbox will prepare the Sync feature to work with non-standard Western languages.

The Text highlight color captures the color to be used when the words highlight. Enter the RGB value or use the button to capture a color from your computer color picker.

Show Play button, when enabled, will show an audio icon at the side of the text. Clicking the button will start the narration/sync. This is a good option to test the project when the correct buttons to start the sync are not created yet.

Important: If you plan to use your own button to start the Sync, make sure its layer is BELOW the Synced (the layer with the text) layer.

Working with Audacity

The steps below usually work for other applications as well:

  1. Open the audio application
  2. Open the audio file with the spoken text to be used in Kwik
  3. Using the mouse, select part of the wave (this is a manual step and may be repetitive until you correctly select the word you want) for the first word
  4. You may manually take note of the start and end position (see bottom of the interface) or (preferable), click Ctrl+B (Cmd+B on Mac). You will see a Label Track created, allowing you to enter a label for the selection. Enter the word just spoken. If you are using the Enable word clicking feature, write the word without ANY punctuation or accent. For example, if your work is trés! write the label as tres.
  5. Repeat the steps until the entire words are captured
  6. When completed, go to File, Export Labels… and save the file into your project folder