#pstutorial*

[yibo-wang]

Can you please make a gif sharpening tutorial? Or link us to a sharpening tutorial ? *hopeful face*

Hello! sure thing!

okay before importing almost all of my gifs in photoshop, I run the clips through vapoursynth first (you can find that here). I'm going to divide this tutorial into two parts; one with vps and one without vps

SHARPENING WITH VPS:

you can find the vps process here. the settings for mine are

Denoise > KLMN > 1.5 - 2.0

Finesharp > 1.5- 2.5

some ccs like to only sharpen on vps which is fine but I like to sharpen them a bit on ps too.

So after importing your clip in PS convert the layers into smart object. (select all > filter > convert to smart filters)

Apply the smart sharpen filter (filter > sharpen > smart sharpen)

my settings are:

amount: 100

radius: 0.3

no gaussian blur cause denoise pretty much does that job

And that's it for this one!

SHARPENING WITHOUT VPS:

You're going to import your clip the same as you always do and convert the layers into smart object just like above (select all > filter > convert to smart filter)

Apply smart sharpen to the layer (filter > sharpen > smart sharpen)

my settings are:

amount: 500

radius: 0.5

reduce noise: 75-100

gaussian blur: 0.3

Now duplicate this layer and change the opacity of the layer on top to your liking.

And that’s it! hope that made sense, but if anything’s not clear feel free to ask! 

[yibo-wang]

⺌ ⺌ ⺌ light on me icons  ⺌ ⺌ ⺌

200x200 (without the white bg)

like/reblog if you save

tutorial under the cut

@kobsessed here you go! 

step 1: open your image in photoshop (i usually use those with a solid color background cause it’s helpful later on) but it’s not necessary. next is to adjust the coloring of the image and crop it to the size i want.

step 2: use the quick selection tool to select the object and the go to select inverse so that the background is selected. 

step 3: add another layer and color your background using a brush/pain bucket. 

step 4: covert everything to a smart object and on another layer make a circle using the shape tool (press shift while using the elliptical tool to get the uniform look). size is usually 200x200

step 5: move your icon image above the circle layer and on the menu bar above select layer>create clipping mask. your image should now be inside the circle.

