🔮 :: Spinning Spiral Basic

📝 Rust Code

use nannou::prelude::*;

struct Model {
    angle: f32,
    spiral_params: SpiralParams,
}

struct SpiralParams {
    turns: f32,
    points_count: usize,
    spacing: f32,
    max_radius: f32,
}

impl Default for SpiralParams {
    fn default() -> Self {
        Self {
            turns: 22.0,
            points_count: 3000,
            spacing: 3.0,
            max_radius: 500.0,
        }
    }
}

fn main() {
    nannou::app(model).update(update).run();
}

fn model(app: &App) -> Model {
    let _window = app.new_window().title("Spiral").size(800, 800).view(view).build().unwrap();

    Model {
        angle: 0.0,
        spiral_params: SpiralParams::default(),
    }
}

fn update(_app: &App, model: &mut Model, _update: Update) {
    model.angle -= 0.1;
}

fn view(app: &App, model: &Model, frame: Frame) {
    let draw = app.draw();

    draw.background().color(BLACK);

    let draw = draw.rotate(model.angle);

    let params = &model.spiral_params;
    let max_t = params.turns * TAU;

    for i in 0..params.points_count - 1 {
        let t1 = ((i as f32) / ((params.points_count - 1) as f32)) * max_t;
        let t2 = (((i + 1) as f32) / ((params.points_count - 1) as f32)) * max_t;

        let r1 = params.spacing * t1;
        let r2 = params.spacing * t2;

        if r1 > params.max_radius {
            break;
        }

        let p1 = pt2(r1 * t1.cos(), r1 * t1.sin());
        let p2 = pt2(r2 * t2.cos(), r2 * t2.sin());

        let progress = (i as f32) / ((params.points_count - 1) as f32);
        let alpha = map_range(progress, 0.0, 1.0, 0.1, 0.9);

        let hue = map_range(progress, 0.0, 1.0, 0.8, 0.5);
        let saturation = map_range(progress, 0.0, 1.0, 0.3, 0.8);
        let lightness = map_range(progress, 0.0, 1.0, 0.3, 0.7);

        let weight = map_range(progress, 0.0, 1.0, 0.3, 2.5);

        draw.line().start(p1).end(p2).weight(weight).color(hsla(hue, saturation, lightness, alpha));
    }

    draw.ellipse().radius(3.0).color(hsla(0.6, 0.8, 0.9, 0.8));

    draw.to_frame(app, &frame).unwrap();
}

📝 Rust Code + Comment

use nannou::prelude::*; // nannou 라이브러리의 기본 기능들을 가져옵니다

// 메인 모델 구조체 - 애플리케이션의 상태를 저장합니다
struct Model {
    angle: f32, 			     // 현재 회전 각도 (라디안)
    spiral_params: SpiralParams, // 나선의 매개변수들을 저장하는 구조체
}

// 나선 매개변수 구조체 - 나선의 모양을 결정하는 값들을 저장합니다
struct SpiralParams {
    turns: f32, 		 // 나선의 회전 수 (몇 바퀴 돌 것인지)
    points_count: usize, // 나선을 구성하는 점의 개수
    spacing: f32, 		 // 나선 점들 사이의 간격 (나선의 팽창 정도)
    max_radius: f32, 	 // 나선의 최대 반지름 (화면에서 보여질 최대 크기)
}

// SpiralParams의 기본값 구현
impl Default for SpiralParams {
    fn default() -> Self {
        Self {
            turns: 22.0, 		// 기본적으로 22바퀴 회전하는 나선
            points_count: 3000, // 3000개의 점으로 나선 구성
            spacing: 3.0, 	 	// 점 간격 3.0
            max_radius: 500.0,  // 최대 반지름 500.0
        }
    }
}

// === 메인 함수 - 애플리케이션의 시작점
fn main() {
    nannou::app(model)  // 모델 생성 함수 지정
        .update(update) // 업데이트 함수 지정
        .run(); 	    // 애플리케이션 실행
}

