[00:00.000 --> 00:16.880]  Last Wednesday, when we did the unboxing event, that since we do hope that everyone will be
[00:16.880 --> 00:21.600]  welcomed to a PEMPOT project, we needed to make sure that the invite system could cope
[00:21.600 --> 00:27.800]  with all the different use cases that you get with that link expiration, who got the
[00:27.800 --> 00:30.960]  invite, do any tree send it, etc., etc.
[00:30.960 --> 00:37.720]  Otherwise, the onboarding experience would be tough and people would not be joining the
[00:37.720 --> 00:39.400]  design project.
[00:39.400 --> 00:44.200]  And this is very important for us because this is not only a tool for designers to just
[00:44.200 --> 00:49.320]  express their creativity, but also for developers to join the design process to be welcomed there.
[00:49.320 --> 00:53.880]  So this is very important for us.
[00:53.880 --> 00:59.440]  But of course, we had many improvements in the interactive prototype feature.
[00:59.440 --> 01:03.640]  This is just one example for the overlay advancement.
[01:03.640 --> 01:13.920]  So here you can see how a design asset is being self-referred and you get a very nice
[01:13.920 --> 01:21.440]  pixel-perfect overlay on a button and then an animation that comes with a mouse click.
[01:21.440 --> 01:22.440]  Right?
[01:22.440 --> 01:23.440]  Do you like this?
[01:23.440 --> 01:24.440]  I think you do.
[01:24.440 --> 01:25.440]  Yeah, I think you do.
[01:25.440 --> 01:26.440]  This is happening.
[01:26.440 --> 01:27.440]  This is...
[01:27.440 --> 01:28.440]  This is happening.
[01:28.440 --> 01:29.440]  This is...
[01:29.440 --> 01:30.440]  This is amazing.
[01:30.440 --> 01:31.440]  So this is just about a token.
[01:31.440 --> 01:41.080]  I do mean, I mean, do go and enjoy PEMPOT, but it has many, many features on advanced prototyping,
[01:41.080 --> 01:47.160]  but this is one thing that actually came from this official release.
[01:47.160 --> 01:56.280]  As it did nested boards, so here you can see in this animation like an independent board
[01:56.280 --> 02:01.720]  being dragged to another board and having this nesting effect.
[02:01.720 --> 02:07.480]  This actually was a bit tricky because as you know, PEMPOT uses SVG like natively.
[02:07.480 --> 02:12.760]  So when I say open standards, we do really mean open standards.
[02:12.760 --> 02:19.240]  And it was tough to have this root element having everything, so to have different independent
[02:19.240 --> 02:26.520]  components being designed, we had to do this nested board trick, but that trick actually
[02:26.520 --> 02:33.080]  gave us a lot of potential because when you have nested boards, you can do much more advanced
[02:33.080 --> 02:36.800]  compositing in general, and so we have like the best of world worlds.
[02:36.800 --> 02:47.680]  We have SVG, but also these neat tricks for compositing.
[02:47.680 --> 02:53.920]  Also let me remind you, for those of you that don't know much about PEMPOT, that we have
[02:53.920 --> 02:57.520]  like some innovations in terms of where to find stuff.
[02:57.520 --> 03:02.040]  When you do engineering, you think about scale, like I need to scale up.
[03:02.040 --> 03:03.040]  I need to automate.
[03:03.040 --> 03:10.120]  I need to have everything like in tiny bits so I can combine them any way I want.
[03:10.120 --> 03:15.160]  With design, with big design architectures, you have that same challenge, otherwise it
[03:15.160 --> 03:20.040]  gets just manual, like design is just manual, and it can only go as far as your brain can
[03:20.040 --> 03:22.400]  cope with stuff.
[03:22.400 --> 03:28.080]  So having like your components, your libraries and assets readily available here, whether
[03:28.080 --> 03:34.360]  there are fonts or colors or design tokens or whatever, it's really cool.
[03:34.360 --> 03:40.200]  Also a whole lot of libraries, and you drag and drop, or you create new ones, and they
[03:40.200 --> 03:44.680]  are there on your left pane.
[03:44.680 --> 03:51.200]  So this actually comes from the PEMPOT design system, which is the first one example that
[03:51.200 --> 03:53.920]  you can one-click import.
[03:53.920 --> 03:58.680]  If you go to PEMPOT, you do the importing, it's very nice, by the way it's a nice bottle
[03:58.680 --> 04:01.360]  challenge that you can try and do.
[04:01.360 --> 04:04.680]  Anyone here did the bottle challenge?
[04:04.680 --> 04:10.000]  Some of you do, it's a nice little game where you learn by fun, like it's like you learn
[04:10.000 --> 04:13.720]  the PEMPOT basics using this bottle challenge.
[04:13.720 --> 04:18.880]  But when you actually go into more advanced topics, this is what you really need.
[04:18.880 --> 04:28.680]  So go and check the PEMPOT design system because it's kind of neatly organized.
[04:28.680 --> 04:36.480]  And then we get something so cool that no one had, which is FlexLayout.
[04:36.480 --> 04:42.920]  So every design and prototyping system out there would have this killer feature where
[04:42.920 --> 04:46.600]  you can smartly apply rules to your design.
[04:46.600 --> 04:51.320]  Say I want me to decide to flow this way, and then you would change the content within
[04:51.320 --> 04:54.840]  that design, and those rules would apply automatically.
[04:54.840 --> 05:00.800]  So for designers, I'm seeing people are saying yes, yes, I know why we're talking here.
[05:00.800 --> 05:06.200]  Some designers would feel a massive productivity boost thanks to that.
[05:06.200 --> 05:11.240]  You can call it auto layout, smart layout, fancy layout, whatever.
[05:11.240 --> 05:18.280]  They could not have this once they were exposed to that.
[05:18.280 --> 05:24.320]  It's like not having this once you know about this intelligent layout system is like going
[05:24.320 --> 05:28.960]  really back in time and having to do everything manually.
[05:28.960 --> 05:39.080]  So the problem with this, as we thought at PEMPOT, was that unfortunately these layout
[05:39.080 --> 05:49.200]  systems were design-centric, which is not bad per se, but was not developer-friendly.
[05:49.200 --> 05:56.080]  Basically it was not team-friendly, meaning designers would do their smart layout system,
[05:56.080 --> 06:00.480]  and then all the vocabulary and the ideas, the abstractions were just for designers to
[06:00.480 --> 06:07.440]  understand and to enjoy, and then developers would go there and say, I need to translate
[06:07.440 --> 06:10.520]  this into code.
[06:10.520 --> 06:16.040]  Let's hope there's no issues, by the way, issues.
[06:16.040 --> 06:20.800]  Not only technical issues, but also friction issues, like back and forth.
[06:20.800 --> 06:22.320]  This, am I in control?
[06:22.320 --> 06:23.960]  No, I'm not.
[06:23.960 --> 06:26.880]  Neither the designer nor the developer.
[06:26.880 --> 06:31.560]  They would feel like they would have to constantly double check, double check.
[06:31.560 --> 06:37.320]  And you don't scale up your design or your code if you have to do that.
[06:37.320 --> 06:43.800]  PEMPOT came with a completely different approach and said, what if we have code first design
[06:43.800 --> 06:45.200]  layout?
[06:45.200 --> 06:49.200]  What if already the design is the code?
[06:49.200 --> 06:52.800]  You can do a ton of stuff with Flex CSS.
[06:52.800 --> 06:54.520]  It's actually quite advanced.
[06:54.520 --> 07:01.960]  So what if we say, let's do a developer first design layout system?
[07:01.960 --> 07:07.920]  And we came out with Flex layout, and please do a plot here, because it's the first ever
[07:07.920 --> 07:17.000]  tool to have this, and it's open source.
[07:17.000 --> 07:24.040]  And the great thing about this is that this is not a gift from engineers to designers
[07:24.040 --> 07:27.840]  saying, I made this for you, please use it.
[07:27.840 --> 07:29.840]  I hope you're excited about this.
[07:29.840 --> 07:32.560]  But actually, designers wanted this.
[07:32.560 --> 07:34.400]  So no compromises here.
[07:34.400 --> 07:37.000]  Everyone wins.
[07:37.000 --> 07:42.000]  We got 50 to 60 volunteers for the beta testing of this.
[07:42.000 --> 07:46.160]  I mean, I'm not saying you could not test it using our development branch, but like
[07:46.160 --> 07:54.000]  the proper environment setup for people to go and do some simple tests like this one
[07:54.000 --> 07:55.000]  and give us feedback.
[07:55.000 --> 07:56.560]  And the feedback was phenomenal.
[07:56.560 --> 08:01.960]  I think 80% came from designers, and 20% from engineers.
[08:01.960 --> 08:05.840]  So that was nice, that was nice.
[08:05.840 --> 08:10.520]  Given the fact that in the world, so that you know it, statistically, there's one designer
[08:10.520 --> 08:13.720]  pretend developers, roughly.
[08:13.720 --> 08:16.600]  We don't think that's a good ratio.
[08:16.600 --> 08:20.800]  At colleagues, we have one to two, so pretty different.
[08:20.800 --> 08:23.160]  Somewhere in between, perhaps one to four would be great.
[08:23.160 --> 08:27.120]  But of course, to beta test this, we couldn't have the one to ten ratio in our poll.
[08:27.120 --> 08:29.080]  We needed to reverse that.
[08:29.080 --> 08:35.200]  But we didn't have to work hard to achieve that, because designers were actually asking
[08:35.200 --> 08:38.000]  to beta test this in the first place.
[08:38.000 --> 08:44.200]  So if you're familiar with Flex CSS, you can see properties there.
[08:44.200 --> 08:53.400]  And then, of course, you get, here I'm simulating to, this is a real-time collaboration, because
[08:53.400 --> 08:55.800]  we do have real-time collaboration, of course.
[08:55.800 --> 08:57.440]  And this is like two browsers.
[08:57.440 --> 09:01.800]  It doesn't look like that, because I made it, like, pixel-perfect in a way.
[09:01.800 --> 09:06.920]  But that code pane there, the coding spec, is actually a second browser just beneath,
[09:06.920 --> 09:07.920]  right?
[09:07.920 --> 09:08.920]  Nothing fancy.
[09:08.920 --> 09:11.480]  But you can see how real-time that is changing.
[09:11.480 --> 09:16.320]  So A designer is changing the design using Flex layout.
[09:16.320 --> 09:21.280]  And as the designer does that, the developer can see that code being changed.
[09:21.280 --> 09:24.520]  Just, it's a different tab selection there.
[09:24.520 --> 09:26.360]  That's all it takes.
[09:26.360 --> 09:30.960]  So I'm not saying that a developer should be, like, quickly copying and pasting when
[09:30.960 --> 09:34.280]  it changes, but it's nice for the demo.
[09:34.280 --> 09:42.480]  You see that it's real, there's no, like, export concept of anything.
[09:42.480 --> 09:46.520]  And really, that's it.
[09:46.520 --> 09:47.520]  Thank you.
[09:47.520 --> 09:49.480]  It happened.
[09:49.480 --> 10:01.960]  I do hope we have some time for questions, because I planned for that.
[10:01.960 --> 10:02.960]  That is great.
[10:02.960 --> 10:05.080]  Thank you for the point.
[10:05.080 --> 10:06.080]  Okay.
[10:06.080 --> 10:10.280]  I'd rather not pick if you could store that.
[10:10.280 --> 10:13.280]  You had done a really, really quick test.
[10:13.280 --> 10:16.280]  Thank you for the talk.
[10:16.280 --> 10:22.880]  My company is providing a design system, and they provide it for Sigma, or Sigma, sorry.
[10:22.880 --> 10:29.920]  And is there any kind of process I can follow to use the assets in Pentwork, or do we have
[10:29.920 --> 10:32.240]  something that exists to guide me?
[10:32.240 --> 10:35.680]  So the question was about, perhaps, migrating the design system from...
[10:35.680 --> 10:42.400]  No, we already have a company design system, so I have to respect this library with the
[10:42.400 --> 10:44.400]  assets and the design itself.
[10:44.400 --> 10:46.680]  I just want to use it in Pentport.
[10:46.680 --> 10:53.360]  You could, so if you're using a design system on Figma right now, and you want also to
[10:53.360 --> 10:56.920]  use Pentport, there's a ton of overlap.
[10:56.920 --> 11:01.800]  So it might feel weird for you to use the tool if you're not migrating.
[11:01.800 --> 11:07.760]  The answer is, I'm not sure it makes sense, because this is about team dynamics.
[11:07.760 --> 11:09.760]  This is about people collaborating.
[11:09.760 --> 11:15.920]  So unless you want to export these Figma assets, and use it privately for you, with
[11:15.920 --> 11:20.320]  no going back, if that is... I mean, you're smiling, so I guess that's what I want.
[11:20.320 --> 11:22.440]  I want to live in my private open-source world.
[11:22.440 --> 11:25.640]  We're going to pay for licenses for the whole team, so anyone...
[11:25.640 --> 11:26.640]  Okay.
[11:26.640 --> 11:27.640]  Do we have it for 10 people?
[11:27.640 --> 11:33.240]  And that seems to me, I get that you can save some money doing that, but honestly, it's
[11:33.240 --> 11:36.240]  going to not save you much time.
[11:36.240 --> 11:41.720]  So you have to keep a balance there, because it's going to be back and forth, not within
[11:41.720 --> 11:47.160]  Pentport, but within two tools that compete in the space of the use case.
[11:47.160 --> 11:50.920]  But I mean, go ahead and tell me how it looks.
[11:50.920 --> 11:55.240]  Perhaps I'm mistaken, but I think it's going to have a bit of overhead for you.
[11:55.240 --> 11:58.680]  If you're willing to check that, you have a sticker.
[11:58.680 --> 12:02.800]  I'll give you a sticker, like the shiny one, you know?
[12:02.800 --> 12:05.040]  By the way, who was... May I ask a question?
[12:05.040 --> 12:06.560]  Who was here three years ago?
[12:06.560 --> 12:08.120]  Can you raise your hand?
[12:08.120 --> 12:09.120]  Okay, yeah.
[12:09.120 --> 12:10.120]  Okay.
[12:10.120 --> 12:13.120]  We have stickers, like super premium stickers for you, all right?
[12:13.120 --> 12:14.120]  Next question.
[12:14.120 --> 12:15.120]  Yeah.
[12:15.120 --> 12:25.800]  My question is, you showed us there was a live update of the output code when you were
[12:25.800 --> 12:26.800]  in the designer.
[12:26.800 --> 12:27.800]  Yes.
[12:27.800 --> 12:28.800]  Is there a reverse also possible?
[12:28.800 --> 12:33.600]  Can I, as a developer, give a piece of code to the designer and can he copy and paste
[12:33.600 --> 12:41.520]  it into some... So the question is, we saw the real-time transformation between the
[12:41.520 --> 12:43.600]  design and the code.
[12:43.600 --> 12:44.600]  Is it for duplex?
[12:44.600 --> 12:46.840]  Can I change the code?
[12:46.840 --> 12:47.840]  Not for now.
[12:47.840 --> 12:48.840]  Not for now.
[12:48.840 --> 12:49.840]  Not for now.
[12:49.840 --> 12:57.120]  But of course, it feels like you would like to do the other way around, right?
[12:57.120 --> 13:02.600]  I'll actually go on with that question theme and say, what if you connect that with a
[13:02.600 --> 13:06.040]  gift repository?
[13:06.040 --> 13:13.840]  And you change that in the gift repository that comes back and changes the design.
[13:13.840 --> 13:18.160]  If you save as a designer, you change something that also goes to the gift repository and
[13:18.160 --> 13:20.840]  triggers the CICD process.
[13:20.840 --> 13:21.840]  Ah.
[13:21.840 --> 13:22.840]  Okay.
[13:22.840 --> 13:29.080]  So we thought about that because it's kind of what comes next, obviously.
[13:29.080 --> 13:32.280]  But yeah, so good question.
[13:32.280 --> 13:34.280]  We've got to cover it.
[13:34.280 --> 13:35.280]  Okay.
[13:35.280 --> 13:50.160]  I should just run over and save this person.
[13:50.160 --> 13:51.160]  Thank you.
[13:51.160 --> 14:09.240]  Thank you.
[14:09.240 --> 14:13.520]  So resources for helping teams migrating from other tools to PEMPOT?
[14:13.520 --> 14:14.520]  Yeah.
[14:14.520 --> 14:16.520]  Specifically PEMPOT for me.
[14:16.520 --> 14:17.520]  Yeah.
[14:17.520 --> 14:18.520]  Yeah.
[14:18.520 --> 14:20.680]  I mean, Figma, what is that?
[14:20.680 --> 14:26.480]  Figma owns 80 percent of the market for designers, 80 percent.
[14:26.480 --> 14:31.320]  Adobe now owns 87 percent of the market, thanks to that.
[14:31.320 --> 14:34.600]  So obviously, yeah, I get that.
[14:34.600 --> 14:38.760]  We have a plugin, an export plugin.
[14:38.760 --> 14:43.560]  We hope that the community can help us just improve it so that you can basically export
[14:43.560 --> 14:44.760]  all that from.
[14:44.760 --> 14:50.560]  We actually don't know how much time we've got for that plugin to be okay for Figma.
[14:50.560 --> 14:52.000]  But it's still there.
[14:52.000 --> 14:54.920]  So that is one way you can quickly test that.
[14:54.920 --> 14:57.520]  It's not any means complete.
[14:57.520 --> 15:01.560]  So it will give you the basics, but it might be enough.
[15:01.560 --> 15:06.800]  And then I think everything like exporting stuff and just re-importing that is really
[15:06.800 --> 15:13.400]  quick for teams to have the design system re-uploaded here somehow.
[15:13.400 --> 15:15.080]  I don't think it's going to take much time.
[15:15.080 --> 15:19.480]  If you have the motivation, it's just, you know, I mean, depending on the complexity
[15:19.480 --> 15:23.600]  of the prototypes and design, this is for prototyping, and this is also for design.
[15:23.600 --> 15:27.160]  So depending on the quality for each topic, it might get.
[15:27.160 --> 15:32.480]  But yeah, the export plugin, we really hope that we get more help from the community.
[15:32.480 --> 15:44.360]  So if anyone here is interested in those serialization challenges for the SVG and the JSON, because
[15:44.360 --> 15:47.240]  it's all it has, really, that would be great.
[15:47.240 --> 15:51.400]  So the abstraction model that we have from Figma to actually proper, you know, open
[15:51.400 --> 15:52.400]  standards, fine.
[15:52.400 --> 15:53.400]  So yeah, those, good.
[15:53.400 --> 15:54.400]  I actually realized that I can figure it out myself.
[15:54.400 --> 15:55.400]  Okay.
[15:55.400 --> 15:56.400]  So answer your question.
[15:56.400 --> 15:57.400]  So there was somebody over here that had, and then again.
[15:57.400 --> 15:58.400]  And congrats on the launch.
[15:58.400 --> 15:59.400]  Thank you.
[15:59.400 --> 16:00.400]  I'm really great to see you.
[16:00.400 --> 16:01.400]  I'm curious about the business side of things.
[16:01.400 --> 16:02.400]  You mentioned Figma as an obvious competitor.
[16:02.400 --> 16:03.400]  Mm-hmm.
[16:03.400 --> 16:04.400]  How do you plan to continue with Figma and be successful?
[16:04.400 --> 16:21.560]  At the same time, drive your business forward?
[16:21.560 --> 16:24.720]  So Caledis is a company.
[16:24.720 --> 16:26.800]  Actually the original title is Caledis Open Source.
[16:26.800 --> 16:31.520]  That's the SL, because we're a Spanish company.
[16:31.520 --> 16:37.760]  So the idea for us is to make sure that we follow this, we think it's going to be kind
[16:37.760 --> 16:44.440]  of an enterprise edition that will give companies things that the power user does not want
[16:44.440 --> 16:46.000]  or doesn't need.
[16:46.000 --> 16:50.960]  We call that privately, publicly tax the controller.
[16:50.960 --> 16:52.160]  Okay.
[16:52.160 --> 16:57.240]  So that is something that we don't really need right now, because to be honest, there's
[16:57.240 --> 17:03.040]  still a ton of things that we have to do for the product, but basically perhaps in two
[17:03.040 --> 17:10.400]  years, if we are relevant, we hope we are relevant, we'll see.
[17:10.400 --> 17:13.280]  See you in two years, force them, you know.
[17:13.280 --> 17:20.880]  But if we are really relevant, then we will look for those tax the controller features
[17:20.880 --> 17:23.800]  that big companies are fine.
[17:23.800 --> 17:25.840]  They won't contribute with code.
[17:25.840 --> 17:27.800]  They won't contribute with content.
[17:27.800 --> 17:30.800]  They will contribute with money, right?
[17:30.800 --> 17:35.320]  So we don't have like the details, but it's going to be like, and this has been publicly
[17:35.320 --> 17:40.000]  said many times, the power user gets open source forever.
[17:40.000 --> 17:45.120]  Is the companies wanting to have this control mechanism that will have to pay for something
[17:45.120 --> 17:48.360]  that is exclusive to them, whether it's self-host or SaaS.
[17:48.360 --> 17:49.360]  We don't care.
[17:49.360 --> 17:54.920]  Actually by the way, there is also a desktop app by the community that encapsulated PEMPOT
[17:54.920 --> 18:00.280]  with Electron, so you can also have the pure desktop native experience.
[18:00.280 --> 18:05.120]  So yeah, it's there actually in the community space, community.pempo.app.
[18:05.120 --> 18:07.800]  We elaborate a bit more on that.
[18:07.800 --> 18:14.040]  The only way this will be sustainable as a company is that we are really relevant.
[18:14.040 --> 18:20.480]  Surprisingly, the design space in our view is quite immature.
[18:20.480 --> 18:28.520]  You have one tool, winner takes all, then the next tool, then the next, subsequent winners.
[18:28.520 --> 18:34.880]  We hope that we add fragmentation to that, but still and still be relevant.
[18:34.880 --> 18:38.640]  So we have like one minute left, if you can.
[18:38.640 --> 18:39.640]  Yeah, I answer your question.
[18:39.640 --> 18:40.640]  You answered the second part.
[18:40.640 --> 18:43.640]  And this is the first part of the hug actually, you tend to compete with Figma.
[18:43.640 --> 18:47.880]  You tend to maybe drive business away from Figma toward PEMPOT.
[18:47.880 --> 18:55.200]  Well I think the playbook that we have is quite unique and unprecedented.
[18:55.200 --> 18:58.360]  This is open source design and prototyping tool.
[18:58.360 --> 19:04.960]  So we hope that we have a bottom up distribution model.
[19:04.960 --> 19:07.680]  People are really saying this is actually much better.
[19:07.680 --> 19:14.680]  And we are hoping, this is part of our, yeah, this is hope, that you remember that ratio,
[19:14.680 --> 19:20.800]  one designer per 10 developers, that developers actually loving open source do bring PEMPOT
[19:20.800 --> 19:22.880]  to the forefront.
[19:22.880 --> 19:26.360]  Without the help from open source developers, I'm sure this is not going to happen.
[19:26.360 --> 19:32.680]  Not because designers don't like open source, just because the economics of that will take
[19:32.680 --> 19:33.680]  much longer.
[19:33.680 --> 19:41.360]  So yeah, that one to 10 ratio is the only time I'm happy with that ratio, in this particular
[19:41.360 --> 19:42.720]  case it's like.
[19:42.720 --> 19:45.920]  So we are counting on open source developers to be.
[19:45.920 --> 19:52.720]  Okay, if you want to have a chat afterwards, I'm sure Pablo is very, very happy to answer
[19:52.720 --> 19:53.720]  a question.
[19:53.720 --> 19:58.280]  So that's, we have five minutes for people to leave and people to come in.
[19:58.280 --> 20:00.400]  So I'm going to say thank you Pablo.
[20:00.400 --> 20:01.400]  Thank you.
[20:01.400 --> 20:02.400]  Thank you.
[20:02.400 --> 20:03.400]  Thank you.
[20:03.400 --> 20:04.400]  Thank you.
[20:04.400 --> 20:05.400]  Thank you.
[20:05.400 --> 20:06.400]  Thank you.
[20:06.400 --> 20:07.400]  Thank you.
[20:07.400 --> 20:08.400]  Thank you.
[20:08.400 --> 20:09.400]  Thank you.
[20:09.400 --> 20:16.400]  Thank you.