Slides Studio for Obsidian

#uuinsome

https://youtu.be/3NvjpUSWRUM

Requirements

Download and install these pieces to run slide studio

  1. Open Broadcast Studio(OBS)

    • OBS is a free and Open Source software for video recording and live streaming.

  2. Obsidian

    • Obsidian is a tool for storing markdown formatted notes on your device.

  3. Obsidian plugin slides extended

    • Slides Extended is an Obsidian community plugin that converts markdown notes to Reveal.js slides

  4. Slides Studio

    • Download the repo and extract the files in an obsidian vault folder

Setup

Folder Structure

/Obsidian Vault
	/export
		/slides-extended_deck
	/slides-studio

Configure OBS:

Import the Slide Studio Scene Collection

  1. Download the Slides Studio OBS Scene Collection download link.
  2. In OBS Import the Slides Studio OBS collection
    a. On the file menu click, "Scene Collection" -> "Import"
    Pasted image 20250802193752.png
  3. Select the Scene Collection.
    a. "Scene Collection" -> "Slides.com_Collection"

Enable the OBS WebSocket Server

  1. On the file menu click, "Tools" -> "WebSocket Server Settings"
  2. Check the "Enable WebSocket server" option
    Pasted image 20250802195254.png
  3. Click the "Show Connect Info" button to view the Server Password.

Select a Camera

  1. Select the Scene named "Set Camera"
  2. Double click the Source named "Camera 1" to open the source properties window
  3. Use the "Device" drop down to select a camera.
    Drawing Set Camera.excalidraw.png

Slide Studio Settings

Connect Slides Studio and OBS

Select Slides Deck

  1. Enter a Slides Extended presentation link
Slides Extended URL Example

http://localhost:3000/export/slides-extended_deck/index.html

Open OBS

If OBS is already open, then

  1. enter the port number and password.
  2. click the "connect" button

Add Slide Control Tags

Choose the "Studio" layout

After connecting to the OBS WebSocket server, the Slide Studio view will appear.

  1. Use the "Layout" button and select the "Studio" option.

  2. Enter a name in the "slide deck name" field to save the settings

    1. press the "Load" button to retrieve previously saved setting from local storage

  3. For each slide, click the cell to choose an available option.

    • Slide Position: where the slides appears on the scene
    • camera Position: where the Camera appears on the scene
    • Camera Shape: change the camera from a rectangle to a different shape
    • Scene: OBS scenes that begin with "Scene"
      Drawing add control tags.excalidraw.png

1. Current Slide navigation

Click the ">" button to advance to the next slide, or the "<" button to return to the previous slide.

The keyboard keys left and right arrow keys can navigate the slides forward and back.

2. Slide tags navigation

Click on the slide number in the "Index" column to jump to a specific slide.

Press the keyboard "spacebar" key to advance to the next slide.

slidesStudio navigate slidesexcalidraw.png

Teleprompter

Add notes to slide

Slides Studio uses the Reveal.js notes format. Notes are defined by appending an <aside> element to a slide as seen below .

Pasted image 20250805060851.png

Notes can also be added to a slide using the Slides Extended markdown syntax. See the Slides Extended Docs obsidian-slides-extended speakerNotes

Adjust teleprompter settings

Click the "Layout" button, then select "Teleprompter".

The teleprompter view can set the font size, scroll speed, flip text and play/pause

Pasted image 20250805055539.png