개발 스킬

Build a continuous 3D website where scrolling guides the camera, lighting, text, and interactions through planned chapters. The skill covers visual planning, responsive composition, progressive loading, accessibility, and performance checks for a live Three.js world.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Create a product story set in a continuous 3D world
• Build an interactive portfolio with a scrolling camera journey
• Present an exhibition through connected spatial chapters

Design and test combat encounters in Three.js action games. Plan arenas, enemy roles, spawn timing, objectives, boss phases, and rewards, then check fairness and difficulty using repeatable starting conditions on desktop and mobile.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Planning combat arenas and enemy combinations
• Tuning enemy waves and boss phases
• Checking attack warnings and recovery opportunities

Build reusable enemy types and attack sets for Three.js action games. Separate enemy definitions from live state, standardize models and hit detection, and validate combat timing, placeholder assets, and desktop and mobile encounters.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Adding enemies through reusable data definitions
• Separating enemy data from live combat state
• Standardizing models and temporary replacements

Build and test Three.js games for mobile browsers, covering touch controls, screen orientation, readable game information, and device-appropriate graphics. Refine movement, actions, inventory interactions, and performance through checks of real mobile browser behavior.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Designing touch movement and action controls
• Adapting game screens to portrait and landscape
• Tuning graphics quality for mobile devices

Add a white, twinkling dotted trail that follows the mouse behind website content. The skill guides WebGPU rendering, which uses the graphics processor, with static backgrounds for unsupported devices and accessibility preferences.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Add a mouse-following trail to a hero section
• Create an interactive contact section background
• Keep a static background on touch devices

Build, integrate or audit rigged 3D game characters and monsters, including skeletons, animations, equipment and collision rules. Connect assets to gameplay and provide an interactive inspector to verify actions, equipment states and runtime behavior.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Integrating FBX or GLB characters into gameplay
• Separating swappable weapons and armor from character bodies
• Defining monster animations and attack collision timing

Prepare Vesperfall game assets as paired transparent PNG cards and live 3D previews. Track each model’s actual source, expose available animations, and validate catalog displays, ground contact, and review pages through tests and browser checks.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Adding characters or equipment to the Vesperfall catalog
• Pairing transparent PNG cards with live 3D previews
• Reviewing animations and ground contact on an isolated page

Build particle trails that respond to cursor or touch movement with consistent spacing at different speeds. Reuse a fixed pool of GPU-rendered particles, add keyboard-triggered bursts, and handle reduced motion, resizing, and cleanup.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Creating particle trails for cursor and touch movement
• Making pollen or dust rise from a surface
• Adding particle bursts triggered by a keyboard-accessible button

Build ice and frost visual effects in Three.js using reusable modules. Combine branching frost growth, refractive ice spikes, cracks and settling fragments, freezing mist, and swirling snow into a coordinated sequence demonstrated on a snowy ground.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Animate frost spreading across the ground
• Create erupting ice spikes that crack and shatter
• Combine freezing mist with a swirling blizzard

Build and check monsters for Three.js and web action games using shared rules for joints, attachment points, collision shapes, and combat states. Separate visual animation from damage decisions, and provide reproducible checks for attacks and detail-level changes.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Standardizing joints and attachment points across monsters
• Connecting attack timing with collision and damage handling
• Reproducing combat states and attack phase boundaries

Turn a working web effect or interaction into a reusable skill by extracting its core mechanism, documenting tested parameters and pitfalls, and packaging a demo that preserves the reference design and proves the behavior.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Reuse a successful scroll effect across projects
• Package a canvas effect with a working demo
• Document tested parameters and hard-won fixes

Turn five collected UI references into five original landing pages with distinct brands, copy, and imagery. Each page gets its own Codex task and workspace, with build checks, a source commit, and private deployment through Sites.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Build five landing pages from a UI inspiration pack
• Explore distinct brands using collected visual references
• Manage each page in a separate Codex task

