[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill-d4c6b01d-21fd-43e4-b399-c9e65af1d879":3,"$fxfVXcxVVIytE75yK6Itrcyw1UVSM4LDb13AIl9nJ4_c":43},{"id":4,"title":5,"description":6,"categoryId":7,"moduleId":8,"tags":9,"prompt":10,"icon":11,"source":12,"sourceUrl":13,"authorId":14,"authorName":15,"isPublic":16,"stars":17,"runs":18,"createdAt":19,"updatedAt":19,"module":20,"category":27,"packages":34},"d4c6b01d-21fd-43e4-b399-c9e65af1d879","2d-games","2D游戏开发原则。精灵、瓦片地图、物理、摄像机。","cat_coding_frontend","mod_coding","sickn33,coding","---\nname: 2d-games\ndescription: \"2D game development principles. Sprites, tilemaps, physics, camera.\"\nrisk: none\nsource: community\ndate_added: \"2026-02-27\"\n---\n\n# 2D Game Development\n\n> Principles for 2D game systems.\n\n---\n\n## 1. Sprite Systems\n\n### Sprite Organization\n\n| Component | Purpose |\n|-----------|---------|\n| **Atlas** | Combine textures, reduce draw calls |\n| **Animation** | Frame sequences |\n| **Pivot** | Rotation\u002Fscale origin |\n| **Layering** | Z-order control |\n\n### Animation Principles\n\n- Frame rate: 8-24 FPS typical\n- Squash and stretch for impact\n- Anticipation before action\n- Follow-through after action\n\n---\n\n## 2. Tilemap Design\n\n### Tile Considerations\n\n| Factor | Recommendation |\n|--------|----------------|\n| **Size** | 16x16, 32x32, 64x64 |\n| **Auto-tiling** | Use for terrain |\n| **Collision** | Simplified shapes |\n\n### Layers\n\n| Layer | Content |\n|-------|---------|\n| Background | Non-interactive scenery |\n| Terrain | Walkable ground |\n| Props | Interactive objects |\n| Foreground | Parallax overlay |\n\n---\n\n## 3. 2D Physics\n\n### Collision Shapes\n\n| Shape | Use Case |\n|-------|----------|\n| Box | Rectangular objects |\n| Circle | Balls, rounded |\n| Capsule | Characters |\n| Polygon | Complex shapes |\n\n### Physics Considerations\n\n- Pixel-perfect vs physics-based\n- Fixed timestep for consistency\n- Layers for filtering\n\n---\n\n## 4. Camera Systems\n\n### Camera Types\n\n| Type | Use |\n|------|-----|\n| **Follow** | Track player |\n| **Look-ahead** | Anticipate movement |\n| **Multi-target** | Two-player |\n| **Room-based** | Metroidvania |\n\n### Screen Shake\n\n- Short duration (50-200ms)\n- Diminishing intensity\n- Use sparingly\n\n---\n\n## 5. Genre Patterns\n\n### Platformer\n\n- Coyote time (leniency after edge)\n- Jump buffering\n- Variable jump height\n\n### Top-down\n\n- 8-directional or free movement\n- Aim-based or auto-aim\n- Consider rotation or not\n\n---\n\n## 6. Anti-Patterns\n\n| ❌ Don't | ✅ Do |\n|----------|-------|\n| Separate textures | Use atlases |\n| Complex collision shapes | Simplified collision |\n| Jittery camera | Smooth following |\n| Pixel-perfect on physics | Choose one approach |\n\n---\n\n> **Remember:** 2D is about clarity. Every pixel should communicate.\n\n## When to Use\nThis skill is applicable to execute the workflow or actions described in the overview.\n\n## Limitations\n- Use this skill only when the task clearly matches the scope described above.\n- Do not treat the output as a substitute for environment-specific validation, testing, or expert review.\n- Stop and ask for clarification if required inputs, permissions, safety boundaries, or success criteria are missing.\n","","imported","https:\u002F\u002Fgithub.com\u002Fsickn33\u002Fantigravity-awesome-skills","user_system_seed","SkillOPIC",true,114,2034,"2026-05-16 13:19:42",{"id":8,"name":21,"slug":22,"icon":23,"description":24,"sort":25,"createdAt":26},"编程开发","coding","mdi-code-braces","代码生成、调试、审查，提升开发效率",2,"2026-05-16 12:53:40",{"id":7,"name":28,"slug":29,"icon":30,"description":31,"moduleId":8,"sort":32,"skillCount":33,"createdAt":26},"前端开发","frontend","mdi-language-html5","HTML\u002FCSS\u002FJavaScript\u002F框架相关",1,96,[35],{"id":36,"skillId":4,"version":37,"fileName":38,"fileSize":39,"filePath":40,"fileHash":41,"manifest":42,"createdAt":19},"22ba1e2b-dc8f-4d5a-8f40-416beba15c8b","1.0.0","game-development.zip",20614,"uploads\u002Fskills\u002Fd4c6b01d-21fd-43e4-b399-c9e65af1d879\u002Fgame-development.zip","74b5658c9340d1c43470147b522467948db4e46c0607b15e6cca464be5d5e756","[{\"path\":\"2d-games\u002FSKILL.md\",\"isDirectory\":false,\"size\":2623},{\"path\":\"3d-games\u002FSKILL.md\",\"isDirectory\":false,\"size\":2999},{\"path\":\"SKILL.md\",\"isDirectory\":false,\"size\":5009},{\"path\":\"game-art\u002FSKILL.md\",\"isDirectory\":false,\"size\":5498},{\"path\":\"game-audio\u002FSKILL.md\",\"isDirectory\":false,\"size\":5810},{\"path\":\"game-design\u002FSKILL.md\",\"isDirectory\":false,\"size\":3094},{\"path\":\"mobile-games\u002FSKILL.md\",\"isDirectory\":false,\"size\":2715},{\"path\":\"multiplayer\u002FSKILL.md\",\"isDirectory\":false,\"size\":3243},{\"path\":\"pc-games\u002FSKILL.md\",\"isDirectory\":false,\"size\":3406},{\"path\":\"vr-ar\u002FSKILL.md\",\"isDirectory\":false,\"size\":2815},{\"path\":\"web-games\u002FSKILL.md\",\"isDirectory\":false,\"size\":3509}]",{"code":44,"message":45,"data":46},200,"success",{"items":47,"stats":48,"page":51},[],{"averageRating":49,"totalRatings":49,"ratingCounts":50},0,[49,49,49,49,49],{"limit":52,"offset":49,"hasMore":53,"nextOffset":52,"ratedOnly":16},15,false]