step 6: to add the white dots, select your brush and go to brush settings (if it’s not available for you go to windows>brush settings and something like this should appear. 

step 7: change the brush spacing to how far you want your dots to be (these are mine) // alternatively you can just eyeball the distance you want using a normal brush. (the size of the brush used is 10px)

step 8: add another later on top and make white dots using the brush tool on top of the image and we’re done! 

I hope that helps!

[yibo-wang]

Hello! I was wondering how you make such beautiful gifs even when the quality of a video is not the best. I have tried everything, but i really don't know how, i would love your advice and would be very helpful, thanks for reading

Hii and thank you sm 💛 that means a lot!

I made this tutorial for gif sharpening a few days ago which is basically what I use for every gif.

Some things that I live by while giffing is using vapoursynth for sharpening. I'd recommend downloading it and following the tutorial for it because it's truly is game changer.

Another piece of advice is that try not to use videos that are below 720p. (Your go to should always be 1080p and above).

Coloring also makes a huge difference in how your gifs turn out at the end. So try not to change the base coloring too much otherwise the end result is very pixelated. For example changing red to green/blue will make it more pixelated than like changing red to yellow since the later two are closer in the color spectrum.

Increasing the blacks (in the selective color layer) or increasing contrast with the brighten-contrast tool.

Do not brighten dark scenes too much. Cause again, changing from darker pixels to lighter ones costs you the sharpness at the end.

For different gifs try using different export settings. My go to is selective diffusion or adaptive diffusion depending on what looks best for them.

Tumblr has specific dimensions for gifs. Gifs that don't follow these usually get reduced or expanded depending on their dimensions which lowers the quality. Here is the guideline:

You can change the height to whatever you want but the width should be one of these depending on how many gifs per row.

Hope these are helpful! lmk if anythings not clear.

[yibo-wang]

RULES: When your work is tagged, show the process of its creation from planning to posting, then tag 5 people with a specific link to one of their creative works you’d like to see the process of. Use the tag #showyourprocess so we can find yours!

i was tagged to show this , this  and this one by @suibianjie​ @cherryysundae​ @fengqing​ @wangxianbunnydoodles​​ and @still-snowing​​. 

it was really nice seeing the similarities and differences in everyone’s processes and i’m truly in awe with all of yours creations (*˘︶˘*).｡.:*♡ and ali i really enjoyed reading your art process! it’s was so interesting and your art is wonderful!

(special thanks to @lan-xichens​ @suibianjie, @highwarlockkareena, @nyx4, @aheartfullofjolllly for organizing this (´｡• ᵕ •｡`) ♡ you all are amazing!)

[I didn’t have the psds saved so I had to remake them but as far as i remember this is how I made the original ones too since my process hasn’t changed a lot since then.]

Planning

Surprisingly all three of the above gifsets were part of my the untamed x color series so not a lot of thought was put into the panning since the scene or characters were already chosen for me. 

If a scene isn’t specified like the last two I go through the episodes or clips to pick out the scenes i want to gif or those which would look good based on the general theme of the set.

(this is a part of the cql folder where i’ve clipped out the major/ defining scenes. please excuse the ridiculous names asjjsd it helps me remember what they contain)

Creating

For this tutorial/process I’ll explain the wangxian in purple one in detail and then go over the other two briefly since it’s almost the same process.

So I selected the exchange between wangxian where wwx’s talking about helping out with the yin iron and imported it.

Then I converted to timeline before converting the layers to smart filter. After this I start my base coloring process which is just messing around with the curve and selective color layer until i get the skin tones accurate and the over all, the gif more brighter.

Now since the request called for purple/indigo I added another selective color layer and the adjusted the cyan and blue options under it to make it purple instead. **what i usually is that I adjust the colors slightly in one layer and then adjust a little more after adding another layer. 

it resulted in three more layer (which sometimes get adjusted even in the end if it looks like it needs more tinkering.

Overlay:

The hunt for overlay usually takes the longest unless I don’t already have it saved. I was just going through my folder when I realized it might look good with this. So I opened, cropped and resized the snow gif and then after converting it to smart filter duplicated it onto the lwj gif.

I play around with the blending options (for this one I used color dodge) and since this doesn’t obstruct the main gif I only used the layer mask for lwj’s face after decreasing the opacity like this.

Then after adding my watermark I finally convert everything to smart filter again, then smart sharpen my gifs (using the settings 0.5) and adding gaussian blur (setting it to 0.3) before exporting it and saving for the web.  

Here’s the finished result as compared to the original.

Posting

Like Monica I can’t keep gifs in my draft more then a day (and that too is a stretch lmao, the itch to post is real sjdjdsj). So i either queue it for the next day day if its getting really late or just post it right away. I don’t save any psds unless I really like the coloring of it and even that gets deleted after a week. (the only gifs that get saved occasionally are gfxs for future reference).

2- Coloring for Wangxian x Rainbow

For the rainbow series, I had to make a list of all the scenes I wanted to add ( i wanted to include all the landscape/scenic ones with wangxian so that involved going through a lot of episodes). The whole process is nearly the same apart from the coloring which required more selective color layers and masking (i forgot to save the picture after applying the masking in this one, oops!)

@wangxianbunnydoodles​​ Hao I’m sorry I couldn’t do a separate one for the xue yang post cause I was in a rush, but I’ll definitely try to do that in the future

Tagging:

@manhasetardis​ with this one (it’s definitely my favourite one! the way your coloring is always so consistent and just this concept! i love it

@wei-gege​ and this one (your glitter series and their coloring is so wonderful, i always look forward to them on the character birthday events)

@xiaodaozhang​ and this one! Eva I love each one of these so much! the masking the text style!

@petekaos​ and this set (rahul i don’t even go here but the coloring in this is so gorgeous I couldn’t stop looking)

@veronaprincess​ and this wangxian lotus lake date one! i adore the coloring.

@kaonoppakao​​ and this one! it’s so pretty!

no pressure though (´｡• ᵕ •｡`) ♡

[yibo-wang]

yoooo aamna i just saw this post of yours and i am amazed at how smooth your gifs are 😍 (obvs also at your coloring cause it's breathtaking!). would you mind sharing your sharpening/blurring technique? 🥺👉👈

Ali! Hii! sure thing. I use vapoursynth for sharpening before going into PS but I'm still in the messing around phase with it. These days I'm using KNLM at (1.5) and Fine Sharp (somewhere between 2.0-2.5) depending on what looks better)

After coloring in photoshop I smart sharpen them (0.3 and remove gaussian blur). I duplicate the layer and use gaussian blur (0.3) and change the opacity to 35-45%.

If I dont use vps I follow the same ps settings just add another smart sharpen effect with the gaussian blur layer.

Hope that's helpful!

Edit* also forgot to say this earlier cause I was a bit distracted but thank you 💛 It means a lot!

[yibo-wang]

Hi, hope you don't mind me asking, I was wondering how you got the emojis in your "the untamed character as tumblr bots" gifset?

Hi! no problem, I used the pre-installed EmojiOne font in PS.

All you have to do is click on the text tool and then use the glyph option to select whichever emoji you want by double clicking it.

[yibo-wang]

Hello, I am the anon of the gifs depending on the quality of the video, thanks, the images on the appropriate size of the gifs helped me a lot.

I wanted to ask you how you place the yellow subtitle letters in the gifs, what kind of letters do you use and how exactly are they placed, thanks for reading me

hi! I'm glad it was helpful! I couldn't make a tutorial myself but these two tutorial (1 2) cover everything about gif captions and text addition. lmk if there are any queries.