Apr07
Friends of Figma Barcelona

6:00pmRemote, localhost

David Aragonés and Rubén Jiménez presented the new version of the Lexicon component library for the Figma Design Community.

Friends of Figma Barcelona hosted the event — this is amazing because they are a very active community which we wouldn't have had the opportunity to work with if it weren't for the current situation.

It seems now it’s time for remote events.

The hosts

Friends of Figma Barcelona is a community created in 2021 led by Iban Curdu and Carmen Ansio. They are friendly and very approachable and made us feel comfortable talking with them during the event.

The event

Before the event started, we were chatting informally with our hosts Iban and Carmen. Iban told us they would like to give a talk about the new feature of Figma: interactive components. So we started to talk about the the playground file Emiliano did a couple of weeks ago. He opened the file and said, “this is awesome.”

Then a couple of minutes later, they introduce us. I started with the first part of the talk: a brief introduction of Lexicon, what it is, how we work, what plans we have for the next few years.

One of the points we talked about was uniformity, a.k.a. "ultra-consistency" and how to avoid it using flexible components.

The low level component designed for Product Card
The low level component designed for Product Card

Next, Ruben gave us a talk on our most recent improvements regarding the Figma library: variants, auto layout 3.0, and the redesign of the components architecture.

He showed the new updates in our library to improve our design and development teams’ use of our components, the new internal documentation linked to each component and usage guides to help teams to familiarize themselves with the use of design libraries.

The new library includes descriptions and use guides
The new library includes descriptions and use guides

As part of the efforts to adapt our libraries to the new features introduced by Figma, we have assembled the component architecture from master units. This makes it easier to manage the library and improve its scalability while avoiding wasting time when iterating on changes/improvements that may come.

Finally, we discussed some of our next steps to continue expanding Lexicon in the future.

The talks

Introducing Lexicon

David Aragonés from Liferay Design talked about Lexicon as a design language and the difference designing using high-level and low-level components.

For a summary of their presentation, video, and slides — see his talk page.

Optimizing Design Experience with Figma

Rubén Jiménez from Liferay Design showed off the exciting new component library with variants and autolayout 3.0.

For a summary of their presentation, video, and slides — see his talk page.

The beers

😢 Beers at home. We are happy that people showed so much interest that we spent over an hour with the Q&A. Questions about typography, the performance problems they are experiencing with variants, how we test components, and our internal organization...

Conclusions

We had a great time and received very good feedback.

So, it was good to fight our demons. In my case, talking in public is always a challenge. But being honest, at home, with no distractions, it was easy peasy. Not really 😛, but I’m satisfied with the result.

Rubén nailed a live test of our new functionalities, and the audience was pretty amazed at being able to see the work we have done so far.

Nerves turned into excitement as we saw the response the presentation was getting. This gives us great encouragement to continue working in the same direction.

Thank you, Susana and María (our newest member), for attending the talk. We appreciate your support!

It was a walk in the park, next talk, 🤩 here we go!

Speakers

David Aragonés
Design System Lead
Rubén Jiménez
Senior Product Designer

Liferay.Design

Part of Liferay, IncPowered by Gatsby and Netlify