summaryrefslogtreecommitdiff
path: root/docs/posts/2020-10-11-macOS-Virtual-Cam-OBS.html
diff options
context:
space:
mode:
authorNavan Chauhan <navanchauhan@gmail.com>2021-05-26 23:59:17 +0530
committerNavan Chauhan <navanchauhan@gmail.com>2021-05-26 23:59:17 +0530
commitdfc509b95ff03d0c9027ee74d31d7b171f867bf1 (patch)
tree4a7bfc10cc0e8c1cf41a0d50d9ec30d5f97d95e5 /docs/posts/2020-10-11-macOS-Virtual-Cam-OBS.html
parentd8b9e9c58b1ee676b4eaf605d94b38325775d12c (diff)
generated website
Diffstat (limited to 'docs/posts/2020-10-11-macOS-Virtual-Cam-OBS.html')
-rw-r--r--docs/posts/2020-10-11-macOS-Virtual-Cam-OBS.html138
1 files changed, 138 insertions, 0 deletions
diff --git a/docs/posts/2020-10-11-macOS-Virtual-Cam-OBS.html b/docs/posts/2020-10-11-macOS-Virtual-Cam-OBS.html
new file mode 100644
index 0000000..5d59cd6
--- /dev/null
+++ b/docs/posts/2020-10-11-macOS-Virtual-Cam-OBS.html
@@ -0,0 +1,138 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+
+ <link rel="stylesheet" href="/assets/main.css" />
+ <link rel="stylesheet" href="/assets/sakura.css" />
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Hey - Post</title>
+
+</head>
+<body>
+ <nav style="display: block;">
+|
+<a href="/">home</a> |
+<a href="/about/">about/links</a> |
+<a href="/posts/">posts</a> |
+<a href="/publications/">publications</a> |
+<a href="/repo/">iOS repo</a> |
+<a href="/feed.rss">RSS Feed</a> |
+</nav>
+
+<main>
+ <h1>Trying Different Camera Setups</h1>
+
+<ol>
+<li>Animated Overlays</li>
+<li>Using a modern camera as your webcam</li>
+<li>Using your phone's camera as your webcam</li>
+<li>Using a USB Camera</li>
+</ol>
+
+<h2>Comparison</h2>
+
+<p>Here are the results before you begin reading.</p>
+
+<div class="b-dics">
+ <img src="/assets/posts/obs/normal.png" alt="Normal Webcam">
+ <img src="/assets/posts/obs/usb.png" alt="USB Webcam">
+ <img src="/assets/posts/obs/5S.png" alt="Camo iPhone 5S">
+ <img src="/assets/posts/obs/11.png" alt="Camo iPhone 11">
+ <img src="/assets/posts/obs/mirrorless.png" alt="Mirrorless Camera">
+</div>
+
+<h2>Prerequisites</h2>
+
+<p>I am running macOS and iOS but I will try to link the same steps for Windows as well. If you are running Arch, I assume you already know what you are doing and are using this post as an inspiration and not a how-to guide.</p>
+
+<p>I assume that you have Homebrew installed.</p>
+
+<h3>OBS and OBS-Virtual-Cam</h3>
+
+<p><em>Description</em></p>
+
+<pre><code>brew cask install obs
+brew cask install obs-virtualcam
+</code></pre>
+
+<p>Windows users can install the latest version of the plugin from <a rel="noopener" target="_blank" href="https://obsproject.com/forum/resources/obs-virtualcam.949/">OBS-Forums</a></p>
+
+<h2>0. Animated Overlays</h2>
+
+<p>I have always liked PewDiePie's animated border he uses in his videos</p>
+
+<p><img src="/assets/posts/obs/01-pewdiepie.png" alt="Still grab from PewDiePie's video showing border" /></p>
+
+<p>The border was apparently made by a YouTuber <a rel="noopener" target="_blank" href="https://www.youtube.com/watch?v=R__RUitpjnA">Sleepy Tanooki</a>. He posted a <a rel="noopener" target="_blank" href="https://drive.google.com/drive/folders/1mL3HAvTQfG7mTqwCp-9xCJ2IFhZUoJ5W">link to a Google Drive folder</a> containing the video file. (I will be using the video overlay for the example)</p>
+
+<p>It is pretty simple to use overlays in OBS:</p>
+
+<p>First, Create a new scene by clicking on the plus button on the bottom right corner.</p>
+
+<p><img src="/assets/posts/obs/01-panel.png" alt="Bottom Panel of OBS" /></p>
+
+<p>Now, in the Sources section click on the add button -> Video Capture Device -> Create New -> Choose your webcam from the Device section.</p>
+
+<p>You may, resize if you want</p>
+
+<p>After this, again click on the add button, but this time choose the <code>Media Source</code> option</p>
+
+<p><img src="/assets/posts/obs/01-media-source.png" alt="Media Source Option" /></p>
+
+<p>and, locate and choose the downloaded overlay.</p>
+
+<h2>1. Using a Modern Camera (Without using a Capture Card)</h2>
+
+<p>I have a Sony mirrorless camera. Using Sony's <a rel="noopener" target="_blank" href="https://imagingedge.sony.net/en/ie-desktop.html">Imaging Edge Desktop</a>, you can use your laptop as a remote viewfinder and capture or record media.</p>
+
+<p>After installing Image Edge Desktop or your Camera's equivalent, open the <code>Remote</code> application. </p>
+
+<p><img src="/assets/posts/obs/02-remote.png" alt="Remote showing available cameras" /></p>
+
+<p>Once you are able to see the output of the camera on the application, switch to OBS. Create a new scene, and this time choose <code>Window Capture</code> in the Sources menu. After you have chosen the appropriate window, you may transform/crop the output using the properties/filters options.</p>
+
+<h2>2.1 Using your iPhone using Quicktime</h2>
+
+<p>Connect your iPhone via a USB cable, then Open Quicktime -> File -> New Movie Recording </p>
+
+<p>In the Sources choose your device (No need to press record). You may open the camera app now.</p>
+
+<p><img src="/assets/posts/obs/021-source.png" alt="Choose Source" /></p>
+
+<p>Now, in OBS create a new scene, and in the sources choose the <code>Window Capture</code> option. You will need to rotate the source:</p>
+
+<p><img src="/assets/posts/obs/021-rotate.png" alt="Rotation" /></p>
+
+<h2>2.2 Using your iPhone using an application like Camo</h2>
+
+<p>Install the Camo app on your phone through the app store -> connect to Mac using USB cable, install the companion app and you are done.</p>
+
+<p>I tried both my current iPhone and an old iPhone 5S</p>
+
+<h2>3. A USB Webcam</h2>
+
+<p>The simplest solution, is to use a USB webcam. I used an old <a rel="noopener" target="_blank" href="https://www.logitech.com/en-in/product/hd-webcam-c310">Logitech C310</a> that was collecting dust. I was surprised to find that Logitech is still selling it after years and proudly advertising it! (5MP)</p>
+
+<p>It did not sit well on my laptop, so I placed it on my definitely-not-Joby Gorrila Pod i had bought on Amazon for ~₹500</p>
+
+<p><img src="/assets/posts/obs/3-usb.png" alt="USB Webcam" />
+<head>
+<link rel="stylesheet" href="/assets/posts/obs/dics.css"></p>
+
+<script src="/assets/posts/obs/dics.js"></script>
+</head>
+<script>
+
+new Dics({
+ container: document.querySelector('.b-dics')
+});
+</script>
+
+</main>
+
+
+<script src="assets/manup.min.js"></script>
+<script src="/pwabuilder-sw-register.js"></script>
+</body>
+</html> \ No newline at end of file