Discuss Scratch

LaughabIe
Scratcher
100+ posts

Setting line-join strokes to any style

For anyone who does not know what I’m talking about…

css-tricks.com wrote:

stroke-linejoin is a CSS property that defines how SVG paths should appear at the point where two lines are joined together. stroke-linejoin can be used to sharpen or soften the joints on connecting lines in an SVG.
Scratch’s vector costume editor supports at least three types of strokes: miter, round, and bevel as seen below.

Scratch uses miter as the default linejoin stroke presumably so stuff like squares look more sharp. My main issue having miter as the only option is that some stuff (especially text) have these things dubbed “vector thorns”, which causes spikes to stick out of the vector shape. This is most common with shapes having massive outline values. There are ways to circumvent this by editing the CSS of the file, but it’s way too tedious.

Having more stroke options to select from (specifically a drop-down menu) is useful not just to prevent vector thorns, but it also gives more opportunities for costume editor enthusiasts to create their artwork without having set limitations caused by miter strokes.
mock-up by han614698

Last edited by LaughabIe (Aug. 12, 2024 00:33:37)

scratchcode1_2_3
Scratcher
1000+ posts

Setting line-join strokes to any style

Wow, cool! I genuinely didn't know about this! This could be really useful for game assets.
SpyCoderX
Scratcher
1000+ posts

Setting line-join strokes to any style

Support! Would bring scratch a bit closer to a complete vector editor
han614698
Scratcher
1000+ posts

Setting line-join strokes to any style

mockups


you have no idea how impossible it is to make mockups in the editor

Last edited by han614698 (Aug. 12, 2024 00:27:13)

LaughabIe
Scratcher
100+ posts

Setting line-join strokes to any style

han614698 wrote:

mockups
cubeupload won't load so here:
https://ibb.co/x8C5GLB
https://ibb.co/F4QtZtZ
you have no idea how impossible it is to make mockups in the editor
i can add these to the op if you’d like (really good mockups!)
han614698
Scratcher
1000+ posts

Setting line-join strokes to any style

LaughabIe wrote:

(#5)

han614698 wrote:

mockups
cubeupload won't load so here:
https://ibb.co/x8C5GLB
https://ibb.co/F4QtZtZ
you have no idea how impossible it is to make mockups in the editor
i can add these to the op if you’d like (really good mockups!)
Sure, go ahead. I spent 20 minutes oh them. (there's cubeupload in my post now, here's the code to make it easy):
[img https://u.cubeupload.com/han614698/4b6Screenshot2024081119.png]
[img https://u.cubeupload.com/han614698/d7bScreenshot2024081119.png]
breakfast_for_dinner
Scratcher
1000+ posts

Setting line-join strokes to any style

han614698 wrote:

(#4)
mockups
snip
you have no idea how impossible it is to make mockups in the editor
good, but i think simplified names should be used if this is added
miter = sharp
round = soft
bevel = bevel (idk what else to use)
han614698
Scratcher
1000+ posts

Setting line-join strokes to any style

breakfast_for_dinner wrote:

(#7)

han614698 wrote:

(#4)
mockups
snip
you have no idea how impossible it is to make mockups in the editor
good, but i think simplified names should be used if this is added
miter = sharp
round = soft
bevel = bevel (idk what else to use)
how does this look/sound?
WindowsAdmin
Scratcher
1000+ posts

Setting line-join strokes to any style

han614698 wrote:

breakfast_for_dinner wrote:

(#7)

han614698 wrote:

(#4)
mockups
snip
you have no idea how impossible it is to make mockups in the editor
good, but i think simplified names should be used if this is added
miter = sharp
round = soft
bevel = bevel (idk what else to use)
how does this look/sound?
Exactly what i was thinking yeah
endyourenite
Scratcher
100+ posts

Setting line-join strokes to any style

han614698 wrote:

breakfast_for_dinner wrote:

(#7)

han614698 wrote:

(#4)
mockups
snip
you have no idea how impossible it is to make mockups in the editor
good, but i think simplified names should be used if this is added
miter = sharp
round = soft
bevel = bevel (idk what else to use)
how does this look/sound?
This Is What I Prefer, because 9 year olds sees this being more clear, while the first image may cause confusion for a 9 or 8 year old.

Last edited by endyourenite (Aug. 12, 2024 08:10:29)

han614698
Scratcher
1000+ posts

Setting line-join strokes to any style

dzje wrote:

han614698 wrote:

how does this look/sound?
snip
The proper words (miter, round, bevel) should be used rather than the simplified words some have suggested (sharp, curved, flat). While children won't be familar with these words at first, it won't take too much experimenting to find out what they mean and it's an opportunity to learn them. Using simplified words, while more understandable to a new user, removes the opportunity to learn the words that are used outside of Scratch.
I completely agree, I am just making mockups for what other people said.
breakfast_for_dinner
Scratcher
1000+ posts

Setting line-join strokes to any style

i swear this is a duplicate but i can't find it.

maybe i'm thinking of “use round instead of miter”

Last edited by breakfast_for_dinner (Aug. 12, 2024 18:09:42)

LaughabIe
Scratcher
100+ posts

Setting line-join strokes to any style

bump
LaughabIe
Scratcher
100+ posts

Setting line-join strokes to any style

bump
LaughabIe
Scratcher
100+ posts

Setting line-join strokes to any style

bump
blubby4
Scratcher
100+ posts

Setting line-join strokes to any style

You can edit the svg in the sb3 file to change this property. (I saw a project recently showing it off but I can't find it now)

Edit: I just realised this is in the OP. That's what I get for not reading closely.

Last edited by blubby4 (Sept. 17, 2024 01:27:22)

LaughabIe
Scratcher
100+ posts

Setting line-join strokes to any style

blubby4 wrote:

You can edit the svg in the sb3 file to change this property. (I saw a project recently showing it off but I can't find it now)
you mean by literally editing the project file and not the .svg you can also just download from the project editor?
blubby4
Scratcher
100+ posts

Setting line-join strokes to any style

LaughabIe wrote:

blubby4 wrote:

You can edit the svg in the sb3 file to change this property. (I saw a project recently showing it off but I can't find it now)
you mean by literally editing the project file and not the .svg you can also just download from the project editor?
I guess you could do that too. You could also import an svg from an external program, I suppose.
ThatOneCoder435
Scratcher
100+ posts

Setting line-join strokes to any style

I heavily support this, ST needs to improve the costume editor and this is definitely an improvement
ThatOneCoder435
Scratcher
100+ posts

Setting line-join strokes to any style

bump

Powered by DjangoBB