The Complete Guide to gifSlap

Written By Donald Hanson • Updated 7/23/2016

Getting Started

Welcome to gifSlap. If you have not already done so, you can purchase a gifSlap software download on the homepage. The first time you run gifSlap you must have an internet connection to verify your license key, which is emailed to you upon purchasing.

gifSlap is a software tool for producing live visuals using gifs. It is used by VJs, artists and performers. Most VJ software focuses on compositing video clips with blending layers, while gifSlap focuses on generating geometric patterns where each point in the shape is a gif. It can be controlled using the onscreen control deck, and every control can also be mapped to a physical MIDI controller.

You will need:


The Control Deck

gifSlap Control Deck v0.7.4

Mode Buttons

  • Modes are main foreground patterns.
  • Only one mode can run at a time.
  • Pink: mode is currently running.
  • Each mode has unique controls which are revealed when you click the mode button.
  • Each mode is explained in depth in the Modes Section.

Addon Buttons

  • Addons are patterns or effects that run on top of modes.
  • Addons can run simultaneously, but running too many will slow down the framerate.
  • Each addon has unique controls which are revealed when you click the addon button.
  • Pink: this addon's controls are visible.
  • Blue: this addon is currently running.
  • Each addon is explained in depth in the Addons Section.

Global Controls

  • Global Controls are always present and effect every mode.
  • Max Image Amount: Total number of gifs allowed on the screen. Keep this number low for better framerates.
  • Single Height: Height of the image.
  • Single Width: Width of the image. Automatically keeps ratio to height until changed. Reset returns to height ratio.
  • Image Scale: Scale multiplier. Resizes from the center.
  • Single Opacity: Percent of foreground image opacity.
  • Single Rotate: Degrees of rotation.
  • Border Radius: Controls rounded corners.
  • Border Image Width: Width of the border. Uses the new previewed gif as the border image.
  • Border Image Slices: Controls how the preview image is repeated inside the border.
  • Note: Border Image Width and Border Image Slices are considered "intensive" controls and are hidden by default. They can be activated in the Settings Panel.

X/Y Pads

  • Click and drag on X/Y pads to use them.
  • Reset returns the control to the middle.
  • Hold Shift to restrict to vertical movement.
  • Hold Control/Ctrl to restrict to horizontal movement.


  • Click and drag on the sliders to use them.
  • Reset returns the slider to its default value.
  • The waveform button turns the automation on/off.


  • Click the waveform button to turn the automation on/off.
  • Right-click the waveform to change the waveform between Sine, Saw, Triangle and Random.
  • Click and drag the pink bar to change the speed of the automation.
  • Click and drag the green slider to change the maximum value of the automation.
  • The bright pink indicator shows the current position of the automation.

Preview Screen

  • Click the preview screen to activate it. When prompted, choose the main gifSlap window.

Next Gif Selector

  • Click the gif to toggle between animated or still. The framerate increases when the preview is still.
  • Gifs are randomly ordered by default. You can change the order to alphabetical in the Settings Panel.
  • Send to Foreground is always visible. Send to Background, Send to Midground, Send to Corner Box, and Send to Big Shrinker become visible when those addons are running.


  • Left: current framerate.
  • Right: target framerate.
  • The target framerate is editable.
  • The framerate turns red if it goes below the target.

Window Buttons

  • Pause: (obviously) stops and starts the main window animation.
  • Refresh: restarts gifSlap. Sometimes if things get crazy this is necessary.
  • Zoom Out/In: Changes the overall zoom of the main window.


  • When autopilot is on gifSlap will perform on its own.
  • Currently autopilot only supports Chain mode.
  • Autopilot does not change the visible gif. You must select gifs on your own.
  • You can also change controls on your own while autopilot is running.

MIDI Tools

  • MIDI Learn: Activates MIDI mapping mode. Press again or Esc to exit.
  • Edit MIDI Map: Shows current MIDI map, delete mapping tool, available maps, and import/export tools.

MIDI Setup

Note: The MIDI controller must be plugged in to USB before gifSlap starts.

  1. Plug in your MIDI controller.
  2. Restart gifSlap if necessary.
  3. To test: press MIDI Learn and attempt to map a control.

MIDI Learn Mode

  • Activate MIDI Learn mode by pressing MIDI Learn on the control deck.
  • Click a yellow control to assign a MIDI input. When prompted touch the physical button on your controller to assign that input.
  • A light yellow control already has been mapped to an input. You can check which input it is assigned to in the MIDI Edit tool.
  • Multiple controls can be mapped to one MIDI input, if you wish to do so.
  • To exit, press Esc or press MIDI Learn again.

MIDI Edit Tool

  • Activate the MIDI Edit Tool by pressing Edit MIDI Map on the control deck.
  • Each row is a mapped control
  • Delete a mapped control by pressing (x) on the right side of the row.
  • Switch the active MIDI map by changing the dropdown menu.
  • Import allows you to locate a MIDI Map file which will appear in the dropdown.
  • Export allows you to save your MIDI Map to an external location.
  • New creates a new blank MIDI Map.
  • Delete will delete the current active MIDI Map.


Test if your gamepad is compatible by using the HTML Gamepad API Test page.

USB Gamepad controls are available in the following modes:

How To Enable Gamepad

  1. Plug in the gamepad.
  2. Open the Settings Panel and check the box for Use Gamepad.
  3. Press buttons and move the joystick for a few seconds to get gifSlap to recognize it.
  4. When the gamepad is not in use, uncheck Use Gamepad to improve performance.

