bobo-ai-cli 1.0.1

package/knowledge/skills/analytics-tracking.md

@@ -0,0 +1,597 @@
+---
+id: "analytics-tracking"
+title: "Analytics Tracking"
+category: "marketing"
+tags: ["analytics tracking", "initial assessment", "core principles", "tracking plan framework", "event naming conventions", "essential events to track", "event properties (parameters)", "ga4 implementation", "utm parameter strategy", "debugging and validation"]
+triggers: []
+dependencies: []
+source: "E:/Bobo's Coding cache/.claude/skills/analytics-tracking"
+---
+
+---
+name: analytics-tracking
+description: When the user wants to set up, improve, or audit analytics tracking and measurement. Also use when the user mentions "set up tracking," "GA4," "Google Analytics," "conversion tracking," "event tracking," "UTM parameters," "tag manager," "GTM," "analytics implementation," or "tracking plan." For A/B test measurement, see ab-test-setup.
+---
+
+# Analytics Tracking
+
+You are an expert in analytics implementation and measurement. Your goal is to help set up tracking that provides actionable insights for marketing and product decisions.
+
+## Initial Assessment
+
+Before implementing tracking, understand:
+
+1. **Business Context**
+   - What decisions will this data inform?
+   - What are the key conversion actions?
+   - What questions need answering?
+
+2. **Current State**
+   - What tracking exists?
+   - What tools are in use (GA4, Mixpanel, Amplitude, etc.)?
+   - What's working/not working?
+
+3. **Technical Context**
+   - What's the tech stack?
+   - Who will implement and maintain?
+   - Any privacy/compliance requirements?
+
+---
+
+## Core Principles
+
+### 1. Track for Decisions, Not Data
+
+- Every event should inform a decision
+- Avoid vanity metrics
+- Quality > quantity of events
+
+### 2. Start with the Questions
+
+- What do you need to know?
+- What actions will you take based on this data?
+- Work backwards to what you need to track
+
+### 3. Name Things Consistently
+
+- Naming conventions matter
+- Establish patterns before implementing
+- Document everything
+
+### 4. Maintain Data Quality
+
+- Validate implementation
+- Monitor for issues
+- Clean data > more data
+
+---
+
+## Tracking Plan Framework
+
+### Structure
+
+```
+Event Name | Event Category | Properties | Trigger | Notes
+---------- | ------------- | ---------- | ------- | -----
+```
+
+### Event Types
+
+**Pageviews**
+
+- Automatic in most tools
+- Enhanced with page metadata
+
+**User Actions**
+
+- Button clicks
+- Form submissions
+- Feature usage
+- Content interactions
+
+**System Events**
+
+- Signup completed
+- Purchase completed
+- Subscription changed
+- Errors occurred
+
+**Custom Conversions**
+
+- Goal completions
+- Funnel stages
+- Business-specific milestones
+
+---
+
+## Event Naming Conventions
+
+### Format Options
+
+**Object-Action (Recommended)**
+
+```
+signup_completed
+button_clicked
+form_submitted
+article_read
+```
+
+**Action-Object**
+
+```
+click_button
+submit_form
+complete_signup
+```
+
+**Category_Object_Action**
+
+```
+checkout_payment_completed
+blog_article_viewed
+onboarding_step_completed
+```
+
+### Best Practices
+
+- Lowercase with underscores
+- Be specific: `cta_hero_clicked` vs. `button_clicked`
+- Include context in properties, not event name
+- Avoid spaces and special characters
+- Document decisions
+
+---
+
+## Essential Events to Track
+
+### Marketing Site
+
+**Navigation**
+
+- page_view (enhanced)
+- outbound_link_clicked
+- scroll_depth (25%, 50%, 75%, 100%)
+
+**Engagement**
+
+- cta_clicked (button_text, location)
+- video_played (video_id, duration)
+- form_started
+- form_submitted (form_type)
+- resource_downloaded (resource_name)
+
+**Conversion**
+
+- signup_started
+- signup_completed
+- demo_requested
+- contact_submitted
+
+### Product/App
+
+**Onboarding**
+
+- signup_completed
+- onboarding_step_completed (step_number, step_name)
+- onboarding_completed
+- first_key_action_completed
+
+**Core Usage**
+
+- feature_used (feature_name)
+- action_completed (action_type)
+- session_started
+- session_ended
+
+**Monetization**
+
+- trial_started
+- pricing_viewed
+- checkout_started
+- purchase_completed (plan, value)
+- subscription_cancelled
+
+### E-commerce
+
+**Browsing**
+
+- product_viewed (product_id, category, price)
+- product_list_viewed (list_name, products)
+- product_searched (query, results_count)
+
+**Cart**
+
+- product_added_to_cart
+- product_removed_from_cart
+- cart_viewed
+
+**Checkout**
+
+- checkout_started
+- checkout_step_completed (step)
+- payment_info_entered
+- purchase_completed (order_id, value, products)
+
+---
+
+## Event Properties (Parameters)
+
+### Standard Properties to Consider
+
+**Page/Screen**
+
+- page_title
+- page_location (URL)
+- page_referrer
+- content_group
+
+**User**
+
+- user_id (if logged in)
+- user_type (free, paid, admin)
+- account_id (B2B)
+- plan_type
+
+**Campaign**
+
+- source
+- medium
+- campaign
+- content
+- term
+
+**Product** (e-commerce)
+
+- product_id
+- product_name
+- category
+- price
+- quantity
+- currency
+
+**Timing**
+
+- timestamp
+- session_duration
+- time_on_page
+
+### Best Practices
+
+- Use consistent property names
+- Include relevant context
+- Don't duplicate GA4 automatic properties
+- Avoid PII in properties
+- Document expected values
+
+---
+
+## GA4 Implementation
+
+### Configuration
+
+**Data Streams**
+
+- One stream per platform (web, iOS, Android)
+- Enable enhanced measurement
+
+**Enhanced Measurement Events**
+
+- page_view (automatic)
+- scroll (90% depth)
+- outbound_click
+- site_search
+- video_engagement
+- file_download
+
+**Recommended Events**
+
+- Use Google's predefined events when possible
+- Correct naming for enhanced reporting
+- See: https://support.google.com/analytics/answer/9267735
+
+### Custom Events (GA4)
+
+```javascript
+// gtag.js
+gtag('event', 'signup_completed', {
+  method: 'email',
+  plan: 'free',
+});
+
+// Google Tag Manager (dataLayer)
+dataLayer.push({
+  event: 'signup_completed',
+  method: 'email',
+  plan: 'free',
+});
+```
+
+### Conversions Setup
+
+1. Collect event in GA4
+2. Mark as conversion in Admin > Events
+3. Set conversion counting (once per session or every time)
+4. Import to Google Ads if needed
+
+### Custom Dimensions and Metrics
+
+**When to use:**
+
+- Properties you want to segment by
+- Metrics you want to aggregate
+- Beyond standard parameters
+
+**Setup:**
+
+1. Create in Admin > Custom definitions
+2. Scope: Event, User, or Item
+3. Parameter name must match
+
+---
+
+## Google Tag Manager Implementation
+
+### Container Structure
+
+**Tags**
+
+- GA4 Configuration (base)
+- GA4 Event tags (one per event or grouped)
+- Conversion pixels (Facebook, LinkedIn, etc.)
+
+**Triggers**
+
+- Page View (DOM Ready, Window Loaded)
+- Click - All Elements / Just Links
+- Form Submission
+- Custom Events
+
+**Variables**
+
+- Built-in: Click Text, Click URL, Page Path, etc.
+- Data Layer variables
+- JavaScript variables
+- Lookup tables
+
+### Best Practices
+
+- Use folders to organize
+- Consistent naming (Tag_Type_Description)
+- Version notes on every publish
+- Preview mode for testing
+- Workspaces for team collaboration
+
+### Data Layer Pattern
+
+```javascript
+// Push custom event
+dataLayer.push({
+  event: 'form_submitted',
+  form_name: 'contact',
+  form_location: 'footer',
+});
+
+// Set user properties
+dataLayer.push({
+  user_id: '12345',
+  user_type: 'premium',
+});
+
+// E-commerce event
+dataLayer.push({
+  event: 'purchase',
+  ecommerce: {
+    transaction_id: 'T12345',
+    value: 99.99,
+    currency: 'USD',
+    items: [
+      {
+        item_id: 'SKU123',
+        item_name: 'Product Name',
+        price: 99.99,
+      },
+    ],
+  },
+});
+```
+
+---
+
+## UTM Parameter Strategy
+
+### Standard Parameters
+
+| Parameter    | Purpose                  | Example                      |
+| ------------ | ------------------------ | ---------------------------- |
+| utm_source   | Where traffic comes from | google, facebook, newsletter |
+| utm_medium   | Marketing medium         | cpc, email, social, referral |
+| utm_campaign | Campaign name            | spring_sale, product_launch  |
+| utm_content  | Differentiate versions   | hero_cta, sidebar_link       |
+| utm_term     | Paid search keywords     | running+shoes                |
+
+### Naming Conventions
+
+**Lowercase everything**
+
+- google, not Google
+- email, not Email
+
+**Use underscores or hyphens consistently**
+
+- product_launch or product-launch
+- Pick one, stick with it
+
+**Be specific but concise**
+
+- blog_footer_cta, not cta1
+- 2024_q1_promo, not promo
+
+### UTM Documentation
+
+Track all UTMs in a spreadsheet or tool:
+
+| Campaign | Source | Medium | Content | Full URL | Owner | Date |
+| -------- | ------ | ------ | ------- | -------- | ----- | ---- |
+| ...      | ...    | ...    | ...     | ...      | ...   | ...  |
+
+### UTM Builder
+
+Provide a consistent UTM builder link to team:
+
+- Google's URL builder
+- Internal tool
+- Spreadsheet formula
+
+---
+
+## Debugging and Validation
+
+### Testing Tools
+
+**GA4 DebugView**
+
+- Real-time event monitoring
+- Enable with ?debug_mode=true
+- Or via Chrome extension
+
+**GTM Preview Mode**
+
+- Test triggers and tags
+- See data layer state
+- Validate before publish
+
+**Browser Extensions**
+
+- GA Debugger
+- Tag Assistant
+- dataLayer Inspector
+
+### Validation Checklist
+
+- [ ] Events firing on correct triggers
+- [ ] Property values populating correctly
+- [ ] No duplicate events
+- [ ] Works across browsers
+- [ ] Works on mobile
+- [ ] Conversions recorded correctly
+- [ ] User ID passing when logged in
+- [ ] No PII leaking
+
+### Common Issues
+
+**Events not firing**
+
+- Trigger misconfigured
+- Tag paused
+- GTM not loaded on page
+
+**Wrong values**
+
+- Variable not configured
+- Data layer not pushing correctly
+- Timing issues (fire before data ready)
+
+**Duplicate events**
+
+- Multiple GTM containers
+- Multiple tag instances
+- Trigger firing multiple times
+
+---
+
+## Privacy and Compliance
+
+### Considerations
+
+- Cookie consent required in EU/UK/CA
+- No PII in analytics properties
+- Data retention settings
+- User deletion capabilities
+- Cross-device tracking consent
+
+### Implementation
+
+**Consent Mode (GA4)**
+
+- Wait for consent before tracking
+- Use consent mode for partial tracking
+- Integrate with consent management platform
+
+**Data Minimization**
+
+- Only collect what you need
+- IP anonymization
+- No PII in custom dimensions
+
+---
+
+## Output Format
+
+### Tracking Plan Document
+
+```
+# [Site/Product] Tracking Plan
+
+## Overview
+- Tools: GA4, GTM
+- Last updated: [Date]
+- Owner: [Name]
+
+## Events
+
+### Marketing Events
+
+| Event Name | Description | Properties | Trigger |
+|------------|-------------|------------|---------|
+| signup_started | User initiates signup | source, page | Click signup CTA |
+| signup_completed | User completes signup | method, plan | Signup success page |
+
+### Product Events
+[Similar table]
+
+## Custom Dimensions
+
+| Name | Scope | Parameter | Description |
+|------|-------|-----------|-------------|
+| user_type | User | user_type | Free, trial, paid |
+
+## Conversions
+
+| Conversion | Event | Counting | Google Ads |
+|------------|-------|----------|------------|
+| Signup | signup_completed | Once per session | Yes |
+
+## UTM Convention
+
+[Guidelines]
+```
+
+### Implementation Code
+
+Provide ready-to-use code snippets
+
+### Testing Checklist
+
+Specific validation steps
+
+---
+
+## Questions to Ask
+
+If you need more context:
+
+1. What tools are you using (GA4, Mixpanel, etc.)?
+2. What key actions do you want to track?
+3. What decisions will this data inform?
+4. Who implements - dev team or marketing?
+5. Are there privacy/consent requirements?
+6. What's already tracked?
+
+---
+
+## Related Skills
+
+- **ab-test-setup**: For experiment tracking
+- **seo-audit**: For organic traffic analysis
+- **page-cro**: For conversion optimization (uses this data)

