Skip to content

Help

Jump to bottom
Nicke Manarin edited this page Oct 4, 2017 · 102 revisions

User guide of ScreenToGif 🎬

#This wiki is currently under construction. ⚠️

This free tool was (and still is) mainly projected to work as a quick and small screen recorder. If you plan to record hours of fullscreen content, I recommend switching to more advanced software.

Recording 📹

Startup

ScreenToGif allows you to record part of your screen with the Screen Recorder, also there's the Webcam Recorder and the Board Recorder.

Screen Recorder

Screen recorder window

The screen recorder is composed of a hollow window with the main controls on the bottom. From the left to the right:

  • Snap to Window: Click, drag and drop on top of a window to automatically resize and move ScreenToGif to fit.
  • Options: Opens the Options window.
  • FPS: The maximum frames-per-second (fps) of the recording. A range value from 1 to 60 fps. A value of 15 fps means a duration of 66ms for each captured frame.
  • Width and Height: The size of the recording rectangle. You can resize to fit your needs by typing new values or by dragging the corners of the window.
  • Discard (currently hidden) : When the recording is paused, this button will appear. As the text says, it will discard the current recording.
  • Record/Pause: Uh... Starts/pauses the recording?
  • Stop: If there's an active (or paused) recording, clicking this button will open the Editor window with your recording loaded.

Notes:

  • You can move the window around when recording, this allows you to record multiple parts of your screen.
  • The numeric fields of this app will respond to your mouse scroll wheel, increasing/decreasing by 1. When combining with Ctrl or Shift it will increase/decrease by 5 or 10 respectively.
  • You cannot resize the recorder window during the recording.

Webcam Recorder

Webcam Recorder

As the name suggests, this recorder captures the video feed from your webcam. Here's the list of elements from the left to the right:

  • Back: Returns to the startup window. This button is not present if you set the Webcam recorder as the startup window. The same behavior happens with the other recorders.
  • Options: Opens the Options window.
  • Check for video devices: Runs the hardware check to find new video devices. The same check occurs when loading this window.
  • Video devices: Shows all of your video devices (like webcams).
  • Discard (currently hidden) : When the recording is paused, this button will appear. As the text says, it will discard the current recording.
  • Record: Starts/pause the recording.
  • Stop: If there's an active (or paused) recording, clicking this button will open the Editor window with your recording loaded.

Notes:

  • To increase or decrease the size of the recording, you should resize the window.

Board Recorder

Board Recorder

It's a recorder with a canvas where you can draw things. The ink controls are positioned above the canvas with some options to change the color and size of the tip of the pen.

Notes:

  • The board recorder will record your drawings automatically. You can disable the auto recorder by holding the Ctrl key or by clicking on the button.

Editor ✏️

Editor

The editor is the main part of ScreenToGif. It's composed of four main parts, the ribbon, the viewer, the action sidebar and the frame list (and bottom controls).

Ribbon

Ribbon