// === 모델 초기화 함수 - 애플리케이션 시작 시 호출됨
fn model(app: &App) -> Model {
    // 새로운 윈도우 생성
    let _window = app
        .new_window()
        .title("Spiral") // 윈도우 제목
        .size(800, 800)  // 윈도우 크기 (800x800 픽셀)
        .view(view) 	 // 뷰 함수 지정 (화면 그리기)
        .build() 	     // 윈도우 빌드
        .unwrap();  	 // 에러 발생 시 패닉

    // 초기 모델 반환
    Model {
        angle: 0.0, // 시작 각도는 0라디안
        spiral_params: SpiralParams::default(), // 기본 나선 매개변수 사용
    }
}

// === 업데이트 함수 - 매 프레임마다 호출되어 모델 상태 업데이트
fn update(_app: &App, model: &mut Model, _update: Update) {
    model.angle -= 0.1; // 각도를 0.1라디안씩 감소 (시계 반대 방향 회전)
}

// === 뷰 함수 - 화면을 그리는 함수, 매 프레임마다 호출됨
fn view(app: &App, model: &Model, frame: Frame) {
    let draw = app.draw(); // 그림을 그리기 위한 Draw 인스턴스 생성
    
    // ** 배경 그리기
    draw.background().color(BLACK); // 검은색 배경으로 채우기
    
    // ** 회전을 적용한 새로운 Draw 인스턴스 생성
    // 기존 draw 인스턴스에 회전 변환을 적용하고 결과를 새로운 draw 변수에 저장
    let draw = draw.rotate(model.angle);
    
    // ** 나선 그리기
    let params = &model.spiral_params; // 나선 매개변수 참조
    let max_t = params.turns * TAU;    // 최대 각도 계산 (TAU = 2π, 완전한 원)
    
    // ** 나선을 구성하는 선분들 그리기
    for i in 0..(params.points_count - 1) {
        // 현재 점과 다음 점의 각도 계산 (0부터 max_t까지 선형 보간)
        let t1 = (i as f32 / (params.points_count - 1) as f32) * max_t;
        let t2 = ((i + 1) as f32 / (params.points_count - 1) as f32) * max_t;
        
        // 현재 점과 다음 점의 반지름 계산 (간격 × 각도)
        let r1 = params.spacing * t1;
        let r2 = params.spacing * t2;
        
        // 최대 반지름을 넘어가면 루프 종료 (더 이상 그릴 필요 없음)
        if r1 > params.max_radius { break; }
        
        // 극좌표계에서 데카르트 좌표계로 변환 (x = r·cosθ, y = r·sinθ)
        let p1 = pt2(r1 * t1.cos(), r1 * t1.sin()); // 현재 점 위치
        let p2 = pt2(r2 * t2.cos(), r2 * t2.sin()); // 다음 점 위치
        
        // 진행률 계산 (0.0에서 1.0 사이의 값)
        let progress = i as f32 / (params.points_count - 1) as f32;
        
        // 투명도 계산: 진행률에 따라 0.1에서 0.9로 변화
        let alpha = map_range(progress, 0.0, 1.0, 0.1, 0.9);
        
        // 색상 계산: HSL 색공간 사용
        let hue = map_range(progress, 0.0, 1.0, 0.8, 0.5);        // 색상: 보라색에서 청록색으로
        let saturation = map_range(progress, 0.0, 1.0, 0.3, 0.8); // 채도: 낮은 채도에서 높은 채도로
        let lightness = map_range(progress, 0.0, 1.0, 0.3, 0.7);  // 명도: 어두운 색에서 밝은 색으로
        
        // 선 두께 계산: 진행률에 따라 0.3에서 2.5로 변화
        let weight = map_range(progress, 0.0, 1.0, 0.3, 2.5);
        
        // 선분 그리기
        draw.line()
            .start(p1) 		// 선분의 시작점
            .end(p2) 		// 선분의 끝점
            .weight(weight) // 선 두께
            .color(hsla(hue, saturation, lightness, alpha)); // 선 색상 (HSL + Alpha)
    }
    
    // ** 중심점 그리기 - 나선의 중심에 작은 원을 그림
    draw.ellipse()
        .radius(3.0) // 반지름 3.0 픽셀
        .color(hsla(0.6, 0.8, 0.9, 0.8)); // 연한 청록색, 약간 투명
    
    // ** 그림을 프레임 버퍼에 출력
    draw.to_frame(app, &frame).unwrap();
}