#m:tutorial

programs:

if you already have photoshop / your giffing program installed and set up, go ahead. if you don't, i would recommend looking here to get photoshop. please make sure you follow instructions carefully and safely! i do know photopea is an alternative people use, and i'm sure there are others. i unfortunately don't know any tutorials to link and probably won't be much help in regards to those programs, but i'm sure there are some floating around on tumblr!

my gif process uses photoshop, so this tutorial assumes that as well. if you use a different one, you might be able to transfer this to what you use, i'm not really sure :(

additional tools and programs: - handbrake: upscaler, found here. i make my own settings and generally only use this on lower quality sources to give vapoursynth a better chance with encoding in higher quality. - davinci resolve: a program i use to make clips appear 60fps when they are choppy or too few frames for the gif to look nice, and occasionally to do pre-photoshop coloring! i use the free version. i do not use this all the time and it is a big program, so definitely don't get it if you think you'd forget to / not want to use it. - yt-dlp: open source, downloads pretty much any file i could want quite well. i use this for most of my downloads and for subtitles as well. does require some knowledge of code, or, at the very least, willingness to troubleshoot set-up. find it here! i can share the command lines i run for: video, audio, vid + sub. - 4k+ downloader: what most people use for youtube-source sets, i believe. you have a limited number of downloads per day on the free version, thus the other downloading programs. - jdownloader2: no limit but sometimes a little slow or will refuse to download because of not being logged into an account, etc. a good download alternative if you plan on downloading a lot and yt-dlp is too much. - vlc: free program, standard on some devices, good for viewing files. - mpv: excellent file viewing, can also deinterlace and screencap (if you do not have / use vapoursynth) - vapoursynth: mac users beware, it's not optimized or set up and is a huge headache. windows users, once you get it set up, it's golden.

finding files, what to look for, and how to use them: how to use is explained here, with a focus on smooth and nice speeds! but finding the file is the first step, so let's head there.

stages: k24hrs (invite only, feel free to private dm or send an ask off anon for a file - i will do my best to get it to you); kpopbuzzhub; sharing korea torrent (requires a torrent app); twitter (shrghkqud (only has recent files) and a few other uploaders, requires much more active searching). there are a few other places you can look, but it is often more trouble than it is worth (or costs $). i am also always willing to help people find materials, so you can ask me to help you look for something or to link a source i used for whatever set.

music videos: also sometimes on k24hrs. i use vimeo a lot (color graders, directors, etc., will upload clearer versions). sharemania.us has some kpop mvs, typically bigger groups (i.e. blackpink). this is a place i check for ggs. and if none of these places or searching for torrents on btdigg, or on google in korean works, i just download the highest quality setting from youtube.

other types: like vlogs and fancams, normally directly downloaded from youtube, instagram, or twitter using yt-dlp or sites specifically for the app (i.e. twittervideodownloader).

what do i look for? 1080i for stages (or 1080p) are often super nice as they're a .ts. 2160p/4k is often ideal, but it also depends on your computer and what you are comfortable working with! generally - not always due to ai upscale - a bigger file size (in the gbs, high mbs like 800) is better and has more detail that will look clear when you work on it. older stages (2nd gen and before, some 3rd gen) and music videos often always are lower quality due to camera quality, and much harder to find. if you have to use the youtube upload for a stage, it is definitely doable, but it may be slightly disappointing in the quality you want to achieve. it depends on what you're comfortable posting and making!

how do i use them? if you use vapoursynth, scenedetect (encode/process whole video) or timestamp (just a small clip) your file - if upscaling, using davinci resolve, or any other pre-processing, do that first. it will pull up a resizer and a program and once you encode, it will give you an output file using the size and settings you put. this will import to photoshop. if using mpv or another screencapping method, take your screencaps (again, all pre-processing first) and prepare to import. there are two ways to do that for screencaps. you can also just watch whatever you downloaded, i'm guilty of downloading concert files just for fun 😅

in the next sections, i will be using four different files of varying quality and sources to explain my steps. hopefully that is helpful!

example file 1 (4k and 60fps, obtained using yt-dlp) example file 2 (1080i, obtained from k24hrs) example file 3 (1080p HD, obtained using yt-dlp) example file 4 (pulled from the gg archive i use, master)

importing to photoshop (vapoursynth and mpv explained): using example file 1, i am processing in vapoursynth - i always do one extra second before and after the clip i actually want so it doesn't cut off any frames i'd like. i adjust my sizes based on what works best for tumblr (540px for wide, 268px for 2 column, and 178 for 3 column). i always use finesharp 1.5 (this setting is up to you! i used to use .7, so totally ok if it changes over time, too!) when you export in vapoursynth, you need the y4m header. i use export to mov preset.

when importing to photoshop using a video (so vapoursynth, video files, not screencaps):

i recommend making your selected range a little bigger than the frames you want so they don't accidentally not get included. delete any extra frames while in the frame animation and then turn it into video timeline. i turn all my layers into a smart object (select them all by clicking the bottom layer and then shift-clicking the top one, or use (on windows) ctrl + alt + a to have it select faster). set timeline framerate (if you want to, i always use 60).

now your smart object is ready to sharpen and color!

using example file 2, i am processing mpv - i hit 'd' until deinterlace is on 'auto'. find the clip you'd like and hit your screencap shortcut (alt+s) for me - your screencaps should be super clear, it depends on how you set up your software (if mpv, what compression you told it). screencaps can take up a ton of storage so i recommend only screencapping what you need and deleting them after. when you hit your shortcut, play the file to the end of the clip you went and hit the screencap shortcut again to stop. your frames should be in the folder you designated as pngs now. delete extra frames now!

