Penpot, Open Source Figma alternative, raises $8M in funding
techcrunch.com
techcrunch.com
I'm rooting for both of these, and now that they have some funding I hope they'll dedicate effort on polishing the rough edges (and do something about the gratuitous amount of white space that permeates all of their web presence, and maybe reconsider their color palette to be less muted and more saturated, heavier, and decisive). They seem to be actively working on Figma imports, auto layouts, multi-user edits and more at this moment so they're on the right track.
For both of them, even if the VCs pull the rug from underneath to race for an exit, it being OSS is good insurance. A fork would mean that we don't have to spend time learning yet another tool. The good will fostered by it being OSS is what encourages some of us to look into their offerings, and in this way what we see is something that seems like a sustainable model for OSS projects.
As an aside, does anyone know what software this page is running:
It looks like a taiga plugin but I don't know what it's called.
I find it fascinating that people are praising their skin of Discourse, because I think it's got a little too much white space! With those needlessly huge button-banners, for folks with small-to-medium sized screens, the content of interest is almost a full screenful-scroll away.
Technically I'm very curious to see how Penpot evolves with this investment, especially in regards to their choice to base everything on SVGs. IMO this will be their greatest superpower and also greatest weakness. Keeping things tied explicitly to code means exporting the final product is going to be near-perfect translation wise, but it will also mean they're tied explicitly to the browser's ability to render the combined html+svgs.
Currently Penpot's performance starts dropping rapidly once you approach around 1000 layers. Most robust design systems I see run around 10-40k layers (with the record I've seen being 250k). I'm very curious if they'll be able to optimize their approach to support those sizes of libraries.
It has 1.3k layers, and this is for one component. Most design systems have around 50 components, many more complex than just a button. This is from the Ant Design System: https://www.figma.com/community/file/831698976089873405
Another way to think of it that may help put it into perspective for devs, think of the number of html elements in your average storybook page. Atlassian's page for their button has around 2k html elements to display all the variants and documentation: https://atlassian.design/components/button/examples. A Figma file represents all of the components in the same file, which quickly leads to an explosion of layering. Performance becomes a concern VERY quick.
In Photoshop a layer could have many shapes on it, if you drew one shape/mark on top of another within one layer, they would be inseparable. If you drew any two things in Sketch, they would always be separate, I suspect this is why they stuck with the term "Layer" even though something like "Object" may have been more accurate.
In sketch, instead of sheets of paper that match the size of the document, you have a perfectly cutout shape for each stroke you draw. You can then move that cutout around within the document.
Both of those have the same principle except one is cutout one is not.
When each layer is a transparent sheet it has an absolute Z order that translates 1-1 with the physical thing it’s virtualizing (transparencies, probably from traditional animation).
However if you cut out tiny shapes and arrange them with some on top of others to make a larger composition, there is no longer an absolute Z order to any element because there are a bunch of smaller stacks of various heights.
The virtualization no longer translates to the physical world, and from my experience that disconnect can sour people against a new way of doing things, regardless of whether it’s better.
https://www.figma.com/blog/building-a-professional-design-to...
Figma is a vector drawing tool like Illustrator, which means that the comparison with Photoshop layers is misleading. What the parent post refers to as "Layers" is the name that Figma uses for objects like rectangles or text. So if you have a design file with many elements the number of layers grows quickly. The same happens in Illustrator or Sketch.
The closest equivalent to merging a layer is combining different shapes in one or rasterizing vectors into pixels. The usual tricks to handle big files are to work with different pages (so the app doesn't have to render everything at once) or to rasterize the parts that you'll like to keep as a reference (and move the vectors to another file).
It's not a problem of Figma, but a feature of vector design tools where you like to preserve the editing (and details) of everything. You'll have the same performance challenges in Sketch, XD, Illustrator, Affinity Designer, etc. The case of Penpot using SVG is interesting because big files will push the Browser SVG to its limits. (BTW I took a look at the Penpont code, it's interesting that they use ClojureScript for everything... it gave me the motivation to learn about CloujreScript).
You're often representing every page on a site, or every component in a design system in the same file. A way to think about it is "If you counted every div on every page of Reddit, how many would there be?". Most modern sites will have around the same order of magnitude of html elements.
But is it necessary? Can't the artboard be visualized in a better way? If such high-level view is desired, won't rasterized details be sufficient till one zooms in?
Along with the Adobe news, it's perfect time for an alternative.
I really love that Penpot is sticking with standards and I think piggybacking on SVG might bring lots of cool features for free. I always thought that it would be very nice to embed custom stuff using the foreignobject tag that could enhance a live prototype (ie: videos, 3d content, real html+js, etc).
Use real scripting + SVG is a dream of mine to build a design system. You know many of us are hybrid devs and designers and sometimes pushing pixels here and there is too much work when a simple script can automate stuff :)
I hope you have a good plan on how to optimize the canvas since I found it my major blocker to use it together with the lack of autolayout (I know you are working on this last one :)
On the other hand, I'm a fan of Kaleidos and your business model and I'm very happy that you got the funding to speed up Penpot. Hopefully one day we could cross paths and have a chat!
* SVG at those levels sounds quite amenable to serverside offloading for bulk rendering: not "easy", but many options for HPC types. The browser can handle pan/zoom. My main computational question is hitmaps & hover effects, but wouldn't bet against ingenuity here as the use case is fairly static. Arguably, even Figma should move off in-browser and to offloading, if it hasn't yet.
* Browser acceleration of SVG has been improving over the last decade. Maybe more B round+, having 1-2 people work with Chrome will help knock out whatever is left in the browser. Working to optimize one site on both sides is WAY easier than optimizing for everyone, this is an open secret of Nvidia etc games & top websites for ~decades.
Real-time SVG is less practical in our case b/c our users will run clustering & filters and expect real-time vector transforms of 2M nodes + edges (imagine Google Maps... but live), but for something like a site design.. a lot more room for perceptual tricks!
All of that is insane, IMO, and points to the fact that most designers see Design Systems as a giant “skin” and not a set of ideas. This causes massive friction.
IMO this is where Figma fails, it treats Design Systems as a picture. A canvas. This is a relic of graphic design traditions (contact sheets.) Figma’s successor (whatever it ends up being) will embrace the fact that Design is Ideas not Pictures and Ideas are best represented in Code.
Maybe Penpot is onto something here. Although SVG is not the material of the web. HTML is, or maybe the frameworks that target the DOM.
UI Design in 2022 is like pre-modern architecture. Like architects whose designs don’t prescribe anything about the materials of construction.
Check out https://interplayapp.com/ for a different take on how design systems should be created for use in Figma.
I think it’s telling that Figma can’t really do any of this natively and there’s a whole ecosystem of companies surrounding Figma trying to help it actually Do The Job. Zeroheight and Storybook/Chromatic being the other obvious examples.
Not only that, but there are spec issues that make SVG precision impossible.
If anyone can prove me wrong I’ll be happily wrong. The easiest example: make 3 circles of radius `r`, and place them in a straight line where the centres are `r` distance apart. The outer circles should touch and not ever overlap. Not even past 999,999% zoom.
5600%! Good for them. I'm sure a lot of it was folks exploring options but I wonder how many of those new users will stick around -- anyone try it out and decide to make the commitment to use Penpot as a full replacement? Anything it still needs / hesitations?
But whatever their plans are in this regards, I think it would be good if they were more clear on their planned strategy.
Still, it’s not like there aren’t many, many companies that make money from open source, including when it’s their own code they are open sourcing. (Honestly I wished way, way more lawyers and executives in general understood where the value their company provides actually comes from. Too many times they think their “secret sauce” is the actual code when it’s really the team and the labor that went into creating it, maintaining it, supporting it, and selling it. They aren’t being paid for the code, they are being paid to deal with it!)
“ Most investors will love what you have achieved but also feel strongly about creating immediate commercial results. We were excited to learn that Jon, Sudip and Dan from Decibel 28 were a different group of investors. If you want a patient investor who gets open source and community, look no further - nobody beats Decibel’s passion and care for your team’s vision and encourage you to build a strong open-source community around your company!”
But the terminology used is hollow and finite. Why would they provide an open source company with $8M? Passion alone? There must be some sort of ROI they aim for. So what is that?
Currently learning through an open source book right now (https://www.learn-clojurescript.com/). I was planning on paying for it after I read the book to see if it was worth it, but I paid for it halfway through.
ouchhh what a burn haha
> Note that interacting with these <input> elements will mutate the array. If you prefer to work with immutable data, you should avoid these bindings and use event handlers instead.
Which left me with the impression that svelte's functional story wouldn't be that great. Though I did still finish the tutorial.
As my first project I tried to migrate one of our static websites to svelte with sveltekit. It didn't really feel like I was doing something different than when I was using Vue3/Nuxt3, so I might as well stick with it. I understand that the technical tradeoffs are different, svelte is compiled and has no runtime after all, but the developer experience pretty much feels the same.
- simple (lisp) syntax
- immutability
- emphasis on data (collection and sequence) transformations
Also the concurrency model of ClojureScript's `core.async` is similar to Go, which is good apparently? I have not tried Go yet, but to me it looks similar to Elixir/Erlang's actor model.
NOTE have not finished the book yet.
but not a fan at all of writing html in clojurescript. it's extremely ugly to look at vs raw html/jsx. and became cumbersome really fast for me as my app grew in size... maybe there are better alternatives now, this was around 5 years ago.
using react with libraries like ramda/redux/rxjs in affect achieve the same thing but with 10x more libraries and references online.
the philosophy behind clojure will completely change how you code and visualize problems if you embrace it. honestly can't remember the last time i wrote a for loop...
(let [element (dom/createDom "div" "some-class" "Hello, World!")] (classes/enable element "another-class" true) (-> (dom/getDocument) .-body (dom/appendChild element)) (doto (Timer. 1000) (events/listen "tick" #(.warn js/console "still here!")) (.start)))
How is that even workable? And that's just an HTML fancy hello world.
(Note: It was originally linking to a post on the company's own community site. For some reason it's since been edited to a TechCrunch post(!))
Link to Discourse post: https://community.penpot.app/t/penpot-our-time-has-come/1563
From an engineering POV, maybe someone should sell a CRDT service that proxies multiple users into one and pretends to be general, but really authors domain-specific stuff since CRDTs and OT "general" is not very valuable.
It wouldn't be easy to take Illustrator and add collaboration and get Figma. Microsoft bought a company that had already made a collaborative version of Word to get a head start on that process, and O365 is still clunky compared with Google Docs.
In the 3D mechanical CAD world, Onshape has done an amazing job of taking the functionality of Solidworks (or Creo or NX or ...) and making it collaborative. But really the biggest change is that they turned every user step into a "micro-version" which can be undone (pretty much infinite undo/redo). They built a Github style branching/merging (and reverting) version control system on top of the micro-versions. They have one service which runs the versioning system and another which runs the geometry engine. If you have all the steps, you are always guaranteed to get the same geometry - this fundamental rule of their system design means that only the deltas of micro-versions need to be shared between users/locations.
Anyone who's opened a Word file on a few different computers can tell you that the fonts, font handling and subtle version differences between different installs of Word means that the same source file doesn't equal the same visual layout. To some degree, putting "Word" in the cloud should mean that every user is using the latest (same) version of Word, but that's not the case still...
There's a reason that Google Docs doesn't have an offline mode or support any font in the world.
IMO CRDT seems to be the "easy way" to make the output look consistent, but when it comes to interactions that may have semantics, then one may want to go the OT route. My impression is that CRDT is better suited for distributed computing applications.
[1] https://support.google.com/docs/answer/6388102?hl=en&co=GENI...
[2] https://drive.googleblog.com/2010/09/whats-different-about-n...
VC funding = it'll become Figma
Like what happened to Keybase, also what happened to Bitwarden and is now happening to Penpot.
With all of this, it will just end up just like Keybase as investors will race for an exit.
Why is this a "VC Scam?"
A competitor just got aquired for $$ and a startup raised funds to attempt to compete in the space.
I don't see anything here that looks like a "scam" to me.
Keybase as an idea was much more pie in the sky vs. "an open source figma clone".
The question is, can we organize around alternatives to the VC model, and build communities with control over their own destiny, instead of having the rug pulled out from under them repeatedly due to the whims of capital (and founders securing the bag)?
The concept of "exit to community" appeals to me, but unfortunately I see crypto grifters / DAOs trying to take over any "decentralization" narrative. Unless the crypto crash wipes those scammers out, I fear the community may flee from VC scammers into the arms of crypto scammers, new boss same as the old boss.
I hope that we can build some sort of cooperative movement that can avoid the "world domination or acquisition" pressure from VCs, while also avoiding weird technocratic "fixes" like DAOs. There's no replacement for organizing and community, tech cannot replace that difficult and necessary work of marshalling people to pull together in the same direction, accept no substitutes or "shortcuts."
wow. check out their growth https://star-history.com/#penpot/penpot&Date
Some other notable projects that started as forks: postgres, Wordpress, Apache Server, OpenSSH. I'm sure there are others I forgot.
Would be great to be able to import .fig files
As a full-time Figma user and one-time evangelist for it, I looked eagerly for alternatives after the recent news. Penpot is not ready for my team to switch over yet, but I hope that if, in the future, Figma suffers the same fate as Adobe's other software design tools, Penpot will by then have grown into a viable OSS alternative.
2 is why Linux is alive, too many large companies depend on it for it to die.
- Product become popular
- Company X takes VC money/get aquired
- Company Y makes an alternative product that is cheaper and maybe Open Source
- Company X makes product worse due
- People switch to product from company Y
- Now repeat everything, but Company Y is now Company X.
Not long ago, Figma was Company Y in this cycle.
2) We've taken Venture Capital funding in order to get ramped up much faster, so we can do all those great things
3) Because we didn't ramp up as fast as the Venture Capital funding wanted, we're changing our direction.
4) We're selling to a big company for billions of dollars who will either ash can our work entirely or totally ignore our initial mission.
Founders like to pretend they didn't break their promises when their VC funders or a takeover totally changes their product in step 3 or 4. But they broke their promises in step 2, the second they took Venture Capital funding. VC is investing a small amount in many companies expecting massive payout from one of them. The end goal is to go public or sell to a large company. Either means giving up control, which means you've agreed to give up control as soon as you take VC funding. A company can no longer be trusted to do what's in the best interest of their customers as soon as they a) take VC funding, b) go public, or c) get sold. No matter what promises they've made.
Point is, don't jump from Figma to PenPot thinking everything will be better, they will go the same route within 3 years if they're successful. It's nice that it is open source, but at some point it will not be open source, or will have significant changes for a professional paid version. Open Source is only part of the equation, it also needs either a community or consistent company support, and that's not guaranteed once VC gets involved.
Doesn't matter - it's an open source app, I can clone it and run it on-prem or locally (and I already have - and opened a PR!). FLOSS simply eliminates a great deal of SaaS risk.
They can delete their repo tomorrow, go full-proprietary, sell out to the highest bidder, get taken over by Adobe. None of it matters, I can still work on my designs.
The only really evil things can come from the likes of google anti-fragmentation agreement where essentially you are marked with a Scarlett letter if you didn't go all-in into google proprietary ecosystem. But we have FCC to protect us from that, right?
Correct. They broke their promise as soon as they took VC money. Same with Keybase and same with Bitwarden. They cannot be trusted on their 'promises'.
> It's nice that it is open source, but at some point it will not be open source, or will have significant changes for a professional paid version. Open Source is only part of the equation, it also needs either a community or consistent company support, and that's not guaranteed once VC gets involved.
This. 'Open Source' is a marketing term and illusion which is 1/4 of the equation with it being hijacked for a different purpose. There is a possibility that there could be a private fork that has different features to the open source version.
As soon as VCs get involved it is basically a race to the exit at all costs, even if they have to close or omit some features from the open-source version if they have to.
I think what is key for us here is that we, as a company, don't actually own the whole thing. That our open source license and a strong community lead us to a very successful business without having to revert to traditional playbooks. TBH, my biggest concern right now is not trying to convince you that you have to trust us, that would insult your intelligence. No, my biggest concern is how to create an open source community with both designers AND developers (I touch upon this here https://community.penpot.app/t/not-all-communities-are-creat...). This is my personal dream and it has been since I sent $15 to the Free Blender Campaign in 2002 while still a Physics undergraduate. For all these years I thought someone else would create something like Penpot but it kept not happening and some us got a bit nervous, I guess. Thanks for your thoughtful post!
It doesn't matter what your end goal is, their end goal is to 10x or more their investment, full stop.
Whatever you do that gets in the way of that will result in you being removed.
So congrats on the funding I guess?
Is a desktop app in the cards to enable offline use, with https://tauri.app maybe (instead of Electron, for improved performance)?