👾 SpriteKit

⭐ Difficulty: ⭐⭐⭐ ⏱️ Est. Time: 2-3h 📂 Graphics & Media

2D 게임과 애니메이션 만들기

iOS 7+Metal 최적화

✨ SpriteKit is?

SpriteKit is Apple's 2D game engine, providing sprite animation, physics simulation, particle effects and more. Metal-accelerated for high performance, with easy SwiftUI integration.

💡 Key Features: Sprite Animation · 2D Physics Engine · Particle System · Tile Maps · Audio · Action System · Scene Transitions · Game Controller Support

🎯 1. Basic Scene Setup

게임 씬을 생성하고 스프라이트 is added.

GameScene.swift — 기본 씬

import SpriteKit

class GameScene: SKScene {
    var player: SKSpriteNode!

    override func didMove(to view: SKView) {
        // 씬 배경색
        backgroundColor = .init(white: 0.2, alpha: 1.0)

        // 플레이어 생성
        setupPlayer()

        // 물리 월드 설정
        physicsWorld.gravity = CGVector(dx: 0, dy: -9.8)
        physicsWorld.contactDelegate = self
    }

    func setupPlayer() {
        // 색상 스프라이트
        player = SKSpriteNode(color: .blue, size: CGSize(width: 50, height: 50))
        player.position = CGPoint(x: frame.midX, y: frame.midY)

        // 또는 이미지 스프라이트
        // player = SKSpriteNode(imageNamed: "player")

        // z-위치 (레이어 순서)
        player.zPosition = 10

        addChild(player)
    }

    // 매 프레임 업데이트
    override func update(_ currentTime: TimeInterval) {
        // 게임 로직
    }
}

🎬 2. 액션 (Actions)

스프라이트에 움직임과 효과 is added.

Actions.swift — 액션 시스템

import SpriteKit

extension GameScene {
    // 1. 이동 액션
    func movePlayerTo(_ position: CGPoint) {
        let moveAction = SKAction.move(to: position, duration: 1.0)
        player.run(moveAction)
    }

    // 2. 회전 액션
    func rotatePlayer() {
        let rotateAction = SKAction.rotate(byAngle: .CGFloat.pi * 2, duration: 1.0)
        let repeatAction = SKAction.repeatForever(rotateAction)
        player.run(repeatAction)
    }

    // 3. 스케일 액션
    func pulseEffect(on node: SKNode) {
        let scaleUp = SKAction.scale(to: 1.2, duration: 0.5)
        let scaleDown = SKAction.scale(to: 1.0, duration: 0.5)
        let sequence = SKAction.sequence([scaleUp, scaleDown])
        let repeatAction = SKAction.repeatForever(sequence)
        node.run(repeatAction)
    }

    // 4. 페이드 효과
    func fadeInOut(node: SKNode) {
        let fadeOut = SKAction.fadeOut(withDuration: 1.0)
        let fadeIn = SKAction.fadeIn(withDuration: 1.0)
        let sequence = SKAction.sequence([fadeOut, fadeIn])
        node.run(SKAction.repeatForever(sequence))
    }

    // 5. 복합 액션 (그룹)
    func complexAnimation(node: SKNode) {
        let move = SKAction.moveBy(x: 100, y: 0, duration: 2.0)
        let rotate = SKAction.rotate(byAngle: .CGFloat.pi, duration: 2.0)
        let scale = SKAction.scale(to: 1.5, duration: 2.0)

        // 동시에 실행
        let group = SKAction.group([move, rotate, scale])
        node.run(group)
    }

    // 6. 애니메이션 스프라이트
    func setupAnimatedSprite() {
        // 텍스처 배열
        let textures = [
            SKTexture(imageNamed: "frame1"),
            SKTexture(imageNamed: "frame2"),
            SKTexture(imageNamed: "frame3")
        ]

        // 애니메이션 액션
        let animation = SKAction.animate(with: textures, timePerFrame: 0.1)
        let repeatAnimation = SKAction.repeatForever(animation)

        let sprite = SKSpriteNode(texture: textures.first)
        sprite.run(repeatAnimation)
        addChild(sprite)
    }

    // 7. 완료 핸들러가 있는 액션
    func moveWithCompletion() {
        let move = SKAction.moveTo(y: 100, duration: 1.0)
        player.run(move) {
            print("이동 완료!")
        }
    }
}

⚙️ 3. 물리 엔진

충돌 감지와 물리 시뮬레이션 implementation.

Physics.swift — Physics Simulation

import SpriteKit

// 물리 카테고리
struct PhysicsCategory {
    static let none: UInt32 = 0
    static let player: UInt32 = 0b1      // 1
    static let enemy: UInt32 = 0b10       // 2
    static let wall: UInt32 = 0b100       // 4
}

extension GameScene {
    // 물리 바디 설정
    func setupPhysics() {
        // 플레이어 물리 바디
        player.physicsBody = SKPhysicsBody(rectangleOf: player.size)
        player.physicsBody?.isDynamic = true
        player.physicsBody?.categoryBitMask = PhysicsCategory.player
        player.physicsBody?.contactTestBitMask = PhysicsCategory.enemy
        player.physicsBody?.collisionBitMask = PhysicsCategory.wall

        // 질량과 마찰
        player.physicsBody?.mass = 1.0
        player.physicsBody?.friction = 0.2
        player.physicsBody?.restitution = 0.5 // 탄성
    }

    // 벽 생성
    func createWall(at position: CGPoint, size: CGSize) {
        let wall = SKSpriteNode(color: .gray, size: size)
        wall.position = position

        // 정적 물리 바디 (움직이지 않음)
        wall.physicsBody = SKPhysicsBody(rectangleOf: size)
        wall.physicsBody?.isDynamic = false
        wall.physicsBody?.categoryBitMask = PhysicsCategory.wall

        addChild(wall)
    }

