Posts

Posted on

Basics of Using Cryptomatte in Blender 2.93

In the buttons area (on the right side of the interface), select the “View layer properties” tab.

Under “cryptomatte” turn on “object”, “material” or “asset”. I like “asset” since it let’s me select entire rigs that consist of several parts.

Go to the “compositing” workspace.

Turn on “use nodes”.

Add a viewer node with shift+a –> output –> viewer.

Add the cryptomatte node from Matte –> Cryptomatte.

Connect the image output from the render layers node to the image input of the Cryptomatte node. Connect the “pick” output from the Cryptomatte node to the image input of the viewer node. Render the scene (keyboard shortcut F12).

You should now see different matte colors that identify different assets in your render layer. Use the + button to access the eyedropper tool and select as many assets as you need for the matte you are building.

To see the actual matte, you can plug the “matte” output from the Cryptomatte node to the viewer.

Now you have a matte that you can use in various way when you are compositing. As a simple example, you could color correct the matted area by combining two copies of the input image with the “AlphaOver” node while using the matte as the factor. Then simply drop a color correction node like RGB curves between the bottom image connection.

Posted on

How to get site by day report in Adsense

The Adsense report system can be a bit confusing at times. I decided to write these instructions after struggling to display daily earnings information for just a single site in Adsense.

The easiest way I found was this:

Select the “entire account by day” report type.

Go to the “search or filter your data” input box and choose “site”.

Choose the site you want to see reported. Hit apply.

Now you should see a daily breakdown for just a single site.

Posted on

How to keep using port 10080 after many browsers block it as an unsafe port

If you have been doing web development using port 10080 you might have run into some issues recently since many browsers including Chrome and Firefox have decided to add that port to their blocked ports list.

I use a tool called InstantWP for WordPress development and it’s using port 10080 for http by default.

I first researched the option to change the ports IWP is using. It seems like it could be done from the config file which you can open from the “Advanced” tab by clicking “Edit Config File”. In the file that opens you should see a setting called PortOffset. I tried to change that but couldn’t get it to work even after trying many different numbers for the port offset.

I also tried to add a flag into Chrome’s startup parameters by right-clicking the Chrome icon and choosing properties. Then I replaced the value under “target” with the following string:

“C:\Program Files (x86)\Google\Chrome\Application\chrome.exe” –explicitly-allowed-ports=10080

However that didn’t seem to fix the situation in my case. I still got the same “unsafe port” error from Chrome.

What finally helped was switching to Firefox and performing these steps:

  1. Type about:config to the address bar and click on the “accept the risk and continue” button.

Then paste in this string to the search bar:

network.security.ports.banned.override

Choose “string” as the type (I know, number would seem more logical), click on the + button and enter the port number you want to allow (in my case 10080).

Now you should be able to access applications via that port!

Posted on

Full screen preview for second monitor in DaVinci Resolve

Most video editors have at least two monitors these days. If you want to see the footage your editing fullscreen on your second monitor while having the timeline and the rest of the panels on the other monitor, here are the steps for doing that (Edit: note that this feature requires the Studio version of Resolve):

  1. Make sure Workspace->dual screen is set to “off” (I know, sounds a bit counter-intuitive)
  2. Go to Workspace->video clean feed and select your monitor from there.
Posted on

Increment integer value in a database field using WPDB

Sometimes you need to update values incrementally in your WordPress database. You might for example have an upvote feature to which you automatically add points in an incremental fashion.

It was surprisingly hard to find examples of how to do this using Wpdb. But here’s an example of doing just that:

/* Have to use wpdb->query instead of wpdb->update because the latter assumes strings  */
  $results = $wpdb->query($wpdb->prepare("UPDATE foodsenglish SET popularity = popularity + 1 WHERE dbID = %d", $foodIdToSendThePointFor), ARRAY_A);

Posted on

Zoom: Don’t show camera while screen sharing

If you are doing a lot of screencasts with Zoom in which you share your screen, you might be wondering how you can stop the little video frame from the webcam being included in the recording. Luckily there is an option in the zoom settings to do just that.

Start by clicking on the little cogwheel symbol in order to open the Zoom settings:

Next go to the “Recording” tab and there you can find the “Record video during screen sharing” setting:

Posted on

Construct 3 Spritefonts with Photoshop

Creating your own Spritefonts (sometimes also called bitmap fonts) for Scirra’s Construct 3 game engine using Photoshop can be surprisingly tricky. The main difficulty seems to be in creating a grid of evenly spaced characters so that the automatic Sprite font slicing mechanism in Construct can slice them up properly. A monospace font makes this much more simple since all the characters will take up the same space by default, but monospace fonts are quite limiting stylistically. What if you want to have non-monospaced fonts neatly organized in a grid for Construct?

There are helpful tools like “Give Your Fonts Mono” which can convert a regular font into a sprite font and it even generates the spacing data for Construct 3 which you paste into the Spritefont plugin settings. The spacing data looks typically something like this;

[[20,” “],[9,”l|”],[10,”Ii.,;:!'”],[16,”`”],[17,”[]”],[18,”j”],[20,”()”],[21,”t”],[22,”1-\”\/°”],[23,”r”],[25,”f”],[26,”*”],[31,”J”],[33,”u”],[34,”hkns”],[35,”Ldq”],[36,”bcgpz03789?”],[37,”Favy256+=$<>”],[38,”eox4~”],[40,”£”],[42,”BEP#€”],[44,”HNSTUZ_”],[45,”K”],[46,”D&”],[48,”R”],[49,”C”],[50,”VXY”],[51,”AG”],[52,”MO”],[53,”Q”],[54,”mw”],[58,”%”],[69,”W”],[70,”@”]]

You can’t however do any fancy stuff like giving your characters drop shadows, strokes or gradient fills etc. But there is a work around! Just save your tranparent png image from GYFM and open that in Photoshop. Then you can play with layer styles etc as long as you don’t cross the bounding box given for each character. You can increase the bounding box size in Give your fonts mono to give yourself more room. In Photoshop you might need to cut some of the rows into their separate layers for consistent gradients, but other than that this workflow should be pretty straightforward. When done in PS, simply re-save as PNG and import to Construct 3.

Unfortunately Construct doesn’t seem to support kerning at the moment so that would have to be handled with events. It’s not the easiest of programming challenges though.

Another possibility (besides custom events) might be to make a copy of the most difficult characters in the Spritefont sheet and give them special spacing rules. Then you would need to pick that special character in the situations in which your kerning looks bad. That’s also a bit hacky and tedious. So before Construct gets proper kerning support for Spritefonts, it might be best to stick to monospace Spritefonts.