The wonderful thing about templates is that they include every element you need to create an accurate prototype. The Editing Feature and the Contextual Menu are examples of that. This tutorial will explain the purpose behind these features and how to get the best from them.
Templates save us time when adding elements included by default in every app and are part of our application design. Templates can consist of default elements such as switches, sliders, alerts, text fields, colors, keyboard, etc. Usually, they are visually aligned with the operative system you are designing for; If you are creating an application for IOS, trust that every element in the template will correspond to what iPhone devices actually use.
NOTE: Don’t know how to open a Template? Go check How To Access Templates in Figma.
Why do I need to know about Editing Boxes and Contextual Menu? Hold on there. We’ve seen people design these features from scratch without knowing they were actually available in the template, so it allows us to save you some time. First, let’s check the Template.
This template shows an iPhone design. The Editing section will provide the options that fit the best IOS brand identity. For example, you can choose between dark-light mode and replace the text box with what you need. The section below shows how each option will display depending on your design.
Long story short, Contextual Menu comes in handy when your application includes a section for Favorites, or you want to habilitate an option for the user to customize a section. For example, when you long press your phone's screen, a contextual menu appears with quick displayable actions, and you can quickly choose between them.
In conclusion, only some templates will include these sections, but when they do, better to take advantage of them. So, let’s keep exploring more of these features and make our projects a reality with Figma. Stay tuned!
