by @madappgang
|
This skill provides prompting patterns, checklists, and templates for conducting UI design reviews using Gemini's multimodal vision capabilities.
# Check API key availability and select model
determine_gemini_model() {
if [[ -n "$GEMINI_API_KEY" ]]; then
echo "g/gemini-3-pro-preview" # Direct Gemini API
elif [[ -n "$OPENROUTER_API_KEY" ]]; then
echo "google/gemini-3-pro-preview" # OpenRouter
else
echo "ERROR: No API key available (need GEMINI_API_KEY or OPENROUTER_API_KEY)"
return 1
fi
}
GEMINI_MODEL=$(determine_gemini_model)
or/ Prefix for OpenRouterThe model ID google/gemini-3-pro-preview collides with Claudish's automatic routing:
| Model ID | Routes To | Requires |
|---|---|---|
google/gemini-* | Gemini Direct | GEMINI_API_KEY |
google/gemini-* | OpenRouter | OPENROUTER_API_KEY |
g/gemini-* | Gemini Direct (explicit) | GEMINI_API_KEY |
Rule: Always use or/ prefix when routing Google models through OpenRouter.
# Pass image file directly with --image flag
npx claudish --model "$GEMINI_MODEL" --image "$IMAGE_PATH" --quiet --auto-approve <<< "$ANALYSIS_PROMPT"
# Example
npx claudish --model "g/gemini-3-pro-preview" --image "screenshots/dashboard.png" --quiet --auto-approve <<< "Analyze this UI for usability issues."
# Encode image to base64
IMAGE_B64=$(base64 -i "$IMAGE_PATH")
# Include in prompt with data URI
printf '%s' "[Image: data:image/png;base64,$IMAGE_B64]
Analyze this UI for usability issues." | npx claudish -...