Settings Panel

  • Access the settings panel by pressing the gear icon on the left side.
  • Change Gif Folder: choose a new folder of gifs to work with.
  • Randomize Gifs: If unchecked the order is alphabetical.
  • Use Gamepad: Toggles between using gamepad or not.
  • Show Processor Intensive Controls: Some controls take more proccessor power and are hidden by default. When checked these controls are not hidden.


  • Toggle Webcam: (Button) Turns the webcam on or off. Turn it off when you are not using it because it consumes CPU resources.
  • Next Webcam Input: (Button) If you have multiple webcams plugged in this cycles through them.
  • Webcam to Foreground: (Button) Makes the forground gif a webcam feed.
  • Webcam to BG: (Button) Makes the background gif a webcam feed.
  • Webcam to Corner Box: (Button) Makes the Corner Box gif a webcam feed.
  • Note: If you have an external USB webcam you should definitely try pointing it at the gifSlap window to create video feedback!


Chain Mode

Available Controls:
  • Chain Direction: (X/Y Pad) Controls chain direction.
  • Chain Speed: (Slider) Speed of chain movement.
  • Reverse Doubler: (Button) Creates a mirror image of the chain. (Pictured)
  • Remove By Tail: (Button) Instead of removing images randomly, this removes the last gif in the tail of the chain. (Pictured)

Corners Mode

Available Controls:
  • Equalize Quadrants: (Button) Sets each quadrant to fit equally in the frame.
  • Rotate Quadrants: (Slider) Rotates entire quadrants.

Hallway Mode

Available Controls:
  • Hallway Perspecitve: (X/Y Pad) Controls the position of the vanishing point.
  • Hallway Sides Rotation: (X/Y Pad) Rotates the top, bottom, left and right sides.
  • Hallway Stretch: (Slider) Controls the amount of stretching on hallway sides.

Mirror Mode

Available Controls:
  • Mirror Rotation: (Slider) Rotates the entire mirror mode screen.
  • Mirror Image Spacing: (Slider) Adds space between the images. When Vertical Stream is on, this is space between the two streams. When Vertical Stream is off, this adds space between each image.
  • Toggle Mirror Vertical Stream: (Button) When off, the images only stack vertically. When on, the images may stack next to each other if the image width is low enough.

Circle Mode

Available Controls:
  • Circle Images Spin Speed: (Slider) Controls the speed at wich each image spins.
  • Circle Container Spin Speed: (Slider) Controls the speed at wich the entire circle spins.
  • Toggle Circle Size Lock: (Button) Locks the height and width of circle images. Try changing height and width rapidly, then locking the size.

Center Mode

Available Controls:
  • Center Arc: (X/Y Pad) Creates an arc in the stack of gifs.
  • Toggle Threaded Rotation: (Button) Makes each gif in the stack rotate in alternating opposite directions.



Available Controls:
  • Wind Direction: (X/Y Pad) Controls the direction to blow the images.
  • Wind Intensity: (Slider) Intensity of the wind. Higher numbers mean the images will spread out more.


Available Controls:
  • Toggle BG: (Button) Changes Background Opacity to 0 or 100.
  • Background Opacity: (Slider) Percent of background opacity.
  • Background Zoom: (Slider) Zooms the background in or out.
  • Background Scroll: (X/Y Pad) Controls the direction of background scrolling. Reset stops the scrolling.


Available Controls:
  • Toggle MG: (Button) Changes Midground Opacity to 0 or 100.
  • Midground Opacity: (Slider) Percent of midground opacity.
  • Midground Zoom: (Slider) Zooms the midground in or out.
  • Midground Scroll: (X/Y Pad) Controls the direction of midround scrolling. Reset stops the scrolling.
  • Midground Rotation: (Slider) Rotates the entire midground.
  • Midground Scale: (Slider) Changes the size of the entire midground.
  • Midground Position: (X/Y Pad) Repositions the entire midground on the screen.

Big Shrinker

Available Controls:
  • Shrink It!: (Button) Puts a big shrinking gif on the screen.
  • Big Shrinker Rotation: (Slider) Rotates the Big Shrinker container.

Rainbow Bars

Available Controls:
  • Toggle RB: (Button) Turns Rainbow Bars on or off by turning Rainbow Bars Opacity to 100 or 0.
  • Rainbow Bars Opacity: (Slider) Percent of Rainbow Bars opacity.
  • Rainbow Bar Width: (Slider) How wide each bar is. This controls how many bars can fit on the screen at once, and how fast they move.
  • Rainbow Bars Speed: (Slider) Space between bars. Affects how fast the bars move.
  • Rainbow Bar Rotation: (Slider) Degrees of rotation of each bar.

Corner Box

Available Controls:
  • Toggle Corner Box: (Button) Turns Corner Box on or off by turning Corner Box Opacity to 100 or 0.
  • Corner Box Opacity: (Slider) Percent of Corner Box opacity.
  • Corner Box Size: (Slider) Percent of the screen (horizontally) that Corner Box occupies.
  • Corner Box Position: (X/Y Pad) Position of Corner Box on the screen.

Corner Box

Available Controls:
  • Toggle Border Boxes: (Button) Turns Border Boxes on or off.

Collecting Gifs

Some Tools:

Seach Terms:

Choosing a MIDI Controller

I would recommend something with lots of buttons and knobs/sliders. I use a Livid CNTRL:R, and have had a good experience with LIVID controllers. Korg's budget controllers also work very well.

Amazon links to controllers I would recommend.