The ribbon lets you access all of the editing features of ScreenToGif.

  • File: 💾

    1. New: All the options to create or load animations. The previous animation is automatically discarded.

      • Screen Recording Ctrl + N: Opens the screen recorder. When you finish recording, it returns back to the editor to load the new frames. If cancelled, it won't discard your previous animation.
      • Webcam Recording Ctrl + W: Opens the webcam recorder. Follows the same behavior as above.
      • Board Recording Ctrl + B: Opens the board recorder (sketchboard). Follows the same behavior as above.
      • Blank Animation Ctrl + Alt + A: Opens the New Animation panel.

    2. Insert: Options to insert animations inside the current one. It opens the Insert Frames window.

      • Screen Recording Ctrl + Shift + N: Opens the screen recorder. When you finish recording, it returns back to the editor to merge the new recording with the Insert Frames window.
      • Webcam Recording Ctrl + Shift + W: Opens the webcam recorder. Follows the same behavior as above.
      • Board Recording Ctrl + Shift + B: Opens the board recorder. Follows the same behavior as above.
      • Media Ctrl + Shift + O: Opens a file picker and gives you the option to insert images or videos into your current animation.

    3. File: Where you can save or discard your recording.

      • Save as Ctrl + S: Opens the Save as panel.
      • Load Ctrl + O: Lets you load media or project into a new project.
      • Recent Projects Ctrl + L: Opens the Recent Projects panel, where you can load any recent projects that were not discarded.
      • Discard Ctrl + Delete: Discards (deletes from disk) your current animation. It does not interfere with the running encodings.

  • Home: 🏠

    1. Action Stack: Undo, Redo and Reset.

      • Undo Ctrl + Z: Uh, it undoes the latest changes made to the frame list.
      • Redo Ctrl + Y: Redoes the latest undid changes of the frame list.
      • Reset Ctrl + R: Starts over again, the same recording with no changes at all.

    2. Clipboard: Copy, Cut and Paste. There's also a small button under the "Cut" button that shows your current clipboard, called "Show Clipboard".

      • Copy Ctrl + C: Copies all selected frames into the clipboard. It opens the Clipboard panel as soon as you copy. Also, it selects the latest copied frames as the active clipboard entry.
      • Cut Ctrl + X: Same as above, except that it removes the selected frames from the frame list.
      • Paste Ctrl + V: Gets the current active clipboard entry and inserts the frames before or after the selected frame on the list. You can configure the paste behavior on the Clipboard panel.
      • Show Clipboard: Opens the Clipboard panel.

    3. Zoom: Zoom controls, fit the image on the view.

      • Set to 100% Alt + 0: Sets the zoom to 100%.
      • Fit to Window Alt + -: Adjusts the zoom to fit the image on the viewer.

    4. Select: Select All, Deselect, Inverse Selection and Go To.

      • Select All Ctrl + A: Select all frames.
      • Go To Ctrl + G: Opens the Go To window and lets you seek to a specific frame. You should insert the frame number.
      • Inverse Ctrl + I: Removes the selection of the currently selected frames and selects the others (that were not selected).
      • Deselect Ctrl + U: Removes the selection of the currently selected frames.

  • Playback: ⏯

    1. Playback controls (first, previous, play/pause, next, last). They are also found at the bottom-right corner.
      • First Home: Seeks to the first frame.
      • Previous PageUp: Seeks to the previous frame.
      • Play/Pause Alt + P or Space: Starts or pauses the preview.
      • Next PageDown: Seeks to the next frame.
      • Last End: Seeks to the last frame.

  • Edit: ✏️

    1. Frames: Frame deletion controls.

      • Delete Delete: Deletes all selected frames. Gives you a warning when deleting all frames.
      • Delete All Previous Alt + Left: Deletes all previous frames, before the selected frame. For example, you select frame number 9, the frames 0-8 will be deleted.
      • Delete All Next Alt + Right: Deletes all next frames, after the selected frame. For example, you select frame number 9, the frames 10-15 will be deleted.
      • Reduce Frame Count Ctrl + Shift + Delete: Removes N frames after every M frames, without counting the removed ones. With this feature you can reduce the framerate.

    2. Reordering: Frame ordering, you can move frames, invert the order, etc.

      • Reverse Ctrl + Alt + R: Reverses the order of the frame list. The first frame becomes the last one.
      • Yoyo Ctrl + Y: Adds the yoyo effect to the frame list. This effect is basically: Normal order + Reversed order.
      • Move Left Ctrl + Shift + Left: Move the selected frames to the previous position on the list. The frame at the first position will be moved to the last position.
      • Move Right Ctrl + Shift + Right: Move the selected frames to the next position on the list. The frame at the last position will be moved to the first position.

    3. Delay (Duration): Allows you to change the duration (delay, time of display) of each selected frame.

      • Override Alt + O: Opens the Override Delay panel.
      • Increase or Decrease Alt + Y: Opens the Increase or Decrease Delay panel.

  • Image: 🖼

    1. Size and Position: Resize, crop, flip/rotate the frames. The flip action will only flip the selected frames, the other actions will be applied to all frames.

      • Resize Alt + R: Opens the Resize panel.
      • Crop Alt + C: Opens the Crop panel.
      • Flip/Rotate Alt + L: Opens the Flip/Rotate panel.

    2. Text: Text elements, such as Captions, Title Frames and Free Text.

      • Caption Alt + S: Opens the Caption panel.
      • Free Text Alt + F: Opens the Free Text panel.
      • Title Frame Alt + T: Opens the Title Frame panel.

    3. Overlay: Frame overlays, like Free Drawings, Watermark, etc.

      • Free Drawing Alt + D: Opens the Free Drawing panel.
      • Progress Alt + P: Opens the Progress panel.
      • Watermark Alt + W: Lets you add an image as watermark, setting the position, scale and opacity. You can select multiple frames to apply this feature. Opens the Watermark panel.
      • Cinemagraph Alt + G: What's Cinemagraph? Use the paint tools to paint on top of the parts of the image that should animate. The unselected parts will stay static (fixed, not changing) using the first frame as base. This action is applied to all frames. Opens the Cinemagraph panel.
      • Border Alt + B: Lets you add borders on your animation. You can fine tune each side of the border. You can select multiple frames to apply this feature. Opens the Border panel.

  • Transitions: 🔀

    1. Styles: Fade (to the next frame or to a specific color) or Slide (to the next frame).
      • Fade Ctrl + Alt + Y: You can fade to a specific color or to the next frame. Use the slider to select the length of the transition. You must select one frame to apply this transition.
      • Slide Ctrl + Alt + T: Slide to the next frame. You must select one frame to apply this transition.

  • Statistics: ℹ️

    1. General: Information about the current recording.
    2. Selected Frame: Information about the current frame.

