Monday, January 6, 2014

How to upload a Processing animation to Vine

Vines may be the most efficient way ever invented to convey a technical idea, but getting animations you make in Processing up on Vine can be vexing. The procedure below has worked for me using a MacBook (OS X 7.0.4) and an iPhone (iOS 7.0.4.) In addition to Processing and Vine, the freeware and apps you will need are GraphicConverter for Mac, Dropbox for Mac and iPhone, and Vinyet for iPhone. To add sound you will need QuickTime 7 Pro.




In Processing, generate sequential 480 x 480 frame images numbering less than 144 (i.e., < 6 seconds @ 24 fps) using a zero-padded file numbering such as frame000.tif through frame139.tif.

GraphicConverter: File: Convert & Modify
Function : Convert
Destination format: MooV - QuickTime Movie
Options: Normal compression, 480 x 480, 24 fps
Select the range of .tif images to be used, and the destination folder for the .mov file.
Hit "Go."

Drag the resulting .mov file to your Dropbox folder.

Find the .mov file in the Dropbox app on your iPhone.
Click the up-arrow icon located on the bottom left of the screen.
Click "Save Video"—this saves the .mov file to your camera roll.

Open the Vinyet app.
Click on the photos icon at the bottom of the screen.
Click on the desired .mov file.
After your video displays, click on "Save" in the upper right.

Vinyet now wants to append more video, but the green bar at the top of the screen should show that you are just shy of Vine's six second limit: so click on the checkmark in the upper right.
Click on the curly V in the bottom right.
Add your Vine caption (noting the character count) and click "Dismiss" when you are done.
Select your Vine channel.
Click "Share Video."

After Vinyet declares your "successful"upload, you may want to verify on Vine that it really did upload successfully.

Note that you must have an email-associated Vine account for Vinyet to upload successfully to Vine.




To embed your darling new Vine post in a blog or web page:

Find your vine on the Vine app.
Click on the three gray dots in the lower right.
"Share this post."
"Embed."
Fill in the address for the link to be emailed to, and click "Send."
Find the email in your inbox; click on the link.
If you want just the bare, looping video to display, choose "Simple"; if you want the surrounding info that you normally see on Vine, choose "Postcard."
Choose pixel dimensions. Note that 600px is more resolution that you uploaded. 320px transfers fast.
If there is an audio channel in your video, choose whether you want it to start playing automatically, or only at the viewer's request.
Copy the link displayed and paste it into the html of your blog post.
Surround the link with <center> …</center> if you want your vine to display centered in the column of text.




If you want to add a soundtrack to your Processing-generated vine (without using iMovie,) this can be done with Quicktime 7 Pro, which is an older version of the QT player that comes with the modern OSX. Quicktime 7 can still be downloaded directly from Apple, and, from my experience, it still accepts Pro registration numbers that may have been purchased many years back.

Create an audio track timed to exactly match the length your .mov file.
Export it as AIF 48kHZ 16-bit.
Open both the .mov and .aif files using QuickTime 7 Pro.
Select the aif sound file.
Edit > Select All.
Edit > Copy.
Now select the .mov video file. Make sure the playhead is at the start of the video file.
Edit > Add to Movie.
Select the video file.
Window > Show Movie Properties.
You should see your new soundtrack in the list of properties.
File > "Save as." Save it as a Self-Contained file. You must use "Save as," because "Save" fails to generate a new .mov containing the soundtrack.

QuickTime 7 Pro can also be used in place of GraphicConverter in the .mov making procedure above by using  File > Open Image Sequence, and then clicking on the first frame in the numbered sequence of frames; however, the exported .mov will be about 100 MB, which is much larger than necessary for 6 seconds of streamed video. Nonetheless, "Open Image Sequence" is a very handy tool for monitoring a work in progress. For example, render every 12th frame of your animation and then use "Open Image Sequence" at 2 frames per second with View > Loop checkmarked to see a quick rough draft of your vine.

No comments:

Post a Comment