Introduction
This course is designed for designers, integrators, and teams who already have a Figma file and want to learn how to prepare, adjust, and correctly import it into GeneXus using the Design Import tool.
Throughout the course, you will learn to review and simplify the file, apply naming conventions, model components correctly, and manage responsiveness and prototyping properties to ensure that design decisions are correctly reflected during import.
Objective
Acquire the necessary knowledge to:
- Review and prepare a Figma file for import into GeneXus, simplifying its structure and eliminating unnecessary elements.
- Apply naming and modeling conventions that allow GeneXus to correctly interpret each element of the design.
- Configure responsiveness properties, Auto Layout, and constraints that directly impact frontend generation.
- Identify and resolve the most common technical limitations during import and prepare the final file in an organized and consistent manner.
Focus
We will focus on the technical adjustments necessary to convert a design file into an import-ready file, covering everything from reviewing and simplifying the file to configuring conventions, responsiveness, prototyping, and the import process in GeneXus.
The course combines theory, practical examples, and best practices aligned with the official GeneXus documentation, promoting a collaborative approach between design and integration, based on efficiency, consistency, and scalability.
Prerequisites
This course is a direct continuation of From Figma to GeneXus: Design Stage. It is recommended that you have completed this course before starting, as the concepts of componentization, naming conventions, and systematization are assumed.
Additionally, the following are recommended:
- Solid knowledge of Figma: components, variants, styles, Auto Layout, and constraints.
- Familiarity with the GeneXus environment and the Design Import tool.
- Basic understanding of responsive design and prototyping in Figma.
Who is this course for?
Product designers, UI/UX designers, and integrators who work with GeneXus and want to ensure that their Figma file is correctly interpreted during import, optimizing collaboration between design and development.
Practical Exercise
The course does not include a separate practical exercise, but it is recommended to apply the settings to your own Figma file and import it into GeneXus to verify the results in each module.
Actual video length
48 minutes
Estimated viewing and understanding time
2 hours
Software used
- Figma
- GeneXus (with the Design Import tool)