Refine wood materials and lighting in three.js interiors using procedural grain, window light, contact shadows, rays, and dust. A runnable scorecard measures eight aspects of the rendered image, helping guide revisions toward a chosen target score.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Lighting carved wood, kumiko, and workshop scenes
• Fixing wood that looks flat, plastic, or washed out
• Adjusting light shafts while preserving dark tones

Implement fog of war, an effect that conceals unseen areas, in Three.js action games. It combines soft visual boundaries with obstacle-aware visibility rules for targeting and combat, plus performance tuning and testing guidance.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Add soft, wall-aware fog to a Three.js game
• Align hidden-enemy targeting with visibility rules
• Fix radial streaks and seams in fog rendering

Create, repair, and review character combat animations, from sword strikes to bow shots and spells. Use joint measurements, mesh deformation tests, camera captures, and blind comparisons to identify awkward poses and assess changes against written rules.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Create melee attacks, bow shots, and spell animations
• Fix stretched arms and awkward wrist or hand poses
• Define measurable combat animation rules and tests

Build or audit browser map editors for Three.js and isometric games. Reuse production world definitions, edit placements in isolated drafts, inspect enemy behavior overlays, and validate exports before reviewed integration into the game.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Build a map editor from existing game definitions
• Adjust placements with dragging, snapping, and undo
• Inspect enemy detection ranges and patrol routes

Design and implement sound feedback for Three.js or web games, from action cues to music transitions. Define which sounds take priority, respect volume controls, provide visual alternatives, and check browser behavior and audio performance.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Give attacks, hits, and blocks distinct sound cues
• Keep critical sounds audible during busy combat
• Change music smoothly as game states change

Add shafts of sunlight to Three.js or similar 3D scenes. Shape rays with roofs and foliage, align them with the sun, and tune rendering effects so foreground surfaces keep their contrast while processing costs remain measurable.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Add sunbeams through a tree canopy
• Show sunlight passing through roof gaps
• Create golden-hour architectural scenes

Build in-game changelogs that connect release notes and displayed versions to successful production deployments. Reconstruct supported history, integrate menu navigation and accessible controls, and verify version consistency and behavior on desktop and mobile.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Add or revise an in-game changelog screen
• Reconstruct release history from deployments and Git
• Keep displayed game versions aligned with published builds

Build falling leaves in Three.js and similar 3D scenes, with visible front, edge, and back views as they tumble and drift. Coordinate wind, scene depth, camera-aware recycling, and performance checks for a convincing autumn effect.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Adding falling autumn leaves to a 3D scene
• Coordinating leaf tumble, sideways drift, and wind
• Managing leaves around buildings and camera movement

Add coordinated seasonal transitions to an existing 3D scene. Blend foliage, lighting, sky, ground, snow, and particles from one shared state while preserving camera controls and interactions, so the same place remains recognizable throughout spring, summer, fall, and winter.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Add a four-season selector to an outdoor 3D scene
• Show seasonal changes in an architectural walkthrough
• Coordinate foliage, sunlight, sky, and ground appearance

Build sky backgrounds for 3D scenes using procedural atmosphere or panoramic images. Align the horizon, sun, shadows, and environment lighting, while handling camera movement, image loading, and smooth transitions between day, dusk, and night.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Creating sky backgrounds for architecture and outdoor scenes
• Aligning sunset skies with shadows and reflections
• Designing transitions from day through dusk to night

Build a Three.js object viewer with a gentle camera lean on hover and a click-to-inspect mode. Visitors can rotate and zoom the object, then return it to its original position using mouse, touch, or keyboard controls.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Add interactive inspection to a 3D product showcase
• Let visitors rotate and examine joinery details
• Add touch and keyboard controls to portfolio objects

Convert articles, tutorials, or prompt collections into reusable agent skills, with one independent capability per skill. Package portable instructions, example prompts, working demos, preview images, and validation so the methods can transfer to other projects.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Convert tutorial steps into reusable agent skills
• Split a prompt collection into independent capabilities
• Package skills with example prompts and working demos