I’m trying out Figma to see if it’s a good fit to work with as a UI/UX consultant. However, I can’t seem to find what I regard as a crucial feature, and the backbone of the type of UI/UX work I do: Some way of documenting/describing the functionality of the mockup. The Figma styling and design tools are great, and while limited the interaction functionality is ok (and seem to be developing with interactive variants), but I can’t seem to find any documentation support?
What I’m talking about is the explanation layer of your design concept: what does the data in this table represent, what should happen if you press this button, what should change if you change your selection in this list, when should these controls be enabled/disable etc etc. In other words the description of how the interface and system should work when implemented, not just how it should look.
How do you work with documentation/specification of functionality? Am I just missing how to add this in Figma? Is there some plugin to do this? Or do you supplement the Figma project with additional documentation in other systems where functionality is specified for the different components?
So, Figma has built in documentation fields for components & styles. They have description boxes and documentation link fields as you can see in my screenshot
Tis information is then visibile to designers through tool typ or style detail, and for developers through the inspect panel.
Hello, thanks for the quick reply. What you’re describing seems like documentation of styles and components. What I’m after is documentation/description text of the actual prototypes you build from these components.
In other words not how a specific icon or button type should be used for example, but instead describing the functionality of your prototype. For example what should happen when you press a certain button, or what information should be displayed in a field in your mockup.
Thanks for the tip, the “Annotate it!” plugin seems very promising in that it has an interface where you can create annotations linked to frames in your prototype like I’d like to. However, I’ve yet to understand how to then show that annotation text in presentation mode, and the little annotation markers/numbers only seem to be visible in edit mode.
Ideally I’d like something like this, but where the result is a list of such annotations that you can toggle on/off in presentation mode to read the beside the prototype display.
