Snapping to pixels

Seeing as there is still no way to import and edit a SVG as a vector shape I need to try and redraw a letter 'd'.

Is there a way to use the vector tools to match the letter outlines exactly. Currently I can only get it roughly in line because Hype wants to snap to a pixel so trace/drawing doesn't seem to work for things like letters?

Am I missing something?

You could use the Pencil tool to draw a vector, or to disable snapping while placing a point using the vector shape tool, hold

Thanks Daniel, that doesn't seem to work for me. It doesn't seem to allow fine tuning and moving points a tiny amount? It seems to jump to pixel point each time?

Pressing CMD doesn't have any effect.

If you're trying to place a point between pixels, that's not possible, but turning off snapping by holding command should work as you're adjusting points. The snapping finds the midpoints of elements and scales (shown as a red line). When not holding command, the point snaps to the scene midpoint. But when holding command, the midpoint is shown but not snapped to:

Ok, thanks. I think a possible solution is that I have bee tracing around a small letter. If I make the letter a lot bigger and then trace around it seems to follow the lines better?

Yes that makes sense -- make the object you're tracing as large as you can, then you can always scale down the vector you make later.

I am trying to morph a circle into a letter. So I am trying to create the letter as a single vector shape which is more difficult with letter with holes in them?

Correct: Hype's vector shapes cannot contain multiple paths currently, so it is very difficult to do holes. You'd have to fake it by making a channel to the hole with the path and/or get very creative with the fill rules.

Good to know thanks. Can you make the morph, morph from the centre out, instead of say bottom right?

The Transfer Origin setting doesn't seem to have any affect?

There's really just two modes for the shape morphing, the "algorithm" setting in the vector shape inspector (shown when editing a shape):

  • Best Match: tries to be as "smart" as possible to morph
  • Direct Anchor Point Match: this will simply move the anchor point (and corresponding control points) to its new location.

Basically you have complete control to do the shape morph with the Direct Anchor Point Match, but just have to be conscious of where each anchor point will go.

The Transform Origin is at the element level, and doesn't have an effect on its inner path's shape morphing.

Thanks Jonathan, that looks a little better!

1 Like

Please tell me we will be able to import editable SVGs in Hype 5?

Sorry, we don't comment on future releases! (But as you could probably uncover, that is the most popular request!)

Fair enough! That feature would have turned 3 hours into a minute!
Well worth it I think!!
Thanks for your help today.

1 Like