blog name !! important

make sure you fill out the blog name field, this is what will show on the top of all your original posts. to clarify: your blog name is your blog’s url - for example: phantomcodes

responsive sidebar

when the browser window gets too small the sidebar(s) will disappear and become toggleable, the sidebar toggle button will appear on the right side of the headerbar next to the day/night button

faq popup

the faq menu has your blog’s ask box and has a default of 5 questions, however if you want you can add unlimited questions - it will scroll

explore popup

the explore menu has a search bar and allows for unlimited links with optional section titles

sidebars

the navigate, events, and updates boxes are on the right sidebar by default, if you only want one sidebar and still want these boxes you will need to move them to the left sidebar

if you want to move sidebar boxes around please see the customization guide!

status box

the sstatus box has up to 4 statuses that can be on or off

info box

the info box has up to 4 info stats and an optional disclaimer section

navigate box

the navigate box has up to 6 links

events box

the events box has up to 2 events each with an optional image, title, and description

members box

the members box will automatically fill with the members of the blog, you can manually edit the members if you want (see the customization guide)

affiliates box

the affiliates box has up to 10 affiliates and a link to the submit box - more affiliates can be added (see the customization guide)

updates box

the updates box has up to 6 updates each with an icon and text

general notes

many things will not show up if they’re left empty, for example: if you don’t want the disclaimer leave the disclaimer field blank, etc.

reminders

remember tumblr’s customize panel is buggy, toggle the options on/off before saving. similarly some things will not appear in the customize panel preview, for example: autofilled members, jumpination

Download your video.

firstly, start by downloading your video with 4k video downloader. (<- this will lead directly to a dl of 4k video downloader if you don't have it already! link is all safe and official <3) i can't really think of any other downloader because i haven't used any apart from this one. it's safe and secure and does a really good job.

you'll want to choose the 1080p option that is the BIGGER file amount. not every video will have that, but i believe that the bigger file size is the youtube premium 1080p. take what you can get with them 😭

2. Load frames, crop, convert to smart object...

just get your normal prep work done! make sure to leave out sharpening. you should essentially just be here:

(if my process looks a bit odd or if, on the other hand, you'd like to know my process, you can check that here.)

3. sharpening.

THIS is the point that changes how your youtube file comes out. often times, you'll find the gif comes out with chunks, squares and overall poor quality. kind of like if i used my regular sharpening:

chunky! gross! trashy! i'm seeing too many pixels and things aren't looking the right way that i'd like. (tbh, it's not the worst i've seen - but you can definitely notice when there's light.) if i went on as it is now and continued to colour it, it would continue to look bad.

so, here's what you'll do.

i use multiple sharpening actions, for different purposes: one for hq downloads, so any movies, tv or downloaded/4k music videos, one making icons and the other for lower quality media and photos. the one that i typically use for youtube quality is @/anyataylorjoy's sharpening action (which many gifmakers use, so i wouldn't be surprised if you do already have it!) which is what you'll use. apply the action, using the 'sharper' lot.

^ that's the settings.

4. sharpening pt 2. (noise)

now, you'll need to add noise to offset how harsh the rest of the gif still comes up.

apply these exact settings onto the gif and ensure that monochromatic is enabled.

sometimes, 2% noise might make it look worse, or not be enough. i personally wouldn't go to anything more than 3%, (i don't think you'll ever want to use 3%) and wouldn't go lower than 1%.

it's grainy looking at the moment, just as is. from here, i'll colour it, and then if i think it's no good, i'll go back and clear the noise filter and toggle it. that's just how the process works, don't stress if it doesn't always go your way 😭 that's just gifmaking!

here's the final product!

and here's another example too, i know this one has a lot going on colour wise, so it can be good to look at it working on something with less bright colours:

as compared to before! before shows the gif was really smooth, as compared to in chappell's, were the lighting was just kind of messing with everything. you're more likely to come across videos that are that weird smooth quality, so i'd say that 7 times out of 10 you'll be applying these settings to something more along the lines of doechii's!

this is my first theme in over a year (wtf) so please be patient as i'm still learning to navigate the new npf stuff!! i'm still on a sort of semi-hiatus, i'll be around for questions but please check my faq, answered asks, etc. before asking - i will not answer repeated questions!

blog name !! important

make sure you fill out the blog name field, this is what will show on the top of all your original posts. to clarify: your blog name is your blog’s url - for example: phantomcodes

responsive sidebar

when the browser window gets too small the sidebar will disappear and become toggleable, the sidebar toggle button will appear on the right side of the header

reminders

theme 3 - hiss by @gloriapritchetts ♡

previews

static

features

540px posts

optional border radius

gradient backgrounds

seven links

updates tab

“about me” and “dni” section

notes

sidebar image sized at 200x200px

for the fonts, you can use: quicksand, varela round, karla, nunito, lato, poppins, montserrat and roboto (along with other default fonts)

credits are listed in the code. thanks your help!

