![]() ![]() It can be useful if you want to make a sign-up form or a product card. This feature allows you to insert one auto layout frame inside of another. The workshop will be running from 9:30 to 17:30 on Monday, October 9. This full-day workshop will take place the day before SmashingConf. Christine firmly believes designers and developers should understand each other’s tools to enable constructive dialogue. She is the founder of moonlearning.io, an online UX/UI learning platform. About Christine VallaureĬhristine is a UX/UI Designer with a passion for code with over ten years of experience. To get the most out of the workshop, you’ll need to bring a laptop. Many exercises today as auto layout, is all about practice, practice, and practice.A few tips and tricks (aspect ratio, slot components and more).Creating more advanced components and entire pages.Basic and advanced auto layout settings via the menu.When constraints are not enough: Intro to auto layout.What are constraints, and how to use them.Responsive design and responsive components intro. ![]() And as a designer, your developers will probably love you a little bit more. As a developer you get to feel the magic of designing in Figma. And of course, some advanced techniques, tips, tricks and hacks you will loveĪt the end of this class, you will have the perfect setup for your design to get coded the way you imagined it to be.Different approaches to documenting and sharing your work with the development team.How to test responsive components and pages with breakpoints in Figma.Understanding the limitations of constraints and auto layout and when to use what.How to create nested, responsive components and even entire responsive pages with auto layout and constraints.When and how to use variants and component properties to add an extra layer of structure to your designs.Setting up and working with components and keeping them organized.What will attendees learn in this workshop?Īt the end of the course, you will have gained an in-depth understanding of: You should have basic knowledge of Figma and be able to set up a design, but no need to be an expert. And, of course, as a special welcome to developers who want to improve the collaboration between design and code from the other side. You might also like this workshop if you switch from another software like Sketch and XD. Ideal for beginner/intermediate-level UI Designers or those switching from graphic design to UI Design who are eager to understand a little more about UI design’s technicality. We will work with a good mix of theory and hands-on exercises and plenty of room for your questions. This workshop will focus on understanding the technical aspects of setting up your design to improve the communication, documentation, and handoff between design and (front-end) development. We will learn about constraints, auto layout, and, most important but often neglected, how to work with breakpoints in Figma to test and document responsive behavior. The afternoon will be dedicated to a deep dive into responsive design with Figma. We will look at different options to document and share components with other team members and development. How to set them up, when to turn them into component sets with variants, and how to add component properties for better alignment with code. In the morning, we will learn everything about advanced components. ![]()
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |