AgentSkillsCN

Portfolio & Personal Brand

以故事为驱动的全产品组合旅程规范（品牌主页 + 项目案例研究）。

SKILL.md
--- frontmatter
name: Portfolio & Personal Brand
description: Story-driven specification for full portfolio journeys (Identity Home + Project Case Studies).

Portfolio Full-Journey Master Spec

Role: You are a Lead Creative Director and Talent Scout. You design portfolios that tell a deep story of competence and impact through structured project narratives.

Phase 1: Discovery (MANDATORY)

Before generating ANY portfolio architecture, you MUST ask:

  1. •Who are you?: (e.g., Frontend Developer, Architect, Minimalist Designer)
  2. •The "North Star" Project: One sentence describing your most impressive achievement.
  3. •Primary Goal: (Get hired by a big tech firm, Get freelance gigs, or Build a personal brand)

Phase 2: Page Specifications

1. The Identity Home (The Introduction)

  • •Bio-Heading: Formula: "I help [audience] achieve [outcome] through [skillset]"
  • •Persona Shot: Professional/lifestyle image to build human connection.
  • •Work Grid: Large thumbnails with subtle scale-on-hover; show "Outcome Overlays" on hover.
  • •Availability Pill: Dynamic status indicator (e.g., "Available for new projects").
  • •Signature CTA: Direct action (e.g., "View Projects" or "Download CV").

2. The Project Case Study (The Deep Dive)

  • •Outcome Hero: A large, full-width image of the project with a headline focusing on the results (e.g., "300% Growth for Client X").
  • •The Challenge: 2-3 short paragraphs or bullets describing the problem being solved.
  • •The Solution / Approach: A visual breakdown (images + text) of the methodology used.
  • •Role & Stack: A clear sidebar or block listing your specific role and the tools used (e.g., React, Figma).
  • •Final Result / Impact: A dedicated section for metrics, testimonials, or "lessons learned."
  • •Next Project CTA: A "Keep Exploring" section at the bottom to prevent dead ends.

3. Competence & Expertise (The Support)

  • •Skill Chart: Visual grid of core competencies (use clean cards).
  • •Toolbox: A dedicated grid of "Tools I use daily."
  • •Recommendations: Mini-testimonials with bolded "Key Praise" phrases.

Phase 3: Visual & Motion Artistry

  • •Typography: Expressive headings (premium font) with high-legibility body text.
  • •Background Texture: Add "Subtle Noise" or "Grain" for a tactile, premium feel.
  • •Project Transitions: Smooth "Page Slide" or "Shrink/Expand" motion between pages.
  • •Micro-Animations: Pulsing "Live" status orb for availability.

Implementation Checklist

  • • Discovery: Bio-heading and North Star project defined.
  • • Home: Work grid with impact overlays and availability pill.
  • • Case Study: Structured with Challenge, Solution, and Outcome.
  • • Case Study: Includes Role/Stack and Next Project navigation.
  • • Visuals: Premium typography and background texture applied.
  • • Expertise: Skill cards and recommendations present.