From f60ed1ef6f26ad80cc30b8e31660865a0205e0d1 Mon Sep 17 00:00:00 2001 From: Navan Chauhan Date: Sun, 11 Oct 2020 16:23:07 +0530 Subject: Publish deploy 2020-10-11 16:23 --- feed.rss | 18 +++++++++++++++++- 1 file changed, 17 insertions(+), 1 deletion(-) (limited to 'feed.rss') diff --git a/feed.rss b/feed.rss index 6637b94..3cc95eb 100644 --- a/feed.rss +++ b/feed.rss @@ -1,4 +1,20 @@ -Navan ChauhanWelcome to my personal fragment of the internet. Majority of the posts should be complete.https://navanchauhan.github.io/enTue, 15 Sep 2020 15:53:16 +0530Tue, 15 Sep 2020 15:53:16 +0530250https://navanchauhan.github.io/posts/2020-08-01-Natural-Feature-Tracking-ARJSIntroduction to AR.js and Natural Feature TrackingAn introduction to AR.js and NFThttps://navanchauhan.github.io/posts/2020-08-01-Natural-Feature-Tracking-ARJSSat, 1 Aug 2020 15:43:00 +0530Introduction to AR.js and Natural Feature Tracking

AR.js

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.

The same code works for iOS, Android, Desktops and even VR Browsers!

It was initially created by Jerome Etienne and is now maintained by Nicolo Carpignoli and the AR-js Organisation

NFT

Usually for augmented reality you need specialised markers, like this Hiro marker (notice the thick non-aesthetic borders 🤢)

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!

I'll be using my GitHub profile picture

Creating the Marker!

First we need to create the marker files required by AR.js for NFT. For this we use Carnaux's repository 'NFT-Marker-Creator'.

$ git clone https://github.com/Carnaux/NFT-Marker-Creator +Navan ChauhanWelcome to my personal fragment of the internet. Majority of the posts should be complete.https://navanchauhan.github.io/enSun, 11 Oct 2020 16:21:21 +0530Sun, 11 Oct 2020 16:21:21 +0530250https://navanchauhan.github.io/posts/2020-10-11-macOS-Virtual-Cam-OBSDifferent Camera SetupsComparison of different cameras setups for using as a webcam and tutorials for the same.https://navanchauhan.github.io/posts/2020-10-11-macOS-Virtual-Cam-OBSSun, 11 Oct 2020 16:12:00 +0530Different Camera Setups
  1. Animated Overlays
  2. Using a modern camera as your webcam
  3. Using your phone's camera as your webcam
  4. Using a USB Camera

Comparison

Here are the results before you begin reading.

+ Normal Webcam + USB Webcam + Camo iPhone 5S + Camo iPhone 11 + Mirrorless Camera +

Prerequisites

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.

I assume that you have Homebrew installed.

OBS and OBS-Virtual-Cam

Description

brew cask install obs +brew cask install obs-virtualcam +

Windows users can install the latest version of the plugin from OBS-Forums

0. Animated Overlays

I have always liked PewDiePie's animated border he uses in his videos

Still grab from PewDiePie's video showing border

The border was apparently made by a YouTuber Sleepy Tanooki. He posted a link to a Google Drive folder containing the video file. (I will be using the video overlay for the example)

It is pretty simple to use overlays in OBS:

First, Create a new scene by clicking on the plus button on the bottom right corner.

Bottom Panel of OBS

Now, in the Sources section click on the add button -> Video Capture Device -> Create New -> Choose your webcam from the Device section.

You may, resize if you want

After this, again click on the add button, but this time choose the Media Source option

Media Source Option

and, locate and choose the downloaded overlay.

1. Using a Modern Camera (Without using a Capture Card)

I have a Sony mirrorless camera. Using Sony's Imaging Edge Desktop, you can use your laptop as a remote viewfinder and capture or record media.

After installing Image Edge Desktop or your Camera's equivalent, open the Remote application.

Remote showing available cameras

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 Window Capture in the Sources menu. After you have chosen the appropriate window, you may transform/crop the output using the properties/filters options.

2.1 Using your iPhone using Quicktime

Connect your iPhone via a USB cable, then Open Quicktime -> File -> New Movie Recording

In the Sources choose your device (No need to press record). You may open the camera app now.

Choose Source

Now, in OBS create a new scene, and in the sources choose the Window Capture option. You will need to rotate the source:

Rotation

2.2 Using your iPhone using an application like Camo

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.

I tried both my current iPhone and an old iPhone 5S

3. A USB Webcam

The simplest solution, is to use a USB webcam. I used an old Logitech C310 that was collecting dust. I was surprised to find that Logitech is still selling it after years and proudly advertising it! (5MP)

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

USB Webcam + + +]]>
https://navanchauhan.github.io/posts/2020-08-01-Natural-Feature-Tracking-ARJSIntroduction to AR.js and Natural Feature TrackingAn introduction to AR.js and NFThttps://navanchauhan.github.io/posts/2020-08-01-Natural-Feature-Tracking-ARJSSat, 1 Aug 2020 15:43:00 +0530Introduction to AR.js and Natural Feature Tracking

AR.js

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.

The same code works for iOS, Android, Desktops and even VR Browsers!

It was initially created by Jerome Etienne and is now maintained by Nicolo Carpignoli and the AR-js Organisation

NFT

Usually for augmented reality you need specialised markers, like this Hiro marker (notice the thick non-aesthetic borders 🤢)

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!

I'll be using my GitHub profile picture

Creating the Marker!

First we need to create the marker files required by AR.js for NFT. For this we use Carnaux's repository 'NFT-Marker-Creator'.

$ git clone https://github.com/Carnaux/NFT-Marker-Creator Cloning into 'NFT-Marker-Creator'... remote: Enumerating objects: 79, done. -- cgit v1.2.3