please like/reblog if you think this theme is cute :)

message me if you have any issues or questions

tips ☕️ code 📝

theme 4 - cobra by @gloriapritchetts ♡

previews

static

features

540px posts

optional border radius

gradient backgrounds

seven links

updates tab

“about me” section

notes

sidebar icon sized at 100x100px

sidebar header sized at 375x100px

for the fonts, you can use: quicksand, varela round, karla, nunito, lato, poppins, montserrat and roboto (along with other default fonts)

credits are listed in the code. thanks your help!

please like/reblog if you think this theme is cute :)

message me if you have any issues or questions

PHASE 1: THE GIFS

1.1 – Determine how many frames you need. Since you need at least 2 scenes for a transition, consider limiting the amount of frames you'll use per scene. For a transition between 2 scenes that's 540x540px, I would recommend no more than 30 frames per scene (for a final gif that's 60 frames). Even that may be pushing it depending on your coloring. Just be sure to consider the dimensions and colors of your gifs in relation to the amount of frames to keep your final gif under Tumblr's 10MB limit.

1.2 – Import frames, crop, resize, convert to smart object for Video Timeline, color, blend, etc. Do this as you normally would! If you need a tutorial for the basics, here's my tutorial. :) Please note, the methods in this tutorial only work with gifs that are converted into smart objects in the Video Timeline workspace.

Tip A: I recommend using scenes where there's a lot of one color (or scenes where you can manipulate it to look like that). The crystallize filter on a gif creates A LOT of movement that can feel a bit chaotic. Having your gif be primarily one color reduces the eye strain a bit imo.

Tip B: I like how this effect looks with blended scenes because it allows me to use different "crystal" sizes (more on this in Step 2.2). Check out the USERGIF Resource Directory for plenty of blending tutorials!

1.3 – Move all your gifs into one document, group into folders, and arrange. Once everything's in one doc, keep everything organized in a group folder! I have just two scenes, so that's Folder 1 & 2. Within those folders are the gifs I blended, which I labeled by gif color. Then, simply drag Folder 2 so it continues right after Folder 1. (Make sure none of your adjustment layers from Folder 2 accidentally affect Folder 1! You can do this by clipping your adjustment layers to match the length of the gif as I did, or using clipping masks.)

(Ignore that lone Hue/Saturation layer lol. I decided last-minute that I wanted my gif to lean more pink than red.)

PHASE 2: THE FILTERS

2.1 – Duplicate each scene. We're going to use opacity keyframe animations on these duplicated scenes that allow it to go from "normal" to "effect" and vice versa. The filters will only be applied to the duplicates. In the screenshot below, all of my duplicates are highlighted:

2.2 – Apply the Crystallize Filter. Above your sharpening settings, apply this filter by going to Filter → Pixelate → Crystallize. On the pink gifs, I made the crystals bigger (cell size: 45), and on the black and white gifs, I did a cell size of 25.

The different sizes help break up the uniformity of the crystals imo, creating more of a mosaic-like look, which is what I wanted to match my gifset concept.

2.3 – Apply the Oil Paint Filter (Optional). Filter > Stylize > Oil Paint. Here are my settings (they're the same for both crystal cell sizes):

Brush – Stylization: 0.1, Cleanliness: 8.6, Scale: 0.1, Bristle Detail: 0.3 Lighting – Angle: -60, Shine: 0.7

This filter helps soften the cells a bit while adding some texture (left: no oil paint; right: with oil paint):

2.4 – Repeat steps 2.2 & 2.3 on all duplicated scenes.

PHASE 3: THE KEYFRAMES

3.1 – Add opacity keyframes. The very start and end of each scene needs an opacity keyframe set to 100% opacity. Move 0.09 seconds from each of those points, and place another opacity keyframe, this time set to 0% opacity. We're basically making the crystals fade in and out. Please reference the screenshot below for keyframe placement:

If you need more info on opacity keyframes, check out Phase 2 from this fade transition tutorial I did on usergif.

3.2 – Repeat step 3.1 on all duplicated scenes. All the keyframes in Folder 1 should line up exactly and all the keyframes in Folder 2 should line up exactly!

PHASE 4: THE DUPLICATES

4.1 – Convert back to Frame Animation. If you're not sure how to do this, I've written out the steps here. I rec the action linked in my general gif tutorial which I shared earlier!

4.2 – Delete duplicate frames. Whenever you use keyframe animations, you'll get duplicate frames. That's just how it works, unfortunately. If you follow my steps exactly (specifically the 0.09-second spacing, which follows my tried-and-true 0.03-second rule), you'll have a total of 12 duplicate frames exactly — 3 duplicates per keyframe section. Just manually delete them! You can spot the duplicates by eye, but with this spacing, it's usually the 2nd, 5th, and 8th frame for each transition section. The selected frames below were my duplicates:

If you want to learn more about why there are duplicates and the math behind it all, I explained it in more detail in this ask.

4.3 – Export and you're done!