About Me
Advanced Figma Techniques
1 Introduction to Advanced Figma Techniques
1-1 Overview of Figma
1-2 Importance of Advanced Techniques
1-3 Course Objectives
2 Mastering Layers and Groups
2-1 Understanding Layers Panel
2-2 Creating and Managing Groups
2-3 Nesting Layers and Groups
2-4 Layer Styles and Effects
3 Advanced Vector Tools
3-1 Pen Tool Techniques
3-2 Bezier Curves and Paths
3-3 Boolean Operations
3-4 Combining and Subtracting Shapes
4 Prototyping and Interactions
4-1 Introduction to Prototyping
4-2 Creating Interactive Elements
4-3 Linking Frames and Pages
4-4 Advanced Animation Techniques
5 Advanced Typography
5-1 Custom Fonts and Text Styles
5-2 Paragraph and Character Styles
5-3 Text on a Path
5-4 Advanced Text Effects
6 Working with Components
6-1 Introduction to Components
6-2 Creating and Managing Components
6-3 Variants and Instances
6-4 Overriding Component Properties
7 Advanced Styling and Theming
7-1 Introduction to Styles
7-2 Creating and Applying Styles
7-3 Theming in Figma
7-4 Dynamic Styles and Variables
8 Collaboration and Version Control
8-1 Real-time Collaboration
8-2 Version History and Control
8-3 Comments and Feedback
8-4 Sharing and Exporting Files
9 Plugins and Integrations
9-1 Introduction to Figma Plugins
9-2 Popular Plugins for Advanced Techniques
9-3 Integrating with Third-Party Tools
9-4 Creating Custom Plugins
10 Advanced Exporting and Assets Management
10-1 Export Settings and Options
10-2 Batch Exporting
10-3 Managing Assets and Libraries
10-4 Automating Export Processes
11 Advanced Workspace and Customization
11-1 Customizing the Workspace
11-2 Keyboard Shortcuts and Productivity Tips
11-3 Creating Custom Templates
11-4 Optimizing Workflow
12 Final Project and Review
12-1 Project Guidelines and Requirements
12-2 Developing a Comprehensive Design
12-3 Peer Review and Feedback
12-4 Final Submission and Certification
8-3 Comments and Feedback in Figma

8-3 Comments and Feedback in Figma

Key Concepts

Adding Comments

Adding comments in Figma allows designers and collaborators to provide feedback directly on the design canvas. To add a comment, select the comment tool from the toolbar, click on the area of the design where you want to leave a comment, and type your message. Comments can be used to highlight issues, suggest improvements, or ask questions.

Think of adding comments as leaving sticky notes on a design. Just as sticky notes provide quick feedback on a physical document, comments provide quick feedback on a digital design.

Viewing Comments

Viewing comments in Figma allows designers to see feedback left by collaborators. Comments are displayed as icons on the design canvas, and clicking on an icon reveals the comment thread. Designers can also view all comments in the right-hand panel under the "Comments" tab.

Consider viewing comments as reading notes from a classmate. Just as you might read notes left by a classmate to understand their perspective, viewing comments helps designers understand the feedback provided by collaborators.

Replying to Comments

Replying to comments in Figma allows designers and collaborators to engage in a conversation about specific feedback. To reply to a comment, click on the comment icon or open the comment thread in the right-hand panel and type your response. Replying to comments helps clarify feedback and ensures that all parties are on the same page.

Think of replying to comments as having a conversation in a group chat. Just as you might respond to a message in a group chat to clarify a point, replying to comments helps clarify feedback and fosters collaboration.

Resolving Comments

Resolving comments in Figma marks feedback as addressed and closes the comment thread. To resolve a comment, click on the comment icon or open the comment thread in the right-hand panel and click the "Resolve" button. Resolving comments helps keep track of which feedback has been addressed and ensures that the design process remains organized.

Consider resolving comments as marking a task as complete. Just as you might mark a task as complete in a to-do list, resolving comments marks feedback as addressed and helps maintain an organized workflow.

Comment Notifications

Comment notifications in Figma alert designers and collaborators when new comments are added or when there are replies to existing comments. Notifications can be received via email or through the Figma app. Comment notifications ensure that everyone stays informed about the latest feedback and discussions.

Think of comment notifications as text message alerts. Just as you might receive a text message alert when someone sends you a message, comment notifications keep you informed about new feedback and discussions.

Comment Threads

Comment threads in Figma group related comments and replies together, creating a conversation around a specific piece of feedback. Comment threads help organize feedback and make it easier to follow the discussion. Designers can expand or collapse comment threads to focus on specific areas of feedback.

Consider comment threads as a conversation in a chat room. Just as a chat room groups related messages together, comment threads group related feedback and replies, making it easier to follow the discussion.

Comment Filters

Comment filters in Figma allow designers to filter comments based on criteria such as unresolved comments, comments assigned to specific team members, or comments made by specific individuals. Comment filters help designers focus on the most relevant feedback and manage the review process more efficiently.

Think of comment filters as search filters in an online store. Just as search filters help you find specific products, comment filters help you find specific feedback, making it easier to manage the review process.

Comment History

Comment history in Figma allows designers to view the history of comments and changes made to a design file. Comment history helps designers track the evolution of feedback and understand how the design has been refined over time. Designers can access comment history by clicking on the "History" tab in the right-hand panel.

Consider comment history as a timeline of a project. Just as a timeline shows the progression of events, comment history shows the progression of feedback and changes, helping designers understand the evolution of the design.

Examples and Analogies

Imagine collaborating on a website design with a team. By using comments, you can leave feedback on specific elements, such as suggesting a different color for a button. Your team can then reply to your comment, discussing the best color choice. Once the color is decided, you can resolve the comment, marking it as addressed. Comment notifications keep everyone informed about the latest feedback, and comment threads help organize the discussion. Comment filters allow you to focus on unresolved feedback, and comment history helps you track the evolution of the design.

Consider a design review process as a brainstorming session. Just as a brainstorming session involves multiple people providing feedback and ideas, the design review process involves multiple collaborators providing feedback through comments. Comment threads help organize the brainstorming, and resolving comments marks ideas as implemented, keeping the session organized and productive.

© 2024 Ahmed Baheeg Khorshid. All rights reserved.