Automated commit

2 files changed, 648 insertions, 0 deletions

diff --git a/2024/captions/emacsconf-2024-theme--my-journey-of-finding-and-creating-the-perfect-emacs-theme--metrowind--main--chapters.vtt b/2024/captions/emacsconf-2024-theme--my-journey-of-finding-and-creating-the-perfect-emacs-theme--metrowind--main--chapters.vtt
new file mode 100644
index 00000000..51441945
--- /dev/null
+++ b/2024/captions/emacsconf-2024-theme--my-journey-of-finding-and-creating-the-perfect-emacs-theme--metrowind--main--chapters.vtt
@@ -0,0 +1,29 @@
+WEBVTT
+
+
+00:00:02.140 --> 00:00:47.560
+Introduction
+
+00:00:48.820 --> 00:01:14.470
+Deviant
+
+00:01:15.640 --> 00:02:50.320
+FlucUI
+
+00:02:51.910 --> 00:05:23.440
+Lab
+
+00:05:25.090 --> 00:06:13.930
+NotInk: grayscale
+
+00:06:13.930 --> 00:06:48.580
+Random theme
+
+00:06:50.020 --> 00:07:18.370
+Monte Carlo
+
+00:07:19.780 --> 00:08:10.870
+How to pick a random color palette
+
+00:08:12.070 --> 00:11:23.540
+XYZ
diff --git a/2024/captions/emacsconf-2024-theme--my-journey-of-finding-and-creating-the-perfect-emacs-theme--metrowind--main.vtt b/2024/captions/emacsconf-2024-theme--my-journey-of-finding-and-creating-the-perfect-emacs-theme--metrowind--main.vtt
new file mode 100644
index 00000000..3f132c9a
--- /dev/null
+++ b/2024/captions/emacsconf-2024-theme--my-journey-of-finding-and-creating-the-perfect-emacs-theme--metrowind--main.vtt
@@ -0,0 +1,619 @@
+WEBVTT captioned by MetroWind
+
+NOTE Introduction
+
+00:02.140 --> 00:05.440
+Hi my name is MetroWind.
+
+00:05.440 --> 00:12.910
+In this talk I will take you through my journey into Emacs themes.
+
+00:12.970 --> 00:15.730
+I am a long-time Emacs user. I started using
+
+00:15.760 --> 00:17.770
+Emacs since version 21.
+
+00:19.090 --> 00:22.960
+The goal of this talk is to inspire more people into making themes.
+
+00:24.070 --> 00:26.350
+Maybe you are already making themes.
+
+00:26.350 --> 00:29.410
+In that case I hope you could find some tips and tricks
+
+00:30.550 --> 00:33.670
+you know in this one
+
+00:33.670 --> 00:36.070
+I will basically go through all the themes
+
+00:36.130 --> 00:36.910
+that I created.
+
+00:37.960 --> 00:40.000
+But I think the most important thing
+
+00:40.000 --> 00:42.910
+here is to understand why some of
+
+00:42.910 --> 00:44.620
+the some of the colors are picked,
+
+00:44.860 --> 00:47.560
+and the motivations behind them.
+
+NOTE Deviant
+
+00:48.820 --> 00:50.800
+So the first theme I created is
+
+00:50.800 --> 00:54.190
+called Deviant. It looks like this.
+
+00:55.810 --> 00:57.730
+The inspiration for this one is a
+
+00:57.730 --> 01:00.820
+website called DeviantArt. Basically I just
+
+01:00.850 --> 01:03.580
+use their color palette, you know, from their design.
+
+01:04.810 --> 01:10.750
+It was a like a community for indie artists.
+
+01:10.750 --> 01:12.820
+I was really into that, you know,
+
+01:12.820 --> 01:14.470
+back in the day so that’s that.
+
+NOTE FlucUI
+
+01:15.640 --> 01:19.090
+Otherwise, nothing special. The next theme
+
+01:19.120 --> 01:21.220
+I created was called FlucUI
+
+01:24.820 --> 01:25.630
+It’s in MELPA.
+
+01:26.530 --> 01:27.640
+And let me just show you.
+
+01:35.260 --> 01:37.600
+So yeah that's how it looks like.
+
+01:42.280 --> 01:45.250
+So... but where where did the colors
+
+01:45.250 --> 01:49.060
+come from, right? To understand that,
+
+01:50.290 --> 01:55.270
+I'll need to take you back in time, you know, to where iOS 7
+
+01:55.330 --> 01:58.000
+was released by Apple. That was a
+
+01:58.000 --> 02:01.900
+big deal, because that popularized the idea
+
+02:01.930 --> 02:05.290
+of flat UI color designs; sorry, flat UI
+
+02:05.290 --> 02:10.360
+designs. And after that, everybody followed suit,
+
+02:10.360 --> 02:14.440
+and changed their design, you know
+
+02:14.440 --> 02:22.420
+of all of their websites and applications to use some sort of flat UI design concepts.
+
+02:23.470 --> 02:27.550
+And about the same time, there came a website called flatuicolors.com.
+
+02:28.720 --> 02:30.820
+It hosted one color palette,
+
+02:32.110 --> 02:34.030
+and that was really good!
+
+02:35.110 --> 02:39.490
+So I picked that as the basis of my theme.
+
+02:40.900 --> 02:43.959
+And initially I named it FlatUI,
+
+02:43.959 --> 02:46.717
+But that name was taken in MELPA
+
+02:46.717 --> 02:50.320
+So i just rename it to something random, FlucUI.
+
+NOTE Lab
+
+02:51.910 --> 02:55.060
+The next one is called lab.
+
+02:57.310 --> 03:00.340
+To understand why I needed to create the theme,
+
+03:03.850 --> 03:08.620
+it's because I thought some of the colors in FlucUI
+
+03:10.780 --> 03:15.250
+was standing out too much, like the green here.
+
+03:18.010 --> 03:18.640
+This one.
+
+03:20.170 --> 03:22.090
+I thought this was too bright.
+
+03:22.780 --> 03:26.050
+Just a little bit.
+
+03:27.100 --> 03:30.100
+So I thought I needed way to pick
+
+03:30.100 --> 03:32.890
+some colors that are about the same
+
+03:32.890 --> 03:35.350
+lightness essentially. So how would I do that?
+
+03:35.350 --> 03:42.370
+The answer is to go into a color space called LAB.
+
+03:42.880 --> 03:45.130
+Now normally you'd do color work in RGB,
+
+03:46.420 --> 03:49.300
+which is red, green, and blue.
+
+03:49.660 --> 03:52.420
+It doesn't tell you a lot about lightness.
+
+03:53.830 --> 03:56.440
+If you do a pure blue,
+
+03:56.440 --> 03:58.600
+it actually looks a lot darker than a
+
+03:58.600 --> 04:01.510
+pure red or pure green. So that
+
+04:01.631 --> 04:04.990
+that doesn't work. But in LAB,
+
+04:04.990 --> 04:07.120
+thing are different, because one of the channel
+
+04:07.360 --> 04:10.810
+is L which is lightness. The other
+
+04:10.810 --> 04:13.600
+two channels are a and b, which are just
+
+04:13.750 --> 04:17.140
+for colors. This is great because
+
+04:17.140 --> 04:19.630
+I could just fix L meaning
+
+04:19.630 --> 04:21.790
+I fixed the lightness, and then I can
+
+04:21.790 --> 04:25.300
+vary a and b however I want.
+
+04:25.300 --> 04:27.850
+The color will stay roughly in the same
+
+04:27.850 --> 04:30.310
+lightness, which is exactly what I wanted.
+
+04:31.780 --> 04:34.210
+So for that I created a
+
+04:34.210 --> 04:38.230
+Mac app, where I could just
+
+04:38.230 --> 04:40.330
+fix lightness like I said, and then
+
+04:40.330 --> 04:42.550
+I could click on this colorful thing,
+
+04:42.670 --> 04:45.010
+to pick a color. The app will
+
+04:45.010 --> 04:47.950
+pick another five according to some pattern.
+
+04:48.430 --> 04:50.140
+And then I could just like hard-code
+
+04:50.140 --> 04:51.640
+these colors in Emacs.
+
+04:52.930 --> 04:54.160
+Let me show you.
+
+04:56.230 --> 04:58.000
+apply theme... lab...
+
+04:59.590 --> 05:02.110
+Yeah not very different from FlucUI colors,
+
+05:02.140 --> 05:04.300
+which was intentional.
+
+05:05.350 --> 05:08.200
+The idea here again is
+
+05:08.380 --> 05:10.660
+all the colors will be in about
+
+05:10.660 --> 05:13.570
+the same lightness, which I guess it was.
+
+05:14.230 --> 05:18.250
+So yeah... So this one was
+
+05:18.280 --> 05:20.830
+a success. I use it for a
+
+05:20.830 --> 05:23.440
+really long time. And then I got bored...
+
+NOTE NotInk: grayscale
+
+05:25.090 --> 05:28.150
+So I needed something interesting.
+
+05:28.150 --> 05:31.900
+The idea at the time was then to create a theme
+
+05:33.460 --> 05:36.310
+that doesn't have any colors essentially.
+
+05:36.310 --> 05:41.740
+A grayscale theme. So I called
+
+05:41.740 --> 05:44.830
+it NotInk. It is also in Melpa
+
+05:46.060 --> 05:46.960
+It looks like this.
+
+05:49.210 --> 05:50.650
+Yeah like I said, everything is grey.
+
+05:51.310 --> 05:53.530
+There's no color. But to my
+
+05:53.530 --> 05:56.500
+surprise, this is actually very useable.
+
+05:56.500 --> 05:59.500
+I didn't have any problem in readability;
+
+05:59.500 --> 06:02.170
+I didn't have any problem distinguishing, you know,
+
+06:02.170 --> 06:05.857
+different elements in the code. So a
+
+06:05.857 --> 06:09.460
+big surprise. And also a big success actually.
+
+06:10.720 --> 06:13.930
+And then I got bored.
+
+NOTE Random theme
+
+06:13.930 --> 06:16.360
+I just decided to install a whole bunch
+
+06:16.360 --> 06:17.710
+of themes from MELPA,
+
+06:18.310 --> 06:20.650
+and every time I start Emacs I
+
+06:20.650 --> 06:21.760
+just pick a random theme.
+
+06:23.200 --> 06:25.660
+There are some caveats to that,
+
+06:25.660 --> 06:27.280
+which I don't want to get into.
+
+06:28.660 --> 06:31.210
+But let me just show you.
+
+06:31.210 --> 06:33.130
+apply-random-theme, so it picked one for
+
+06:33.130 --> 06:37.030
+me. And then it picked another... another...
+
+06:37.060 --> 06:37.600
+So yeah.
+
+06:39.490 --> 06:42.340
+It's an interesting setup. I'm still using
+
+06:42.340 --> 06:45.010
+this setup today. Actually a good one
+
+06:46.150 --> 06:48.580
+Walls of text...
+
+NOTE Monte Carlo
+
+06:50.020 --> 06:52.240
+Now the final theme I want to look into,
+
+06:53.380 --> 06:55.750
+which is the latest, is called Monte Carlo.
+
+06:56.650 --> 06:59.110
+...which you know, idea here is to
+
+06:59.110 --> 07:01.947
+bring the idea of picking a random
+
+07:01.990 --> 07:05.620
+theme to the next level.
+
+07:05.620 --> 07:08.440
+So this is just one theme that generates
+
+07:08.470 --> 07:11.530
+a random color palette for me everytime.
+
+07:12.880 --> 07:15.400
+Not in MELPA, because I'm not ...
+
+07:15.419 --> 07:18.370
+I'm not completely satisfied with it.
+
+NOTE How to pick a random color palette
+
+07:19.780 --> 07:22.510
+But anyway... How do I... How do I pick
+
+07:22.540 --> 07:23.830
+a random color palette right?
+
+07:25.030 --> 07:29.680
+The answer is again to look at a different color space.
+
+07:29.680 --> 07:32.890
+This time it's called HLC, which is hue,
+
+07:32.950 --> 07:36.370
+lightness, and chroma. So hue is just
+
+07:36.670 --> 07:40.270
+colors, red, green, blue, or yellow, whatever.
+
+07:40.810 --> 07:44.200
+Lightness is lightness. Chroma is saturation,
+
+07:45.160 --> 07:47.800
+essentially. This is great because I could
+
+07:48.160 --> 07:52.150
+fix both lightness and saturation, and only
+
+07:52.150 --> 07:55.180
+vary in hue to pick my colors.
+
+07:57.580 --> 08:00.190
+Now the problem is
+
+08:01.660 --> 08:03.220
+once I have the color palette in
+
+08:03.250 --> 08:06.105
+HLC, how would I convert it to
+
+08:06.105 --> 08:09.250
+sRGB, because Emacs only knows
+
+08:09.250 --> 08:10.870
+about colors in sRGB.
+
+NOTE XYZ
+
+08:12.070 --> 08:14.230
+The answer here is to go through
+
+08:14.230 --> 08:16.450
+another color space called XYZ.
+
+08:17.950 --> 08:21.340
+This is an extremely important color space,
+
+08:21.670 --> 08:25.870
+because basically all other color spaces are
+
+08:25.870 --> 08:27.790
+defined on top of XYZ.
+
+08:28.930 --> 08:31.180
+So you would have like transformations
+
+08:31.180 --> 08:34.450
+from XYZ to all other
+
+08:34.480 --> 08:37.570
+color spaces. Now if you invert this
+
+08:37.750 --> 08:41.440
+these transformations, you could go from,
+
+08:41.440 --> 08:43.870
+for example, HLC back into XYZ
+
+08:43.900 --> 08:46.960
+and then go to another color
+
+08:46.960 --> 08:48.910
+space of your choosing, right.
+
+08:49.750 --> 08:51.400
+So this is how to convert colors
+
+08:51.430 --> 08:54.970
+between color spaces. In this case,
+
+08:55.270 --> 08:57.850
+I have to convert colors from HLC
+
+08:57.850 --> 08:59.920
+to LAB, and from LAB to XYZ,
+
+08:59.920 --> 09:02.530
+and from XYZ to sRGB.
+
+09:02.530 --> 09:05.710
+So this time the conversions are
+
+09:05.710 --> 09:08.200
+all done in Emacs Lisp, and I
+
+09:08.200 --> 09:13.270
+have the code in here in this URL.
+
+09:13.270 --> 09:14.830
+You could take a look, or you
+
+09:14.830 --> 09:17.350
+could actually just use maybe some package
+
+09:18.310 --> 09:19.390
+to convert colors.
+
+09:20.470 --> 09:23.740
+Anyway let me show you how
+
+09:23.740 --> 09:26.560
+this works. So in this case I
+
+09:26.590 --> 09:29.200
+could apply theme, Monte Carlo.
+
+09:30.670 --> 09:33.760
+So this is now a random theme.
+
+09:33.790 --> 09:36.730
+Actually, well, a theme with random colors,
+
+09:37.150 --> 09:39.580
+because I could apply the same theme,
+
+09:40.960 --> 09:41.920
+and it will look different.
+
+09:45.250 --> 09:45.790
+Every time.
+
+09:48.640 --> 09:52.060
+I could also look at the colors it picked.
+
+09:53.750 --> 09:55.100
+as a list of colors.
+
+09:57.740 --> 10:00.260
+I could also look at this like
+
+10:00.260 --> 10:04.370
+fancy chart of colors. This is
+
+10:04.370 --> 10:06.920
+too small. So let me show you this.
+
+10:06.920 --> 10:10.400
+So basically the same thing.
+
+10:10.400 --> 10:15.650
+This is actually a cross-section in HLC space,
+
+10:16.310 --> 10:18.650
+and the colors it picked are these like
+
+10:18.650 --> 10:19.520
+white circles.
+
+10:20.660 --> 10:23.060
+So that's that.
+
+10:24.740 --> 10:26.150
+But like I said, I'm not
+
+10:26.150 --> 10:30.170
+fully satisfied, because most of time the
+
+10:30.170 --> 10:32.540
+colors are pretty boring from it.
+
+10:33.770 --> 10:36.320
+I could think of some
+
+10:36.320 --> 10:38.570
+ways to improve this. For example I
+
+10:38.570 --> 10:43.485
+could choose different patterns for the color
+
+10:43.490 --> 10:47.540
+samples. but I don't know of any
+
+10:47.900 --> 10:49.880
+good patterns. So I need to try
+
+10:49.880 --> 10:52.130
+things out. And then another way is
+
+10:52.130 --> 10:59.960
+probably to use different color spaces like the HSL, or HSV.
+
+10:59.960 --> 11:01.100
+Again I need to try this out.
+
+11:02.240 --> 11:04.880
+So yeah there are room for improvements.
+
+11:05.120 --> 11:07.220
+If you... If you have and idea,
+
+11:07.520 --> 11:09.860
+you know, let me know, and we
+
+11:09.860 --> 11:10.580
+can try it out.
+
+11:11.960 --> 11:13.610
+So that's the end of my talk.
+
+11:13.880 --> 11:17.390
+Hopefully you have some new ideas.
+
+11:17.450 --> 11:20.240
+Thanks for listening in, and yeah.
+
+11:20.240 --> 11:22.400
+Go create more themes because we can't have enough.
+
+11:22.400 --> 11:23.540
+Thanks!