Facebook Lite Exemplifies Minimum Viable Experience

Facebook Lite

In January 2015 Facebook launched a new Android app called Facebook Lite. It is a streamlined version of the social network optimized for low-end Android devices and slow and intermittent internet connections, both common in the developing world. To underline the target market the app was first launched in select countries in Asia and Africa (Bangladesh, Nepal, Nigeria, South Africa, Sudan, Sri Lanka, Vietnam and Zimbabwe)



Implementing Minimum Viable Experience (MVE)

It is a great example of making the Minimum Viable Experience accessible in a specific context, which in this case is very device specific. Comparing the features of Facebook Lite at launch with the main-stream Facebook android app gives us insight into what featured are deemed core to the experience and which ones are optional enhancements.



Defining the minimum viable experience

Based on user-research, personas and business requirements, the experience a product should facilitate can be defined. When it is time for implementation, it is important to separately define the minimum viable experience and the features it requires as well as the maximum viable experience, the ultimate vision of a perfect world. These extremes will help negotiate optimization efforts for each use-case, context and the resulting constraints and opportunities.

In Facebook’s case the context was mobile usage on early-generation Android phones with slow and spotty connections. As we can see from the feature comparison the core experience was defined around the Facebook Wall and user interaction. Bells and whistles like stickers were omitted as non-essential as were most apps. Another interesting insight is the commission of some event-related features, like inviting a friend. 

When designing for the multi-device reality, the mobile-first approach has some helpful tools to offer. it forces us into a linear prioritization of features. This is incredibly helpful not only for product managers as they create their backlogs and roadmaps, but also for defining the MVE and the resulting minimum viable product (MVP).

Gather input around those features from stakeholders and users and draw the line after considering the impact and necessity of each included and omitted feature.

Minimum and Maximum

The MVE should be made accessible on all devices and channels, but all non-essential features can be added along the prioritized feature list and under consideration of use-case and context of the target environment. The nature of your product as well the resources available to you will determine how many of your users in each use-case will be presented with a minimum viable experience (Facebook’s Lite version) or a more optimized version with additional features that improve the experience. 








Create a Virtual Webcam for your Syphon Client with CamTwist


CamTwist is a FREE broadcast quality TV studio app for Mac. It allows for various effects to be applied to a video source. It then acts as a virtual webcam for other Mac apps to use (e.g. Skype, LiveStream, ProPresenter)


Download CamTwist 3.0

The 3.0 Beta comes with native Syphon support, when using the 2.5 version, you will need CamTwist Syphon ().

Download CamTwist 3.0

Install CamTwist 3.0

Install Camtwist

Install CamTwist 3.0


