jittodesign blog

デザインやグラフィックソフト、カメラなどに関するブログです。

画像シーケンスとは連番のファイル名で用意された画像ファイルを読み込み、画面をスワイプ操作することでファイルを切り替えながら表示する機能です。

素材画像の準備

  • 画像のサイズはデバイス上でのサイズと正確に合わせて準備する必要があります。例えば、デバイス上で1600×1200pxで使用するのであれば、1600×1200px(72ppi)で画像を準備します。
  • ファイル形式はJPEG形式またはPNG形式とします

連続的に被写体を回転させてる画像を準備してもいいですし、カメラが回転しながら撮影している画像でもいいですし、ロードムービー風にランダムに撮影した画像を使っても面白そうです。つまり画面をスワイプした際に表示される画像が切り替わるだけですから、仕組みとしては非常にシンプルです。ただし、アイデア次第では面白いコンテンツが作れると思います。
パラパラ漫画風の画像を使ったり、動画から静止画を抜き出したり、定点撮影で時間軸を表現しても面白いと思います。

141105-0001

 

フレームの作成

配置すると準備した画像サイズのフレームが作成されるので、まずは適当な大きさのグラフィックフレームを長方形フレームツール準備します。

141105-0002

 

画像シーケンスの配置

フレームが選択された状態でFolio Overlaysパネルから「画像シーケンス」を選びます。

141105-0003

 

画像シーケンスの「画像を読み込み」アイコンをクリックして、連番で用意したファイルが入っているフォルダを選択して読み込みます。

141105-0004

141105-0006

 

画像シーケンスが配置されるので、位置を調整します。

141105-0008

 

画像シーケンスの設定

画像シーケンスが配置できたら、設定をおこないます。

【初めに最初の画像を表示】
最初の画像がポスターとして使用されます。画像シーケンスが透明な PNG ファイルで構成されている場合は、このオプションの選択を解除してください。「逆順に再生」が選択されている場合は、最後の画像がポスターとして使用されます。
【自動再生】
画像シーケンスが出現するページまたは状態にユーザーが移動すると画像シーケンスの再生が開始されます。
【タップして再生 / 一時停止】
ユーザーがタップ操作で画像シーケンスの再生を開始および一時停止できるようになります。ダブルタップすると最初に戻ってオブジェクトの再生が開始されます。
【遅延】
「自動再生」が選択されている場合に、ページを読み込んでから画像シーケンスの再生を開始するまでの遅延時間を指定できます。
【速度】
オブジェクトの進行速度を 1 秒あたりのフレーム数で指定します。
【再生】
「自動再生」または「タップして再生 / 一時停止」が選択されている場合、画像シーケンスの再生回数を指定できます。
【ループ】
「ページの読み込み時に再生」または「タップして再生 / 一時停止」が選択されている場合、「ループ」を選択すると、画像シーケンスが連続再生されます。
【最後の画像で停止】
「自動再生」または「タップして再生 / 一時停止」が選択されている場合、「最後の画像で停止」を選択すると、画像シーケンスの最初ではなく最後の画像で停止します。
【スワイプ操作で画像を変更】
ユーザーがスワイプ操作で画像間を移動できるようになります。
【最初と最後の画像で停止】
正方向の再生時には最後の画像に達すると停止し、逆方向の再生時には最初の画像に達すると停止します。
【逆順に再生】
画像シーケンスの再生は画像の順序を反転して実行されます。

 

役立つアプリたち

コマ撮りが撮影できるiOSアプリ
iOS8の標準カメラに搭載されたTime-Lapse機能 https://www.youtube.com/watch?v=Vt0bHfdYPqs#t=131
iMotion HD http://www.fingerlab.net/website/Fingerlab/iMotion_HD.html
StopMotion Recorder http://bitween.co.kr/stopmotion/
コマ撮りが撮影できるAndroidアプリ
Stop Motion https://play.google.com/store/apps/details?id=com.sheado.stopmotion&feature=search_result

作例

<ストップモーション・ムービー>

https://www.youtube.com/watch?v=ieN2vhslTTU#t=12
https://www.youtube.com/watch?v=y4-IPj40ut0
https://www.youtube.com/watch?v=ju8nHwAipEY

Pocket
LINEで送る