Dribbble Skill

Overview

Quick Install

curl -sSL https://canifi.com/skills/dribbble/install.sh | bash

cp -r skills/dribbble ~/.canifi/skills/

Setup

# First, ensure canifi-env is installed:
# curl -sSL https://canifi.com/install.sh | bash

canifi-env set DRIBBBLE_EMAIL "your-email@example.com"
canifi-env set DRIBBBLE_PASSWORD "your-password"

Privacy & Authentication

Option 1: Manual Browser Login (Recommended)

1. Complete the Browser Automation Setup using CDP mode
2. Login to the service manually in the Playwright-controlled Chrome window
3. Claude will use your authenticated session without ever seeing your password

Option 2: Environment Variables

canifi-env set SERVICE_EMAIL "your-email"
canifi-env set SERVICE_PASSWORD "your-password"

Capabilities

• Browse and search design shots
• Save designs to collections/buckets
• View designer profiles and portfolios
• Manage uploaded shots and projects
• Follow designers and teams
• Search for design jobs and freelance work

Usage Examples

Example 1: Find Design Inspiration

User: "Find mobile app UI inspiration for a fitness app"
Claude: I'll search for fitness app designs on Dribbble.
1. Opening Dribbble via Playwright MCP
2. Searching for "fitness app mobile UI"
3. Browsing top-rated shots
4. Saving relevant designs to a collection
5. Compiling inspiration summary with links

Example 2: Review Portfolio

User: "Show me my Dribbble portfolio analytics"
Claude: I'll pull up your portfolio stats.
1. Navigating to your Dribbble profile
2. Accessing shot analytics
3. Reviewing views, likes, and saves
4. Summarizing performance trends

Example 3: Find Designers

User: "Find UI designers available for freelance work"
Claude: I'll search for available designers.
1. Accessing Dribbble Pro/Hiring section
2. Filtering for UI designers
3. Filtering by availability status
4. Compiling list of potential candidates

Authentication Flow

1. Navigate to dribbble.com via Playwright MCP
2. Click "Sign in" and enter credentials
3. Handle 2FA if enabled (via iMessage)
4. Maintain session cookies
5. Handle Pro features if subscribed

Error Handling

• Login Failed: Retry up to 3 times, notify via iMessage
• Session Expired: Re-authenticate automatically
• Rate Limited: Implement backoff for API-like actions
• 2FA Required: Send iMessage notification
• Search Failed: Try alternative search terms
• Profile Not Found: Verify username or prompt user

Self-Improvement Instructions

1. Document new search filters and options
2. Update navigation patterns for shots
3. Track any changes to profile layouts
4. Log new portfolio features

Notes

• Pro features require Dribbble Pro subscription
• Shot uploads have quality and format requirements
• Hiring features may have additional verification
• Collection limits vary by account type
• Some features are member-only