Publish deploy 2020-10-11 16:23

1 files changed, 17 insertions, 1 deletions

diff --git a/feed.rss b/feed.rss
index 6637b94..3cc95eb 100644
--- a/feed.rss
+++ b/feed.rss
@@ -1,4 +1,20 @@
-<?xml version="1.0" encoding="UTF-8"?><rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:content="http://purl.org/rss/1.0/modules/content"><channel><title>Navan Chauhan</title><description>Welcome to my personal fragment of the internet. Majority of the posts should be complete.</description><link>https://navanchauhan.github.io/</link><language>en</language><lastBuildDate>Tue, 15 Sep 2020 15:53:16 +0530</lastBuildDate><pubDate>Tue, 15 Sep 2020 15:53:16 +0530</pubDate><ttl>250</ttl><atom:link href="https://navanchauhan.github.io/feed.rss" rel="self" type="application/rss+xml"/><item><guid isPermaLink="true">https://navanchauhan.github.io/posts/2020-08-01-Natural-Feature-Tracking-ARJS</guid><title>Introduction to AR.js and Natural Feature Tracking</title><description>An introduction to AR.js and NFT</description><link>https://navanchauhan.github.io/posts/2020-08-01-Natural-Feature-Tracking-ARJS</link><pubDate>Sat, 1 Aug 2020 15:43:00 +0530</pubDate><content:encoded><![CDATA[<h1>Introduction to AR.js and Natural Feature Tracking</h1><h2>AR.js</h2><p>AR.js is a lightweight library for Augmented Reality on the Web, coming with features like Image Tracking, Location based AR and Marker tracking. It is the easiest option for cross-browser augmented reality.</p><p>The same code works for iOS, Android, Desktops and even VR Browsers!</p><p>It was initially created by Jerome Etienne and is now maintained by Nicolo Carpignoli and the AR-js Organisation</p><h2>NFT</h2><p>Usually for augmented reality you need specialised markers, like this Hiro marker (notice the thick non-aesthetic borders 🤢)</p><img src="https://upload.wikimedia.org/wikipedia/commons/4/48/Hiro_marker_ARjs.png"/><p>This is called marker based tracking where the code knows what to look for. NFT or Natural Feature Tracing converts normal images into markers by extracting 'features' from it, this way you can use any image of your liking!</p><p>I'll be using my GitHub profile picture</p><img src="https://navanchauhan.github.io//images/me.jpeg"/><h2>Creating the Marker!</h2><p>First we need to create the marker files required by AR.js for NFT. For this we use Carnaux's repository 'NFT-Marker-Creator'.</p><pre><code><div class="highlight"><span></span>$ git clone https://github.com/Carnaux/NFT-Marker-Creator
+<?xml version="1.0" encoding="UTF-8"?><rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:content="http://purl.org/rss/1.0/modules/content"><channel><title>Navan Chauhan</title><description>Welcome to my personal fragment of the internet. Majority of the posts should be complete.</description><link>https://navanchauhan.github.io/</link><language>en</language><lastBuildDate>Sun, 11 Oct 2020 16:21:21 +0530</lastBuildDate><pubDate>Sun, 11 Oct 2020 16:21:21 +0530</pubDate><ttl>250</ttl><atom:link href="https://navanchauhan.github.io/feed.rss" rel="self" type="application/rss+xml"/><item><guid isPermaLink="true">https://navanchauhan.github.io/posts/2020-10-11-macOS-Virtual-Cam-OBS</guid><title>Different Camera Setups</title><description>Comparison of different cameras setups for using as a webcam and tutorials for the same.</description><link>https://navanchauhan.github.io/posts/2020-10-11-macOS-Virtual-Cam-OBS</link><pubDate>Sun, 11 Oct 2020 16:12:00 +0530</pubDate><content:encoded><![CDATA[<h1>Different Camera Setups</h1><ol start="0"><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="https://navanchauhan.github.io//assets/posts/obs/normal.png" alt="Normal Webcam">
+  <img src="https://navanchauhan.github.io//assets/posts/obs/usb.png" alt="USB Webcam">
+  <img src="https://navanchauhan.github.io//assets/posts/obs/5s.png" alt="Camo iPhone 5S">
+  <img src="https://navanchauhan.github.io//assets/posts/obs/11.png" alt="Camo iPhone 11">
+  <img src="https://navanchauhan.github.io//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><div class="highlight"><span></span>brew cask install obs
+brew cask install obs-virtualcam
+</div></code></pre><p>Windows users can install the latest version of the plugin from <a 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><img src="https://navanchauhan.github.io//assets/posts/obs/01-pewdiepie.png" alt="Still grab from PewDiePie's video showing border"/><p>The border was apparently made by a YouTuber <a href="https://www.youtube.com/watch?v=R__RUitpjnA">Sleepy Tanooki</a>. He posted a <a 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><img src="https://navanchauhan.github.io//assets/posts/obs/01-panel.png" alt="Bottom Panel of OBS"/><p>Now, in the Sources section click on the add button -&gt; Video Capture Device -&gt; Create New -&gt; 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><img src="https://navanchauhan.github.io//assets/posts/obs/01-media-source.png" alt="Media Source Option"/><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 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><img src="https://navanchauhan.github.io//assets/posts/obs/02-remote.png" alt="Remote showing available cameras"/><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 -&gt; File -&gt; New Movie Recording</p><p>In the Sources choose your device (No need to press record). You may open the camera app now.</p><img src="https://navanchauhan.github.io//assets/posts/obs/021-source.png" alt="Choose Source"/><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><img src="https://navanchauhan.github.io//assets/posts/obs/021-rotate.png" alt="Rotation"/><h2>2.2 Using your iPhone using an application like Camo</h2><p>Install the Camo app on your phone through the app store -&gt; 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 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><img src="https://navanchauhan.github.io//assets/posts/obs/3-usb.png" alt="USB Webcam"/><head>
+<link rel="stylesheet" href="https://navanchauhan.github.io//assets/posts/obs/dics.css">
+<script src="https://navanchauhan.github.io//assets/posts/obs/dics.js"></script>
+</head><script>
+
+new Dics({
+    container: document.querySelector('.b-dics')
+});
+</script>]]></content:encoded></item><item><guid isPermaLink="true">https://navanchauhan.github.io/posts/2020-08-01-Natural-Feature-Tracking-ARJS</guid><title>Introduction to AR.js and Natural Feature Tracking</title><description>An introduction to AR.js and NFT</description><link>https://navanchauhan.github.io/posts/2020-08-01-Natural-Feature-Tracking-ARJS</link><pubDate>Sat, 1 Aug 2020 15:43:00 +0530</pubDate><content:encoded><![CDATA[<h1>Introduction to AR.js and Natural Feature Tracking</h1><h2>AR.js</h2><p>AR.js is a lightweight library for Augmented Reality on the Web, coming with features like Image Tracking, Location based AR and Marker tracking. It is the easiest option for cross-browser augmented reality.</p><p>The same code works for iOS, Android, Desktops and even VR Browsers!</p><p>It was initially created by Jerome Etienne and is now maintained by Nicolo Carpignoli and the AR-js Organisation</p><h2>NFT</h2><p>Usually for augmented reality you need specialised markers, like this Hiro marker (notice the thick non-aesthetic borders 🤢)</p><img src="https://upload.wikimedia.org/wikipedia/commons/4/48/Hiro_marker_ARjs.png"/><p>This is called marker based tracking where the code knows what to look for. NFT or Natural Feature Tracing converts normal images into markers by extracting 'features' from it, this way you can use any image of your liking!</p><p>I'll be using my GitHub profile picture</p><img src="https://navanchauhan.github.io//images/me.jpeg"/><h2>Creating the Marker!</h2><p>First we need to create the marker files required by AR.js for NFT. For this we use Carnaux's repository 'NFT-Marker-Creator'.</p><pre><code><div class="highlight"><span></span>$ git clone https://github.com/Carnaux/NFT-Marker-Creator
 
 Cloning into <span class="s1">&#39;NFT-Marker-Creator&#39;</span>...
 remote: Enumerating objects: <span class="m">79</span>, <span class="k">done</span>.