LUT-3D Viewer

Don’t you just sigh when you want to use a LUT out of the 20 or more that you have and you have to go through each one individually to find the one with the effect that you are looking for?

Then sigh no longer. I have created a LUT-3D (.cube file) Viewer that you can feed an image into along with all thos LUTs and will give you a preview of how the image wood look with each LUT applied.

For Shotcut: just export a frame from a typical scene in your video as a PNG or JPG, feed that into the viewer, size it (if necessary), feed in the LUTs (.cube files) and hey presto, the previews appear. When you decide which one you like just hover your cursor over it and the name of the .cube file appears,

To access the app just go to: Resources for Shotcut (elusien.co.uk)

10 Likes

Works like a charm. Thank you!

1 Like

I was fed up with going through each one at a time. I downloaded a viewer from the internet, it was written in Python and Qt, had almost 150 files spread over 15 folders, only ran on Windows and took forever to generate each preview. Mine is just 440 lines of code, runs in (almost) any browser, on any system and works considerably faster, so I thought I’d make it available for the community.

2 Likes

Awesome tool, thanks for making it and sharing it

1 Like

I just put a new version on the “Resources” website. It now runs over 5 times faster! I did this by changing 3 lines of code from:

lut.r.push(nums[0]);
lut.g.push(nums[1]);
lut.b.push(nums[2]);

to

lut.r.push(+nums[0]);
lut.g.push(+nums[1]);
lut.b.push(+nums[2]);
1 Like

Hi @Elusien

I have this crazy idea of a display-LUTs-in-a-single-column option.
Some LUTs are very subtle so when scrolling up and down, it would make it possible to compare each of the LUTs side by side with the original image.
What do you think?

Just shrink the width of your browser and it will happen automatically.

2 Likes

Ah! Of course :smiley:
And the height too, to make it possible to get to the last LUTS
mPzHzZXGCj

2 Likes

Exactly. Being browser-based you get a lot of options for “free”, which makes it so easy developing web apps, as opposed to other apps, where you have to handle all the interactions yourself.

2 Likes

Version on the webpage updated

  • slight improvement in performance ~15% to 20%;
  • change to the way the menu is displayed after choosing the LUT(s).
2 Likes

Hi @Elusien

I’ve been using the LUT viewer quite a lot yesterday, and if you don’t mind, I came up with a couple of improvement suggestions. :innocent:

But first, you need to know that I have more than a few LUTs. Around 600 or 700 maybe? At one point, I downloaded every LUTs pack I could find. This is way more LUTs than I will ever need, but now that I have them, I hate the idea of deleting even a small part of my collection.
Call me NUTs, but I will NOT make a CUT in my LUTs :upside_down_face:

So, to sum up, I have a ton of LUTs sorted in different folders and some folders contains up to 50 LUTs.

With that in mind, here are my suggestions:

  1. A way to clear the loaded LUTs.
    With LUTs already loaded, when you click this button the new LUTs are added to those already in the LUT Viewer.
    YcEgoFGYJb
    That’s useful in some cases, but sometimes, I’d prefer to clear the LUTs before loading a new bunch. I know you can clear them by reloading the browser page. But that also deletes the imported image. So you need to go back to the image folder, import the image again and then go to another folder to select the new LUTs. So, I don’t know. Maybe a *Clear LUT(s)" button?

  2. A way to replace the image currently in use, without loosing the loaded LUTs.
    I think that would be useful in some occasions.

  3. Remove the text animation when displaying the name of the LUT.
    If I have many LUTs loaded and I scroll Up or Down, depending on where the mouse cursor is located, the display of the LUT names can’t keep up.
    chrome_usqp9jvGCK

Even if you don’t use those suggestions, the LUT Viewer will still be an invaluable tool and I thank you again for giving it to us :+1:

No problem. My wife has gone back to the UK tp see my daughters an grandchildren, so I have quite a bit of spare time (after golf), so I’ll look at providing these new features. I’ll update the post when they are ready.

2 Likes

Great! Thank you.

Your wish is my command oh master, says the genie of the lamp.

I have put a new improved version of the LUT viewer up on the website and updated the description at Resources for Shotcut.

You can now change the image and the LUT displays will change to reflect the new image. You can clear all the LUTs (you will be asked to confirm this action). You can add more LUTs to be previewed. To see the name of a LUT you now need to click (no longer hover) on the LUT image. You can delete the ribbon showing the name by clicking on its “close” button (a red ‘X’).

Don’t forget, you can copy the source to a local (.html) file and run it as an app on your system without needing to have an internet connection.

2 Likes

That’s perfect @Elusien! Thank you so much!

Two issues that I’ve seen with LUTs:

  1. There’s no mandatory metadata on the range that the LUT in question is meant to be applied over, is it 64-940, 4-1019 or 0-1023? I’ve seen all 3 in use.
  2. LUTs work in the RGB domain whereas video is Y’CbCr. The matrix from Y’CbCr to RGB depends on the colour primaries and range of the video.

Would it be worth having an advanced tab to be able to control these?

My application is designed to give a quick overview of what an image would look like when a selection of LUTs are applied to it. It is a reasonable representation, but e,g, it uses Bi-Linear interpolation, not Bi-Cubic, so it does not strictly conform to the .cube “standard” (though the difference is mostly indistinguishable).

It works in RGB-space with each component ranging from 0 to 1023. Note that .cube files can specify the range over which the LUT applies by directives (DOMAIN_MIN & DOMAIN_MAX), but my app currently ignores these, as these directives are rarely used, but I do plan to remedy this.

If you are talking about applying the LUTs in Shotcut (and not my viewer app), then my understanding, from a post @brian wrote:

Most (all?) NLE color grading workflows operate in the RGB space.

Conversion from YUV to RGB is not mathematically lossless because not all YUV values can be mapped to the RGB clolor space. But video images that come from a camera originated in RGB because camera sensors are RGB. So unless your source material originated from a non-RGB source and used YUV values that don’t map to the RGB colorspace, you shouldn’t have any pixel values that get grossly modified. Any loss in the conversion should be limited to rounding errors of a single bit.

For Shotcut, we aspire to limit the pixel errors to one bit.

There is a relevant thread here:

Hi again @Elusien.
Maybe I’m doing something wrong. I tried two methods to get a local copy of the Viewer, but none works 100% correctly.

Method 1: Copy the Source and save it as a .htlm file.

chrome_3FLheup4Wr

When opening the file, I get this:

  • Clicking on the Image area OR the LUTs area doesn’t open the Explorer windows needed to select the image or the LUTs.
  • The colored cube between LUT 3D and Viewer isn’t displayed.

Method 2: Save as…

chrome_QtFP3MgAIk

After double-clicking on the LUT Viewer.html file, I get this:

chrome_RjXqar5lH0

  • The Image link works correctly, but the icon (chrome_CGhfW1XFyz) is not displayed
  • The LUTs link doesn’t work and none of the icons or buttons are displayed.

So… where did I go wrong? :thinking:

Give me 10 minutes and I’ll see if I can sort it.

1 Like

OK I’ve put a new version up on the website that you can download (Use View Page Source and copy to a ,html file) and then use offline. I had to include a minified version of jQuery and a data URL pf the color-cube rather than the PNG file.

I’m working on a fast GPU version now.

1 Like