Figma - Communicating Fidelities | Figma
The conversation explores the appropriate use of Figma Design, FigJam, and Figma Slides depending on the audience and the type of feedback needed. Figma Design is ideal for design work and critiques with designers, while FigJam is suitable for gathering feedback from non-designers due to its interactive features like stickies and comments. Figma Slides is used for formal presentations, especially with larger audiences. The fidelity of the design artifact should match the feedback desired; high fidelity can deter critical feedback, while low fidelity encourages open discussion. The team also discusses the importance of setting expectations for feedback and the role of fidelity in influencing stakeholders. They emphasize the need for efficient communication and the use of appropriate tools to facilitate discussions and feedback sessions.
Key Points:
- Use Figma Design for detailed design work and critiques with designers.
- FigJam is best for interactive sessions and feedback from non-designers.
- Figma Slides is suitable for formal presentations, especially with large audiences.
- Match the fidelity of the design artifact to the type of feedback desired.
- Set clear expectations for feedback and use appropriate tools to facilitate discussions.
Details:
1. 🎤 Meet the Panelists: Advocates' Roles
- Clara, a designer advocate, is excited to discuss fidelities, a frequent topic of interest in the design community, highlighting her expertise in bridging design and user needs.
- Tom leads the advocacy team at Figma, offering insights from his extensive experience in design leadership to enhance user engagement and product development strategies.
- Katy Chers, an advocate at Figma, emphasizes the prevalent customer inquiries about choosing between Spig Jam and Figma Design, particularly with the addition of Slides, showcasing her role in guiding user decisions and clarifying product offerings.
2. 🛠️ Navigating Tool Selection: FigJam vs. Figma vs. Slides
- Figma excels for design work and is best shared with design-literate audiences, while FigJam is ideal for gathering feedback from non-designers due to its intuitive interface for comments and reactions.
- During synchronous sessions, FigJam's 'sticky chains' facilitate communication, yet Figma's comment feature is superior for asynchronous feedback, sending notifications to users.
- For formal presentations involving more than 20-30 people, Slides is recommended, as it accommodates larger audiences without interaction. FigJam or Figma are better suited for smaller, interactive sessions like design critiques.
- Tool choice hinges on audience size and desired interaction: Figma Slides is optimal for large, non-interactive presentations, while FigJam suits smaller, interactive groups.
- Figma Design serves medium-sized groups with moderate interaction, bridging the gap between FigJam's interactivity and Slides' formality.
3. 👥 Tailoring Feedback Collection to Your Audience
- Figma uses 'branching' to facilitate feedback, where designers create a branch, add their work, and engage in critique sessions without merging the branch, maintaining a linked artifact to the main file.
- Creating a non-precious environment in the branch encourages open feedback and experimentation without the pressure of altering the main project.
- The fidelity of work presented can influence the feedback received; super polished work may discourage critical feedback, while less polished work may invite more constructive criticism.
- Feedback goals should dictate the fidelity of the presentation—whether seeking approval or critical feedback, adjust the presentation's polish accordingly.
- Presenting high-fidelity work might impede feedback by making the work appear finished, whereas focusing on information hierarchy can shift attention away from visual details.
- Time investment in creating high-fidelity work varies; designers with access to a design system can produce polished work faster, impacting the feedback loop.
4. 🎨 Design Fidelity: Balancing Low and High
- Wireframe fidelity can vary from rough sketches to detailed design systems, impacting speed and conversation.
- Prioritize speed and communication over creating polished artifacts during wireframing.
- Component libraries can efficiently transition designs from low to high fidelity.
- Clearly communicate design purpose and patterns to avoid unnecessary aesthetic feedback.
- Establishing patterns reduces aesthetic questions; proactive communication minimizes confusion.
- Use annotations for non-standard components to guide feedback.
5. 🖋️ Understanding Wireframing and Design Systems
- Establish an open culture for cross-functional feedback with clear expectations on response times, ensuring contributors understand that not all feedback will be immediately actionable but may be revisited in future sprints.
- Set communication guidelines for feedback, especially in asynchronous settings like Slack, to manage expectations and clarify limitations, ensuring effective understanding among all team members.
- Incorporate structured engagement rituals or guidelines during design critiques to streamline feedback processes, setting clear expectations and enhancing the efficiency of feedback integration into the design process.
6. 📊 FigJam vs. Slides: Effective Presentations
- FigJam's interactive features, like sticky notes, allow for real-time feedback and contextual comments, enhancing collaborative meetings. However, it requires careful management to avoid distractions during presentations.
- Slides are optimal for structured presentations with a clear narrative, ensuring audience focus through linear content flow, which reduces potential distractions common in more interactive settings.
- FigJam enables a non-linear review of content, letting viewers revisit complex charts or graphs for better understanding, making it suitable for dynamic discussions.
- Slides ensure consistent audience engagement by following a predetermined path, making them ideal for presentations with specific timing and narrative flow.
7. 🤝 Medium Fidelity: Enhancing Team Collaboration
- High-fidelity prototypes can be used early in a project to effectively sell a vision and gain team buy-in, although this requires weighing the trade-offs in time and resources.
- In situations with roadmap constraints, exploring alternative ideas may necessitate additional design or engineering resources to align with the team's conviction in a new direction.
- Maker week events allow teams to present both polished ideas and quick prototypes, emphasizing the importance of context and user impact in gaining momentum and excitement.
- Higher fidelity prototypes can bridge the gap between the clarity of an idea in the creator’s mind and the perception of others, enhancing communication of the vision.
- For complex ideas, additional time and effort in developing higher fidelity prototypes or real code prototypes can be necessary to accurately convey functionality and user interaction.
- Psychological tactics, such as presenting options in a specific order or adding appealing animations, can influence decision-making and make certain ideas more appealing.
8. 💡 Design Evolution: Documenting Artifacts
- Designers often work on a canvas duplicating frames, creating multiple variations, which documents the evolution of design artifacts.
- Maintaining a record of all design artifacts helps in demonstrating the breadth of exploration and decisions made, even if 90% of the work is not used.
- Presenting unused design variations can help justify why certain obvious solutions were dismissed, enhancing credibility in presentations.
- Sharing all explored options can pre-emptively answer questions about obvious solutions and build a narrative leading to the recommended solution.
- Linking design artifacts within tools like Figma and F Jam aids in creating a comprehensive, interactive presentation that showcases the design journey.
- Integrating prototypes directly into presentation slides enhances storytelling and provides a holistic view of the design process.
9. 🔄 Prototyping Strategies: Click-throughs to High Fidelity
- The fidelity of feedback should match the fidelity of the prototype; high-fidelity prototypes provide more detailed feedback.
- Use click-through prototypes for testing navigation patterns or basic user flows, as they save time and resources.
- High-fidelity prototypes are recommended for testing complex interactions like login flows or form validations.
- Consider the audience of the prototype (e.g., executives, customers, designers) to determine the appropriate level of fidelity.
- Assess the purpose of the prototype: whether it's for user testing, stakeholder presentations, or internal design discussions.
- Differentiate between prototypes meant for user interaction testing and those used as design conversation starters.
- Transitioning from low-fidelity to high-fidelity prototypes should align with the complexity of features being tested.
- Examples of low-fidelity prototypes include sketches or wireframes for initial feedback, while high-fidelity prototypes might involve interactive digital mockups for detailed interaction analysis.
10. 🔍 Medium Fidelity Artifacts: Practical Examples
- Medium fidelity artifacts strike a balance between low and high fidelity designs, providing a realistic view without requiring all the fine details. This allows designers to quickly produce visuals for feedback, enabling iterative refinement.
- Mockups are an example of medium fidelity artifacts. They are sufficiently detailed to convey design intent but are not fully refined, allowing for flexibility and quick changes.
- Focusing too early on design details like spacing and components can slow down the development process. Instead, medium fidelity designs prioritize user feedback to guide refinement.
- These designs often blend static and functional elements, using real components alongside placeholders or sketches. This approach orients users with some high fidelity components while maintaining flexibility with lower fidelity elements.
- The primary goal is to balance realism and flexibility, enabling quick iterations and adjustments based on user feedback to refine the design progressively.
11. 🗣️ Meeting Fidelity: Planning and Execution
- Meeting fidelity ranges from low to high, impacting preparation and engagement styles. Low fidelity is casual, requiring minimal preparation, suitable for informal team discussions.
- High fidelity involves polished presentations and narratives, ideal for high-impact meetings where formal decision-making occurs.
- Medium fidelity balances structure and creativity, using tools like Figma and FigJam for interactive sessions that combine prepared content with open brainstorming.
- An example of medium fidelity is starting with polished slides for structured information sharing, then using FigJam for collaborative brainstorming.
- Interactive elements like voting scales in Figma enhance meetings by providing structured feedback on product visions.
- The level of meeting fidelity should match the meeting's formality and impact. High-impact meetings necessitate high fidelity, while casual sessions benefit from low fidelity.
- Tool choices convey the formality of ideas; informal tools like Figma's pencil tool encourage creativity and open input.
- Meetings can adapt fidelity levels dynamically to suit evolving needs, rather than following a linear progression.
12. 🎥 Communicating Effectively with Visual Artifacts
- Designers often resort to quickly screenshotting production work and editing in Figma to communicate ideas rapidly, acknowledging that these artifacts may be imperfect but sufficient to spark conversation.
- There is a balance between high-fidelity design work and quick, lower-fidelity mockups, with the latter often being more efficient for initial feedback and ideation. Choosing the right level of fidelity for a visual artifact is a skill developed over time, with the wrong choice potentially derailing meetings.
- Visual artifacts, even in rough form, can effectively drive conversation and engagement, sometimes more so than written documents. A case study mentioned that quick mockups in Figma were more effective in generating team feedback compared to lengthy written documents.
- The choice of artifact should align with the desired feedback and stakeholder influence, with visual artifacts often preferred to overcome communication barriers.
13. 🕒 Managing Time in Meetings and Feedback Sessions
- Determine the intended lifespan of meeting artifacts, whether they are for short-term or long-term use, and choose the appropriate medium accordingly.
- Leverage video walkthroughs with voiceovers to clarify complex issues or design proposals, saving time by avoiding the need for extensive UI mock-ups.
- Send video walkthroughs or other media through messaging channels to help stakeholders quickly grasp problems without having to read detailed documents multiple times.
- Recreate problems in the product environment and provide concise walkthroughs to clearly demonstrate challenges and propose actionable changes.
- Implement specific time management techniques during meetings, such as setting strict time limits for each agenda item and using a timer to ensure adherence.
- Encourage the use of concise and targeted media presentations to facilitate quicker decision-making and feedback sessions.
14. 💬 Rubber Duck Debugging: Clarifying Your Message
- Rubber duck debugging involves explaining a problem out loud, often leading to self-discovery of solutions.
- The process of writing out a problem, such as on Stack Overflow, can result in realizing the solution before even posting it, demonstrating the power of articulation.
- Creating visual aids can significantly enhance communication and understanding, especially when the initial explanation is unclear or complex.
- Optimizing messages for clarity and speed is crucial, considering the reader's time constraints and the need for effective communication.
- Effective communication should balance the speed of message creation with the ease of understanding for the recipient.
- Stakeholders often have limited time, so messages must be clear and simple to ensure efficient decision-making processes.
- In certain scenarios, such as team brainstorming sessions, more detailed and lower-fidelity discussions can foster creativity and comprehensive understanding.
15. 🧩 Engaging Narratives in Meeting Facilitation
- Practicing multiple takes for a two-minute Real Time video walkthrough helps clarify language and improve conciseness, acting as preparation for live presentations.
- Meeting facilitators are stewards of participants' time, emphasizing the importance of well-prepared and purposeful meetings.
- Time-boxing brainstorming sessions is beneficial but can also hinder creativity; facilitators should ensure opportunities for idea continuation post-session.
- Facilitators must set clear expectations and deadlines, ensuring participants know their contributions are valued and will be revisited.
- The transition from full-day workshops to shorter sessions challenges idea generation, highlighting the need for effective time management in meetings.
- Effective time management techniques include setting a clear agenda, prioritizing key discussion points, and allocating specific time slots for each agenda item.
- Strategies to maintain creativity in time-boxed sessions include allowing flexible breakout groups and encouraging asynchronous idea sharing.
- Examples of facilitating engaging meetings include using interactive tools, such as polls and collaborative platforms, to ensure participant engagement.