Start a video stream from you favorite application to Syphon, or use your Canon DSLR as a live input using one of these apps (Camera Live or Canon2Syphon.


Open CamTwist

Choose Syphon as your input video source and under Settings select your Syphon Client (I’m using VDMX5 with Syphon Output in this example).

Open CamTwist

Open the app you want to use the Syphon feed as a Webcam

I will use Skype in this example. Under Settings I will find a list of my webcam sources. CamTwist is one of them.

Open the app you want to use the Syphon feed as a Webcam

Happy Streaming!


Create a simple audio-reactive visual with Quartz Composer and VDMX

This Tutorial will give you a glimpse into the audio-reactive possibilities of Quartz Composer patches in VDMX.

Create a simple kaleidoscope effect in Quartz Composer

If you don’t have Quartz Composer, this tutorial can help you get set up.

  1. Open Quartz Composer and create a Basic Composition
  2. Drag an image or video file into the composition
     Drag in an image or video fileInitial output view
  3. Drag in a Billboard patch from the Patch Library.
    In the Patch Inspector adjust the Width value to 2 (making it full width in the Quartz Composer coordinate system)
    Change the Pixel Aligned value to 1 to ensure pixel aligned output.
    Add a billboard patch and adjust the width and pixel aligned values
  4. Delete the Layer patch connected to the image input and drag in a Kaleidoscope patch from the Patch Library.
    Connect the image output to the Kaleidoscope image input and the Kaleidoscope image output to the Billboard image input.
    In the Viewer you will see the effect applied.
    Added the Kaleidoscope effect

Adjust the patch to take video input from VDMX

Quartz Composer allows you to publish inputs so they can receive values or data from other software. In this case we want to control the kaleidoscope count and angle and apply the effect to a video clip from VDMX. In order to do that we will insert input splitters for each of the effect values and will publish their inputs.

  1. Right-click on the Kaleidoscope patch and select “Insert Input Splitter > Angle”
     insert an input splitter for the angle value
  2. Select the input splitter “Angle” and hit ⌘+I to open the patch inspector. 
    Under “Settings” select Type: “Number” and set the minimal and maximal values to -90 and 90 respectively.
    set up the values in the patch inspector
  3. Right-click on the input splitter input and select “Publish Inputs > Input”
    Rename the input to “Angle”
     publish the input
    Published inputs appear green.
    published inputs appear green
  4. Repeat the same procedure for the “count” and “image” values
  5. Set the “count” settings to “Number” with minimal and maximal values of 6 and 40
    count settings
  6. Set the “image” settings to “Image”
  7. Delete the original image input we dragged in.
    published image input
  8. Save your composition as a patch “Kaleidoscope patch.qtz”.

Screen recording of the previous steps 

KaleidoscopeTutorial 01 QuartzComposer from Tobias Treppmann on Vimeo.

Add the patch to VDMX’s Effects Library

  1. In Finder locate the file you just saved and copy it to the clipboard.
  2. Hit ⇧⌘G to open the “Go To Folder” dialog and navigate to “~/Library/Application Support/VDMX/qcFX/“
  3. Paste the file into the qcFX folder.

Load the patch into VDMX

  1. Start VDMX and play a video clip. 
  2. In the Workspace Inspector under “Layers” select “Layer 1” and under “Layer 1 Composition” set the Sizing Mode to “Fill”.
  3. Under Layer FX select “Load Asset > Misc. QC > Kaleidoscope patch.qtz”.
     Select the patch as a layer effect
  4. See the effect applied and notice the Count and Angle controls.
     Our quartz patch applied 

Screen Recording of the previous steps

KaleidoscopeTutorial 03 VDMX setup from Tobias Treppmann on Vimeo.

Let the music play

  1. create a second layer in VDMX and call it “Audio”
  2. Add a Media Bin ⌘B, assign it to the “Audio” layer and play the audio file
    Audio Layer
  3. In the Workspace Inspector’s  “Plugins” tab click the “+” button and select “Audio Analysis”
    Add Audio Analysis Plugin
  4. Click the Recycling Icon to activate the audio input.
    The Audio Analysis Plugin

Hook up the Audio Analysis to our effects

  1. Set the Filter 2 in the Audio Analysis plugin to a spot where it get’s some input, but not the main action or rhythm. 
  2. Right-click on the Angle control under Layer 1 FX and select “Use Data Source > Audio Analysis 1 > Filter 2″
    Use Data Sources
  3. Then adjust the input range to something that makes for a gentle effect.
    Adjusted Range
  4. Let’s support this effect by creating a continuous visual rhythm by moving Filter 3 in the Audio Analysis plugin to a spot where it captures the beat of the song. 
  5. Then assign “Audio Analysis 1 > Filter 3” as a Data Source for the Width and Height of Layer 1.
  6. Limit both ranges to 1.0 – 1.50 or something that feels good. 
    Visual Rhythm

Screen Recording (with Audio) of the previous steps and the final result

KaleidoscopeTutorial 04 VDMX AudioAnalysis from Tobias Treppmann on Vimeo.


Sourcing Free High-Quality Stock Imagery

Finding good stock photos is a little bit like Black Friday shopping, there are too many options and most of them are bad. It’s an art to find the gems that are of great quality at a reasonable price. Dustin Semos was kind enough to compile Stock photos that don’t suck — a list of places to find the best free stock photos.

Below I’m building on his list and present each site with some descriptions and examples.

Little Visuals

Little Visuals publishes 7 high-res images every week and offers an email subscription so you don’t miss out on any new photos.




Unsplash publishes 10 photos every 10 days.



Death to the Stockphoto

This is strictly an email subscription service without an accessible collection at the time of this writing. After signing up you will receive an image pack every month. 



New Old Stock

New Old Stock is a great source for vintage photos free of copyright restrictions.



Superfamous (attribution required)

Photos in the Superfamous library are published under the Creative Commons Attribution license.


(Photos by Folkert Gorter)



PicJumbo organizes its library into categories which makes searching and browsing very easy. PicJumbo also offers a paid subscription with access to additional photos. 



The Pattern Library

A growing collection of beautiful patterns.

Voila Capture2014 05 06 06 31 38 PM



A large collection of photos with new additions on a weekly basis.




GetRefe features photos taken with mobile phones. 



IM Free (attribution required)

IM Free features a photo catalog that is categorized and searchable, but also icons and website templates.


(Photos: left: Base by Instant Vantage, top-right: Father and Child by gaggles, bottom-right: Macbook Computer by VFS Digital Design)


Bonus: Public Domain Archive

The daily growing archive of public domain photos broadly categorized into modern and vintage with search functionality.



Bonus: The Noun Project (attribution might be required)

A significant collection of vector icons many available for free, some require attribution or a small fee.

 Voila Capture2014 05 06 06 58 56 PM



Using Transparent Animated GIFs in VDMX

VDMX will play animated GIFs, but won’t render transparency in a GIF. If you want to use transparent GIFs in your setup, you need to convert them into a video file with an alpha channel.

For this tutorial you will need:

  • VDMX
  • Apple Motion

Find a GIF with transparency


Maybe a dog from giphy.com

Giphy Dog

Split the GIF into its frames

You can do that exporting each frame manually in Photoshop, or labeling each layer with a file extension and exporting it using a tool like Slicy. Or you can go all Internet and use EZGIF’s Online Splitter Tool.

EZGIF Splitter

Once uploaded, hit “Split It”

Voila Capture2014 05 06 02 47 57 PM

Then “Download frames as ZIP”

Voila Capture2014 05 06 02 48 40 PM

Import the frames into Apple Motion

Extract the files from the ZIP archive, select them all and drag them onto the canvas in Motion.

Voila Capture2014 05 06 03 15 56 PM


Motion has imported them as a grouped object that can be moved and resized easily.

Resize it to your needs

Voila Capture2014 05 06 03 18 39 PM

Adjust the Play Range

Make sure to adjust the play range to the length of the GIF.

Voila Capture2014 05 06 03 41 23 PM

Voila Capture2014 05 06 03 41 32 PM

Export to ProRes 4444

Export as a movie (CMD+E) and select “Apple ProRes 4444” as the output format.

Selet “Use play range” under “Duration”

Voila Capture2014 05 06 03 20 58 PM

Make sure that “Color: Color + Alpha” is selected under the “Render” tab.

Voila Capture2014 05 06 03 21 05 PM

Continue the process and export the video.

Voila Capture2014 05 06 03 43 28 PM

Convert to Hap Alpha

Open VVBatchExporter.


  1. Import the video.
  2. If you don’t have a Hap Alpha preset, yet, select “QuickTIme Movie” as the output format and click “Settings”. 
  3. Click “Settings” again
  4. Choose “Hap Alpha” as the Compression Type and click ok on all dialogs.

Voila Capture2014 05 06 03 49 49 PM

To create the preset click “New from settings” and name it “Hap Alpha”

Select the “Hap Alpha” setting under output format.

Configure any other aspects to your needs and click “Export!”

Use Converted Video in VDMX

transparent animated gif in vdmx from Tobias Treppmann on Vimeo.

Happy GIFing!


Sourcing Clips for VJing

Paid resources

If you do commercial work and/or are looking for a specific clips that you can’t find on the free market, the following resources might be of help.

VideoHiveVoila Capture2014 05 01 08 32 37 PM

Envato’s marketplace is a great location for affordable videoclips, after effects templates and stock footage.


Voila Capture2014 05 01 08 34 24 PM

A great resource for double-wide or triple-wide projection setups. Focussed on churches, but also non-church performers can find some good footage. At the time of writing clips cost $12USD and for that price come in HD, double-wide and triple-wide resolutions.

Pond5Voila Capture2014 05 01 08 41 17 PM

Pond5 offers stock-video usually under $100USD.


Voila Capture2014 05 01 08 44 16 PM

VideoBlocks offers access to their entire library for a monthly fee ($79USD a the time of writing).


Voila Capture2014 05 01 08 37 14 PM

iStock offers high quality footage at high quality prices. 


Free resources


Creative Commons Licensing

Creative Commons (CC) licenses have become a popular copyright licenses that gives the author protection of their work while still allowing others to use it within certain limits. This is good news for artists trying to sample, remix or incorporate media into their own work.

Creative Commons currently offer six licenses:

Four out of the 6 allow remixing and with that are perfect for VJs. Two don’t, so make sure you steer clear of clips using those.


Remix-friendly licenses

88x31 Attribution (CC BY)

This license allows you to distribute, remix, tweak, and build upon the original, even commercially, as long as you credit the author for the original creation.

88x31 1 Attribution-ShareAlike (CC BY-SA)

This license is identical with the one above, but requires you to share your work under the same license.

88x31 2 Attribution-NonCommercial (CC BY-NC)

This is the attribution license limited to non-commercial work.

88x31 3 Attribution-NonCommercial-ShareAlike (CC BY-NC-SA)

This requires attribution, only non-commercial use and requires you to share your work under the same license.

For non-commercial VJ sets all of these are an option and will open up a larger pool of media when searching the sources below.

For commercial use the first two still provide great options. 

I usually start searching for (CC BY) and then expand from there. 


Non-Remix-Friendly licenses

There are two licenses that do not permit remixing (No derivative works). In most cases these won’t work for a VJ setup and I recommend steering clear of them.

88x31 4 Attrribution-NoDerivs (CC BY-ND)

88x31 5 Attribution-NonCommercial-NoDerivs (CC BY-NC-ND)


Free Video Sources


Vimeo let’s you filter by any or all Creative Commons licenses as well as for downloadability.



YouTube gives you fewer controls, but does offer an extraordinarily large collection of videos. To download a tool like KeepVid will be needed.

Wikimedia Commons:VideosVoila Capture2014 05 01 03 14 55 PM

Wikimedia has a good collection of videos from the Wikipedia universe that is full of interesting short clips and video footage.  


Voila Capture2014 05 01 08 01 57 PM

Archive.org is a large library of media in the public domain or otherwise free to use. It is great for vintage finds. Dario Salvi recommends the Prelinger collection and the Ephemeral library.


Voila Capture2014 05 01 08 09 06 PM

Beeple aka Mike Winkelmann is a generous 3d video artist and a VJs best friend. His always growing collection of mesmerizing 3d video loops will have something for you. 

A/V Geeks

Voila Capture2014 05 01 08 18 12 PM

A/V Geeks is another great place for vintage footage. 


Voila Capture2014 05 01 08 19 17 PM

Videopong is VJ specific and offers a collection of VJ loops. 


Voila Capture2014 05 01 08 23 24 PM

This video loop store has a special giving away 10 high quality loops a day. 


For a few more free resources, check out Dario Salvi’s list of free resources.


Using an iPad screen as live video input in VDMX

When using VDMX I’m always looking for new types of video input and live interaction. I love the idea of direct manipulation on the iPad and was looking for a way to broadcast that through VDMX. Follow the simple steps below to use your iPad in your own setup.

You will need:

  • VDMX5
    My real-time video performance or VJ software of choice.
  • AirServer
    AirServer is the most advanced AirPlay receiver. It allows you to receive AirPlay feeds, similar to an Apple TV, so you can stream content or Mirror your display from your iOS devices or Macs running Mountain Lion or Mavericks.
  • Syphon
    Syphon is an open source Mac OS X technology that allows applications to share frames – full frame rate video or stills – with one another in realtime.

Let’s get started

  1. Start VDMX and create a new project [⌘+N]VDMX-iPad
  2. Launch AirServer
  3. On your iPad, go to your AirPlay settings and select your AirServer server, usually named after your Macbook. Then select Mirroring. VDMX-iPad2
  4. Your iPad screen will appear in a window on your desktop. Make sure not to close this window, otherwise this won’t work.
  5. Start Syphon’s Simple Server and Simple Client.
  6. In the Simple Client select your iPad in the sources drop down.VDMX-iPad3
  7. In VDMX right-click in your media bin and select “Add Clips From Built-In Sources > Syphon > AirServer-YOUR IPAD NAME”VDMX-iPad4
  8. Make sure the clip is selected and highlighted in red.VDMX-iPad5
  9. Start using your iPad as a live input.

See it in action:

Using an iPad screen as live input in VDMX from Tobias Treppmann on Vimeo.