Viewer

Viewer

The viewer consists of a zoomable control that supports Mouse + Keyboard interactions:

  • Zoom Ctrl + Scroll: From 5% to 500%, using the scrollwheel while hovering the viewer to zoom.
  • Seek Scroll: Use the scrollwheel while hovering the viewer to seek (navigate among frames).

Action sidebar

The action sidebar is a panel that appears to the left of the Editor, only for a certain amount of actions, such as:

  • New Animation: 🆕
    Lets you create a new project, by creating an empty frame with the desired size and color.

    Panel - New Animation

    1. Width and Height: The desired width and height of the new animation.
    2. Color: The desired background color of the new animation.

  • Save as: 💾
    Lets you save you animation as a Gif, video, project or separated images.

    1. Gif:
      Save As Gif
      There's three encoders available: v2.0, v1.0 and System. System uses a default palette, very fast, but not so pretty. V1 uses a neural quantizer to calculate the colors. V2 uses the Octree algorithm, usually produces a smaller gif, but with a noticeable color banding.

    2. Video:
      Save As Video
      There's two encoders available: System and FFmpeg. I recommend using the later.

    3. Images:
      Save As Images
      This options allows you to export the selected frames as images, with the choice to zip the files.

    4. Project:
      It will export the entire project to allow further edits later. It's basically a Zip with the images plus a json file with the information about the project.

  • Resize:
    Resize
    Lets you resize all the frames of the project. One of the most effective ways to reduce the output file size is to decrease the resolution of the frames.

  • Crop:
    Crop
    Lets you cut out pieces of the frames that you don't want. This action is applied to all frames.

  • Free Drawing:

  • Watermark:

  • Cinemagraph:

Frame list

[image here]

Saving your recording

To export/save your animation, you need to follow a few steps:

  1. Click "Save As..." or press Ctrl + S. A panel will open on the right side of the screen.
  2. Select the type of the output file (gif, video, separated images or project).
  3. (Optional) Adjust the options for the output file.
  4. Select a folder and filename for the output file.
  5. Click to Save at the bottom of that panel. :)

Options ⚙️

Options

This is the window that allows you to adjust all the settings of the app.

  • Application: 📦
  • Interface: 📊
  • Language: 🌐
  • Temp. Files: 🗃️
  • Extras: 🚩
  • Donate: 💰
  • About: ℹ️

Navigate back to:
« Home
« Help

System Requirements

For Use

For Development

Clone this wiki locally