First (not so...) serious test

Help us improve Penpot
1

Here we are!
I’ve been playing around with Penpot for a long time in personal projects which, since I’m not specifically a UX designer, have always had little professional relevance — rather more of a journey of approaching a discipline that fascinates me.
Recently, I used Penpot for a real work project. Nothing too complex: a 10-slide carousel (classic 1080x1350) with the program of an event. I imported some backgrounds with gradients and a grainy layer to apply in semi-transparency (generated externally), plus some mostly vector assets.
Here’s how it went:

PROS

  • I had a lot of fun managing text and content with autolayout and grid layout
  • Grid layout is outstanding
  • I love the way you have to approach things in a certain way to get the desired result, almost meditative

CONS

  • a bug: when applying a gradient to a display text block, the side edges of the box itself fade into transparency, even if all gradient stops are set to 100% opacity

    gradientBug
    gradientBug2704×1352 157 KB

  • I initially copied all the text into Penpot (to be able to copy-paste directly from here!) and performance dropped dramatically

  • exporting: I needed to export also in PDF. While JPGs had no issues, the PDFs turned out to be unusable, especially (I noticed) because of the semi-transparent layers applied for the grain effect

    pdfExport
    pdfExport1723×1077 398 KB

  • the fact that layers, assets, and tokens all share the same panel makes managing things a bit cumbersome at times

I’ll keep using Penpot because I enjoy working with it, because I love the philosophy and the people behind it (things that have enormous value to me), and because it’s improving at great speed.
I can’t wait to try the new rendering engine, I’ll stress test it… and stress you out too! :grin:
Thank you!

1 Like
2

Beautiful designs! The issue you’re experiencing with the PDFs is common in print design. Does it help if you add a fill with 100% opacity to the boards, underneath the grain graphics?

3

Hi Laura!
The fill of each board is set to 100% opacity. Above are all the graphics, and finally, at the top of the stack, the noise layer is semi-transparent, to give it the graininess I like.

screenShot
screenShot1920×755 123 KB

When I export the PDF, it makes the graininess too coarse, it expands it… basically, it doesn’t render as it should.

pdf version
pdf version1920×2401 365 KB

jpg version
jpg version1080×1350 318 KB

This project isn’t meant to be printed, but I needed a PDF to upload the carousel to LinkedIn. I solved this by creating the PDF in InDesign (may the universe forgive me, but we have Adobe Suite at work…!!!) and paginating the JPGs exported from Penpot. In any case, the JPGs looked great. I’m eagerly awaiting the new rendering engine!

1 Like
4

Ah cool, so it’s an image compression issue?

5

I imagine so; the vector components, like the logo and text, are rendered perfectly. It seems to me that it’s precisely that noise layer that’s being handled poorly…