    // 힘 적용
    func jumpPlayer() {
        let impulse = CGVector(dx: 0, dy: 500)
        player.physicsBody?.applyImpulse(impulse)
    }

    // 속도 설정
    func movePlayerRight() {
        player.physicsBody?.velocity = CGVector(dx: 200, dy: 0)
    }
}

// 충돌 감지 델리게이트
extension GameScene: SKPhysicsContactDelegate {
    func didBegin(_ contact: SKPhysicsContact) {
        let collision = contact.bodyA.categoryBitMask | contact.bodyB.categoryBitMask

        if collision == PhysicsCategory.player | PhysicsCategory.enemy {
            print("플레이어와 적 충돌!")
            handlePlayerEnemyCollision(contact)
        }
    }

    func handlePlayerEnemyCollision(_ contact: SKPhysicsContact) {
        // 충돌 처리 (게임 오버, 점수 감소 등)
    }
}

✨ 4. 파티클 시스템

불, 연기, 폭발 등의 파티클 효과를 만듭.

Particles.swift — 파티클 효과

import SpriteKit

extension GameScene {
    // 1. 파티클 이미터 로드 (.sks 파일)
    func addFireEffect(at position: CGPoint) {
        if let fire = SKEmitterNode(fileNamed: "Fire") {
            fire.position = position
            addChild(fire)
        }
    }

    // 2. 코드로 파티클 생성
    func createExplosion(at position: CGPoint) {
        let emitter = SKEmitterNode()

        // 파티클 텍스처
        emitter.particleTexture = SKTexture(imageNamed: "spark")

        // 생성 속도
        emitter.particleBirthRate = 100

        // 수명
        emitter.particleLifetime = 1.0

        // 속도
        emitter.particleSpeed = 200
        emitter.particleSpeedRange = 50

        // 색상
        emitter.particleColor = .orange
        emitter.particleColorBlendFactor = 1.0

        // 크기
        emitter.particleScale = 0.5
        emitter.particleScaleRange = 0.2
        emitter.particleScaleSpeed = -0.3

        // 알파
        emitter.particleAlpha = 1.0
        emitter.particleAlphaSpeed = -1.0

        // 각도
        emitter.emissionAngle = 0
        emitter.emissionAngleRange = .CGFloat.pi * 2

        emitter.position = position
        addChild(emitter)

        // 1초 후 제거
        emitter.run(SKAction.sequence([
            .wait(forDuration: 1.0),
            .removeFromParent()
        ]))
    }

    // 3. 트레일 효과
    func addTrailEffect(to node: SKNode) {
        if let trail = SKEmitterNode(fileNamed: "Trail") {
            trail.targetNode = self
            node.addChild(trail)
        }
    }
}

🎮 5. 터치 및 입력 처리

사용자 입력 handling.

Input.swift — 입력 처리

import SpriteKit

extension GameScene {
    // 터치 시작
    override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {
        guard let touch = touches.first else { return }
        let location = touch.location(in: self)

        // 터치한 노드 찾기
        let touchedNodes = nodes(at: location)

        for node in touchedNodes {
            if node.name == "button" {
                handleButtonTap()
            } else if node == player {
                jumpPlayer()
            }
        }

        // 또는 플레이어를 터치 위치로 이동
        movePlayerTo(location)
    }

    // 터치 이동
    override func touchesMoved(_ touches: Set<UITouch>, with event: UIEvent?) {
        guard let touch = touches.first else { return }
        let location = touch.location(in: self)
        player.position = location
    }

    // 터치 종료
    override func touchesEnded(_ touches: Set<UITouch>, with event: UIEvent?) {
        // 터치 종료 처리
    }

    func handleButtonTap() {
        print("버튼 탭됨")
    }
}

📱 SwiftUI Integration

GameView.swift — SwiftUI Integration

import SwiftUI
import SpriteKit

struct GameView: View {
    @State private var score = 0
    @State private var isPaused = false

    var scene: SKScene {
        let scene = GameScene()
        scene.size = CGSize(width: 300, height: 400)
        scene.scaleMode = .aspectFill
        return scene
    }

    var body: some View {
        ZStack {
            // SpriteKit 뷰
            SpriteView(scene: scene)
                .ignoresSafeArea()

            // UI 오버레이
            VStack {
                // 점수
                Text("점수: \(score)")
                    .font(.title)
                    .foregroundStyle(.white)
                    .padding()

                Spacer()

                // 컨트롤
                HStack {
                    Button {
                        isPaused.toggle()
                        scene.isPaused = isPaused
                    } label: {
                        Image(systemName: isPaused ? "play.circle" : "pause.circle")
                            .font(.largeTitle)
                    }
                }
                .padding()
            }
        }
    }
}

💡 HIG Guidelines

프레임 레이트: 60 FPS 유지
텍스처 아틀라스: 텍스처를 하나로 합쳐 성능 향상
노드 재사용: 자주 생성/삭제되는 노드는 풀 사용
z-Position: 레이어 순서 명확히 관리
물리 최적화: 불필요한 물리 바디 비활성화

🎯 Practical Usage

캐주얼 Games: 퍼즐, 플랫포머, 슈팅 게임
Education Apps: 인터랙티브 학습 콘텐츠
데이터 시각화: 애니메이션 차트와 그래프
미니 Games: 앱 내 보너스 게임

📚 Learn More

⚡️ Performance Tips: SKView.showsFPS와 showsNodeCount to monitor performance during development. Using texture atlases (.atlas) reduces draw calls for significant performance improvement.

📎 Apple Official Resources

📘 Documentation 🎬 WWDC Sessions