Удобство такой анимации - получение красивой рамочки и анимирование выбранных участков коллажа.

Смысл использовать анимированные бесшовные фоны размером 200...250рх и коллаж в формате png - очень значительное уменьшение веса "конструкции" коллаж- рамочка в Мбт.

(Можно вставить в рамочку и футаж, предварительно добавив красивую анимацию на локальных участках в местах полупрозрачности коллажа, выигрыш такого решения не вес "картинки", а красивая анимированная рамочка.)

Посмотрим, как это можно сделать на примере.

Делаем довольно простой коллаж (рис.1).

Рис.1

Здесь (рис.1) помещена фигура девушки на фоне улицы Праги, сделана ее тень. На мостовую "набросаны" цветы, вырезанные с фотографии поля тюльпанов.

Основная задача сделать полупрозрачные участки. Первый вид участков делаю путем выделения с панели инструментов "Select" - "Color Range..." (рис.2).

Рисунок 2

Выключаем глазки верхних слоев (верхняя стрелка на рисунке 3). Становимся на слой с городом (нижняя стрелка, рис.3). Пипеткой выбираем коричневый цвет на заборе цветочного павильона, "пипеткой с плюсом" добавляем цвет крыши павильона, на линеечке (останавливаемся на значении 19) выбираем интенсивность выделения (белый цвет на дополнительной панельке), чтобы выделились, кроме крыши и забора павильона, отдельные фрагменты стен домов.

Рисунок 3

Нажимаем "ОК". Получаем выделение (рис.4).

Рисунок 4.
Нажимаем на клавиатуре Ctrl+J. Выделение оформляется в новом слое (стрелка на рисунке 5). Выделение снялось, возвращаем его, нажав кнопку Ctrl и одновременно щелкнув по иконке полученного нового слоя с выделенными фрагментами. Выделение вновь появится. Переходим на слой с городом (нижний) и нажимаем кнопку Delete. В слое с городом появляются пустые места.

Рисунок 5

Выделение не снимаем. Делаем новый пустой слой (стрелка 1, рис.6) над слоем с городом и заливаем выделение (стрелка 2, рис.6) пиксельным узором (стрелка 3, рис.6). Закрываем все глазки, кроме слоя с пиксельным узором. (Пиксельные узоры можно скачать по ссылке в конце поста, это текстуры, которые нужно вставить в фотошоп, если кто этого не делал, на вопрос отвечу отдельно.)

Слой с коричневыми выделениями удаляем, он больше не нужен.


  Рисунок 6

Также, как в начале урока, убираем белый цвет из пиксельного узора с помощью "Select" и "Color Range (рис.7). Пиксельный слой получается "дырявый".

Рисунок 7

Наконец, очень просто делаем прозрачные участки на лежащих на мостовой цветах.  Все слои объединяем в один общий слой. Выбираем ластик размером от 35 до 60, устанавливаем прозрачность его около 40% и слегка протираем цветы на мостовой. Сохраняем коллаж в формате png (рис.8).

Рисунок 8

Делаем рамочку в черновике

<center>

            <table cellpadding="0" cellspacing="0" style="background-image: url('http:'); background-color: #4C5232; border-radius: 20px; box-shadow: 0px 0px 10px 0px #000;">

                        <tbody>

                                   <tr>

                                               <td style="padding: 2px;">

                                                           <table cellpadding="0" cellspacing="0" style="background-image: url('ссылка на анимированный бесшовный фон'); border-radius: 20px; box-shadow:  inset 0px 0px 20px 10px #484D2F;">

                                                                       <tbody>

                                                                                  <tr>

                                                                                              <td style="padding: 35px;">

                                                                                                          <center>

                                                                                                                      <table cellpadding="0" cellspacing="0" style="background-image: url('http:'); background-color: # 7290b7; border-radius: 0px; box-shadow: 0px 0px 10px #000;" width="740">

                                                                                                                                 <tbody>

                                                                                                                                             <tr>

                                                                                                                                                         <td>

                                                                                                                                                                     <img height="555" src="Ссылка на коллаж" width="740" /></td>

                                                                                                                                             </tr>

                                                                                                                                 </tbody>

                                                                                                                      </table>

                                                                                                          </center>

                                                                                              </td>

                                                                                  </tr>

                                                                       </tbody>

                                                           </table>

                                               </td>

                                   </tr>

                        </tbody>

            </table>

</center>

Показала, где вставляется ссылка на бесшовный анимированный фон и ссылка на коллаж. Желтым цветом отмечено, что размер коллажа и ширины рамки совпадают (740рх).

Вот еще один вариант коллажа в анимированного с помощью бесшовных фонов (приложены его коды):

Материалы урока можно скачать по ссылке https://yadi.sk/d/le2wMT9A3JoK9z или ввести ссылку https://yadi.sk/d/le2wMT9A3JoK9z в строку браузера

Серия сообщений "Мои уроки":

Мои уроки

Часть 1 - Урок "Градиентная маска в AdobeFlash без кодов"
Часть 2 - Дополнение к уроку "Градиентная маска в AdobeFlash без кодов"
...
Часть 7 - Размышления на тему снега. Футажи, урок
Часть 8 - Урок по "заливке" текста футажем (по просьбе подруги mimozochka)
Часть 9 - Придумала урок анимации коллажа бесшовным анимированным фоном
Часть 10 - Урок использования флеш материала "След за курсором"