Links & Notes

Enhance Figr’s product understanding with contextual links and detailed notes. Share references, document decisions, and provide ongoing guidance that shapes every design.

Types of Contextual Information

Reference Links
Design Notes
Team Knowledge

External resources that inform design:

Product References

Live product URLs (staging/production)
Competitor websites and apps
Industry best practices
Design inspiration sources
Documentation sites

Research Resources

User testing videos
Analytics dashboards
Survey results
Case studies
Academic research

Contextual guidance and decisions:

Decision Notes:
"We use blue for primary actions because user testing 
showed 23% better click-through rates vs. green"

Constraint Notes:
"Mobile layouts must work with one-handed usage - 
primary actions in thumb reach zone"

Pattern Notes:
"Error messages appear below form fields, not above, 
based on eye-tracking studies"

Adding Links and References

Link Categories

Organize references by purpose:

Product Context

🔗 Production app: https://app.yourproduct.com
🔗 Staging environment: https://staging.yourproduct.com
🔗 Design system: https://design.yourcompany.com
🔗 Component library: https://storybook.yourproduct.com

Research & Analytics

📊 Google Analytics: dashboard.google.com/analytics
🎥 User testing videos: loom.com/share/user-research
📋 Survey results: typeform.com/results/user-survey
📈 Mixpanel dashboard: mixpanel.com/project/insights

Inspiration & Benchmarks

🎨 Design inspiration: dribbble.com/shots/saved
🏆 Best practices: nngroup.com/articles/mobile-ux
🔍 Competitor analysis: competitor.com/feature-name
📱 Mobile patterns: mobbin.design/patterns

Contextual Notes

Add detailed context and reasoning:

Note types:

📝 Design Decisions: Why certain choices were made
⚠️ Constraints: Technical or business limitations
💡 Insights: User research findings
🎯 Goals: Success metrics and objectives
🔄 Iterations: What was tried and why it changed

Smart Tagging

Automatic context organization:

Auto-tags based on content:
- #accessibility (WCAG, screen readers)
- #mobile-first (responsive, touch)
- #performance (load times, optimization)
- #conversion (CTAs, funnels)
- #enterprise (B2B, admin features)
- #onboarding (new user experience)

Note-Taking Best Practices

Effective Notes

Write notes that inform future designs:✅ Specific and actionable “Users expect save button top-right in admin interfaces”✅ Include reasoning “Single-column mobile layout because 68% of users are one-handed”✅ Reference data “Blue CTAs convert 15% better than green (A/B test July 2024)”

Context Hierarchy

Organize information by importance:🔴 Critical constraints (must follow) 🟡 Strong preferences (should follow) 🟢 Nice to have (consider when possible)Example: 🔴 “WCAG AA compliance required for government contract” 🟡 “Users prefer minimal form fields” 🟢 “Consider animation to delight users”

Link Processing & Integration

Automatic Analysis
Content Monitoring
Smart Suggestions

Figr analyzes linked content:

When you add: https://competitor.com/dashboard

Figr extracts:
✅ Visual design patterns
✅ Layout structures
✅ Color schemes and typography
✅ Interactive elements
✅ Content organization

Application:
"Referenced competitor uses sidebar navigation 
with collapsible sections - consider for enterprise users"

Figr suggests relevant links:

When designing checkout flow:
"Consider reviewing the Stripe checkout pattern you bookmarked"

When creating mobile layout:
"Reference the thumb-zone research from NN Group"

When adding error states:
"Check the error message guidelines in your design system"

Collaborative Notes

Team Contributions

Everyone adds their expertise:

Product Manager notes:
- Business requirements and constraints
- User feedback and feature requests
- Market research and competitive insights

Designer notes:
- Visual design decisions and rationale
- Usability insights and best practices
- Accessibility considerations

Engineer notes:
- Technical constraints and possibilities
- Performance implications
- Implementation complexity

Note Threading

Connected conversations:

Interface showing threaded notes and discussions around design decisions

Discussion flow:

Initial note with context
Team member responses and questions
Resolution and final decision
Reference in future designs

Knowledge Building

Cumulative team intelligence:

Month 1: Basic product context
Month 3: Pattern recognition and preferences
Month 6: Deep user understanding and edge cases
Month 12: Institutional knowledge and design wisdom

Advanced Features

Smart Linking

Automatic relationship detection:

When you mention "mobile navigation" in notes,
Figr suggests relevant:
- Mobile design pattern links
- Competitor mobile examples
- Touch interaction guidelines
- Accessibility mobile standards

Note Analytics

Understand knowledge usage:

Most referenced notes:
1. Mobile interaction guidelines
2. Brand color usage rules
3. Enterprise user requirements
4. Performance constraints

Insight: Mobile guidelines heavily used → 
Suggests mobile-first design approach

Integration with Design Process

Design Generation
Validation
Iteration

Notes influence AI suggestions:

Note: "Enterprise users need bulk actions"
Design output: Tables include checkboxes and bulk operation toolbar

Link: Mobile navigation best practices
Design output: Thumb-friendly navigation with clear touch targets

Automatic compliance checking:

Constraint note: "Buttons must be minimum 44px for accessibility"
Figr check: ✅ All buttons meet minimum size requirement

Reference link: Brand guidelines
Figr check: ✅ Colors match brand palette

Context-aware improvements:

Previous note: "Users confused by icon-only navigation"
Design suggestion: Add text labels to navigation icons

Research link: Form completion study
Design suggestion: Reduce form fields based on completion data

Explore Screen Sharing

Learn how to share your screen with Figr for the deepest product understanding possible.Screen Sharing →

How to Begin?

Canvas

Inputs and Research

Product Intelligence

Export and Share

Security & Legal

Links & Notes

Links & Notes

Types of Contextual Information

Product References

Research Resources

Adding Links and References

Note-Taking Best Practices

Effective Notes

Context Hierarchy

Link Processing & Integration

Update Notifications

Relevance Scoring

Collaborative Notes

Advanced Features

Integration with Design Process

Explore Screen Sharing

​Links & Notes

​Types of Contextual Information

Product References

Research Resources

​Adding Links and References

​Note-Taking Best Practices

Effective Notes

Context Hierarchy

​Link Processing & Integration

Update Notifications

Relevance Scoring

​Collaborative Notes

​Advanced Features

​Integration with Design Process

Explore Screen Sharing

Links & Notes

Types of Contextual Information

Adding Links and References

Note-Taking Best Practices

Link Processing & Integration

Collaborative Notes

Advanced Features

Integration with Design Process