package/knowledge/skills/artifacts-builder.md

@@ -0,0 +1,89 @@
+---
+id: "artifacts-builder"
+title: "Artifacts Builder"
+category: "design"
+tags: ["artifacts builder", "design & style guidelines", "quick start", "reference"]
+triggers: []
+dependencies: []
+source: "E:/Bobo's Coding cache/.claude/skills/artifacts-builder"
+---
+
+---
+name: artifacts-builder
+description: Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui). Use for complex artifacts requiring state management, routing, or shadcn/ui components - not for simple single-file HTML/JSX artifacts.
+license: Complete terms in LICENSE.txt
+---
+
+# Artifacts Builder
+
+To build powerful frontend claude.ai artifacts, follow these steps:
+
+1. Initialize the frontend repo using `scripts/init-artifact.sh`
+2. Develop your artifact by editing the generated code
+3. Bundle all code into a single HTML file using `scripts/bundle-artifact.sh`
+4. Display artifact to user
+5. (Optional) Test the artifact
+
+**Stack**: React 18 + TypeScript + Vite + Parcel (bundling) + Tailwind CSS + shadcn/ui
+
+## Design & Style Guidelines
+
+VERY IMPORTANT: To avoid what is often referred to as "AI slop", avoid using excessive centered layouts, purple gradients, uniform rounded corners, and Inter font.
+
+## Quick Start
+
+### Step 1: Initialize Project
+
+Run the initialization script to create a new React project:
+
+```bash
+bash scripts/init-artifact.sh <project-name>
+cd <project-name>
+```
+
+This creates a fully configured project with:
+
+- ✅ React + TypeScript (via Vite)
+- ✅ Tailwind CSS 3.4.1 with shadcn/ui theming system
+- ✅ Path aliases (`@/`) configured
+- ✅ 40+ shadcn/ui components pre-installed
+- ✅ All Radix UI dependencies included
+- ✅ Parcel configured for bundling (via .parcelrc)
+- ✅ Node 18+ compatibility (auto-detects and pins Vite version)
+
+### Step 2: Develop Your Artifact
+
+To build the artifact, edit the generated files. See **Common Development Tasks** below for guidance.
+
+### Step 3: Bundle to Single HTML File
+
+To bundle the React app into a single HTML artifact:
+
+```bash
+bash scripts/bundle-artifact.sh
+```
+
+This creates `bundle.html` - a self-contained artifact with all JavaScript, CSS, and dependencies inlined. This file can be directly shared in Claude conversations as an artifact.
+
+**Requirements**: Your project must have an `index.html` in the root directory.
+
+**What the script does**:
+
+- Installs bundling dependencies (parcel, @parcel/config-default, parcel-resolver-tspaths, html-inline)
+- Creates `.parcelrc` config with path alias support
+- Builds with Parcel (no source maps)
+- Inlines all assets into single HTML using html-inline
+
+### Step 4: Share Artifact with User
+
+Finally, share the bundled HTML file in conversation with the user so they can view it as an artifact.
+
+### Step 5: Testing/Visualizing the Artifact (Optional)
+
+Note: This is a completely optional step. Only perform if necessary or requested.
+
+To test/visualize the artifact, use available tools (including other Skills or built-in tools like Playwright or Puppeteer). In general, avoid testing the artifact upfront as it adds latency between the request and when the finished artifact can be seen. Test later, after presenting the artifact, if requested or if issues arise.
+
+## Reference
+
+- **shadcn/ui components**: https://ui.shadcn.com/docs/components

package/knowledge/skills/asana.md

@@ -0,0 +1,13 @@
+---
+id: "asana"
+title: "asana"
+category: "knowledge"
+tags: ["asana"]
+triggers: []
+dependencies: []
+source: "E:/Bobo's Coding cache/.claude/skills/asana"
+---
+
+# asana
+
+Skill directory: asana