Text import in next version of Principle

Lots of people have said they want text layers imported from Figma and Sketch to appear in Principle as text layers, rather than images. I figured there may be several reasons for this, so I wanted to see which you resonate with the most, and get any other thoughts you may have.

I don’t like my imported text layers getting rasterized because:

:black_large_square: It looks blocky when the editor is zoomed in
:memo: I want to update the wording in Principle without having to reimport
:cyclone: I want to animate the styling in a transition (Color, font, alignment, size)
:art: I want to change the styling in Principle without having to reimport (Color, font, alignment, size)
:slight_smile: I’m actually not bothered by this
:man_shrugging:t2: Other (Please explain)

A little explanation of your work/thought process will go a long way towards the future of the text import feature!

2 Likes

“I want to update the wording in Principle without having to reimport”

Yeah, this one.
In my design workflow, most of the time, I design and import when my design is good enough to be prototyped (to test, to show etc). But the most frustating is when I need to change a word/phrase/paragraph and i need to write in sketch and to copy/paste in principle.

And most of the time I put the text inside a component to not make me do transition / animation again.

2 Likes

Did you know you can just import again to update the text so you don’t have to redo the animation again?

I want to change the styling in Principle without having to reimport (Color, font, alignment, size)

This. I think that Principle could give us better tools to handle text layers, specially line-height and kerning adjustments. It’s super important on our process.

But I’d like to highlight this one too: I want to animate the styling in a transition (Color, font, alignment, size)

4 Likes

Wow. Mindblown.

I will try :slight_smile: thanks !

I really REALLY want to animate the styling in a transition — especially size.

First, let me say that I have been dreaming about this feature for a while so anything in this direction would be of great impact in my workflow.
I usually import from Figma once I have the UI design relatively well defined and the main need for having editable text import would be for resizing, applying color changes, and maybe editing text as the UI animates during a transition.
So these are my wishes:
:cyclone: I want to animate the styling in a transition (Color, font, alignment, size)
:art: I want to change the styling in Principle without having to reimport (Color, font, alignment, size)

2 Likes

:cyclone: I want to animate the styling in a transition (Color, font, alignment, size)
:art: I want to change the styling in Principle without having to reimport (Color, font, alignment, size)
:memo: I want to update the wording in Principle without having to reimport

Basically, when I create a component from a symbol imported from Sketch, I usually want to create more instances of such symbol, so I need to edit the text wording, with the current functionality I need to remove the rasterised layer and add my own text layer on Principle to do that.

1 Like

:black_large_square: It looks blocky when the editor is zoomed in

Yes, prototyping for Retina displays with 1x rasterized text is especially distracting, even zoomed out at 100%. I can definitely notice the aliasing around the text.

:memo: I want to update the wording in Principle without having to reimport

Yes, copy changes from our copywriter can break interactions because my rasterized text was shorter/longer than the new text.

:cyclone: I want to animate the styling in a transition (Color, font, alignment, size)

Also yes—my prototypes include text transformation going from one screen to another. For example, iOS header transition changes in size and color.

Anything to move away from rasterize to vector-based stuff is a vast improvement in my opinion. Objects become much more scalable and reduces friction from moving between design tools.

:cyclone: I want to animate the styling in a transition (Color, font, alignment, size)
:art: I want to change the styling in Principle without having to reimport (Color, font, alignment, size)
:memo: I want to update the wording in Principle without having to reimport

Nowadays with content being king, if you can control, morph and animate text is essential in prototypes.

I would overall say that I want the text block being able to treat it as regular objects and manipulate them in styling and transitions. For me, I would hope Principle would act as Sketch - but more simple in its features - in the future so I could use Principle, and Principle alone, to try out micro interactions and creating handoffs to FEs or stakeholders. And to take another step to that future, I would say text blocks (for instance) is a requirement :slight_smile:

1 Like

Two things that bother me are rastered text and having to re-import all the time and secondly not have letter spacing.

1 Like

I mostly like the idea of this for when I want to create a component and then add animation from there. Usually I’m not going to go back to Sketch for this cause Most of what I need is already in there. I usually end up deleting the text image and then recreating it in Principle to then work with it like a text layer. Adjust type, size, or color.

Even though you can reimport stuff again, still I definitely need to be able to update text directly in Principle. Sometimes you progress so much in the prototyping phase and might change up stuff etc. Sometimes even the structure of the layers and the names change during the process and in that case reimporting from Sketch is a bit tedious.

Yes. PLEASE. I think everything is already said, got nothing to add on this.

Yes, as already mentioned in the first point, this would just save such a huge amount of work. Often you encounter the situation where you need to just make slight adjustments to text but each teeny tiny change takes at least 1-2 minutes to do.

Very very very much looking forward to have Text Import support in Principle :heart_eyes:

Changing font styling in Principle would be very useful!

1 Like

Hey Daniel,
i think those to things are important for me.

a) Currently i have to make a button component for each button with a different label – although the buttons all behave the same. So I would love to see a possibility to have text overrides in components –› which would be changing the text after the sketch import I suppose.
This would allow me to import only the different states of a button/symbol/whatever, build a component out of it in principle and change the text in the different places all over the prototype where i use the component.

b) Especially when I have buttons that change from dark to light on hover (or vice versa) I have to change the label as well. Currently I use two labels for this with different styling. That is kind of annoying since I have way more stuff on my artboard than I would need to.