you now have two options: import as is, which can be a little slow, or turn them into dicom files. importing as is is done through stack. it will prompt you to select what is being loaded - change Use: to folder, and let it process. it will be slow. hit ok when the file list updates.

when it is done loading: create frame animation -> make frames from layers -> reverse frames. i would crop now using the crop tool for processing speed, and then proceed to do video timeline, smart object, and frame rate. when cropping: on the top, above your document names, the second image should show up on the crop tool - this can set your dimensions. i zoom and crop screencaps using this.

the other option is DICOM files, and what i use. when you have your pngs, do alt + d in the folder (windows), type cmd, and run this command: ren *.* *.dcm. press enter. it will update the files. on macOs, just rename the file type to .dcm.

then, import as so (it will prompt you to select the folder your .dcm are in, and will not work if the files are not actually DICOM). i find it much faster than the stack import. crop when it is done importing for processing time, like the other screencap import style.

create frame animation -> make frames from layers -> video timeline -> smart object from layers -> 60 fps.

photoshop shortcuts and actions: (windows) - ctrl + alt + a: select all layers - ctrl + shift + alt + w: export as image - ctrl + alt + shift + s: save for web (legacy) - this is the gif one!

actions are imported or created, i've shared my sharpening ones before. there are plenty you can find (or make) for a variety of things, such as aligning objects to a fixed position on all docs, doing the screencap reverse and import for you, etc. they are imported using load actions - select the [downloaded] .atn file and it'll pop up.

sharpening: explained here, and has my actions (feel free to use). very important to the quality and clarity of the gif. the better the file, the clearer a gif looks, sharpening can only do so much. play around during this step!

coloring: very much the most personal taste stage of giffing. i explain my process here. in kpop giffing, we tend to focus on unwhitewashing. other giffing tends to be more aesthetic tastes and fun since the source has better colors to work with.

export settings: these are what i use! you need the 256 colors. i do not recommend lossy or interlaced. i think bicubic sharper is the clearest i have tried.

posting on tumblr: use these dimensions FOR GIFS. edits can be different. height is up to you - i would not go over 800, but i think my quality looks weird past 600 range anyways.

example gifs: yeji, from example file #1, imported using vs. uses no. 1 sharpening (altered) from my pack. colored. zhanghao, from example file #2, imported using mpv and the load via stack. uses no. 4 sharpening (altered) from my pack. colored. taeyeon, from example file #3, imported using mpv and the load via dicom. uses no. 1 sharpening from my pack. colored. eunbi, from example file #4, imported using vs. uses no. 2 sharpening from my pack. colored.

so i get a lot of comments about how i paint from big blobs to essentially finished paintings. here’s the thing: that’s exactly what i’m doing.

in more formal terms, mapping down general areas is my way of breaking up the monotonous space that is the canvas, and it also sets up the initial color palette and tone that drives the rest of the painting (color is a beast of its own topic though, so i’m going to focus more on form itself here).

a blank canvas can be extremely overwhelming if you think too much about the details first, and doing this breaks the canvas down into smaller, more manageable areas 

what you see in the images above is an exercise i was taught (shout out to my high school art teacher) that helps you start seeing how simple forms eventually build into complex shapes. basically you take the image you want to paint, and blur it at various stages. then, you paint from the blurred images, eventually getting sharper and sharper until you have all the detail you want. i think 4 is a nice number of image “stages” but obviously you can do more (wouldn’t suggest going below 3 though that’s literally just having a blurred image and then a not blurred image)

with the image blurred, you are forced to ignore minor details that honestly shouldn’t be considered until you have the underlying proportions already mapped out

by painting down blobs that generally lay out where certain things are supposed to be (e.g. the head, the hair, the body), it first of all helps get your proportions laid out. it doesn’t need to be perfect; you just need some guidelines on approximately how one part of the body is sized relative to another. and then within each “blob” you can further break it down into even smaller areas, e.g. for the head generally where the eyes, nose, and mouth should go. 

everyone is different, but to me this is more effective at accurately mapping proportions than using guidelines and sketches. of course you can use general rules like  “well the head is supposed to be 5 eyes wide” or “the body is in general seven and a half heads tall” or what have you but personally i find those kinds of rules inflexible and it’s easier for me to see things for what they are: shapes.

i often think in terms of “well there is about this much shadow between the eye and the nose” when placing my blobs down

i’ve seen too many artists who, for example, only focus on the head to start off and then struggle getting the proportions together for the rest of the body because 1) they didn’t map it out first and 2) since they already “finished” the head they don’t want to “mess” with it and the rest of the painting is forced to conform around the positioning of the only part you’ve completed.

another example is the sentiment a lot of beginning artists have where you “draw really one good eye but can’t draw the other”. this is because if you focus too much on one eye from the get-go, the other eye is forced to complement the eye you’ve already drawn, rather than exist as the other half of a whole

1. Select your layers, coloring and everything.

2. Convert all to smart object.

3. and then duplicate the smart object layer.

4. Lastly, use the rectangular marquee tool and select the area you want to blur on the duplicated layer so that you can adjust the layers that u want to blur on the timeline. Then, blur them using your setting or you can just follow mine below.

and……….. THAT’S IT! :) Hope it helps. 😘

BEFORE ☟

AFTER ☟

I’m using a 2 sec clip from a video and imported all the video frames to layers which resulted in 127 frames, I deleted the last 7 to make it under the 3mb limit. For sizes I follow this (this gif is 268px by 170px)

Ok, so after sharpening I use curves: 

then levels:

then selective color to black:

in the same selective color layer I go to yellow:

then vibrance:

then brightness/contrast