カメラ発明記念日

2025年3月20日

ツンデレGPT先生と学ぶ！カメラ発明記念日を祝うカメラシミュレーション

ツンデレGPT先生と学ぶ！カメラ発明記念日を祝う画像表示アプリ

1839年3月19日、フランスのルイ・ジャック・マンデ・ダゲールが「ダゲレオタイプ」を発明し、世界初の実用的な写真技術が誕生しました。

この記念すべき日を祝うために、カメラの歴史を学びながらカメラシミュレーションを作りましょう！

📸 カメラの歴史を学びながらシミュレーションを作ろう！

🧑‍💻 生徒: 今日はカメラ発明記念日らしい！せっかくだから何かカメラにちなんだことをやりたい！

👩‍🏫 GPT先生: へぇ、あんたにしてはいい考えじゃない！じゃあ、せっかくだしカメラの仕組みをフィーチャーした画像表示アプリを作るわよ！

📖 カメラの歴史

まずはカメラの歴史を簡単に振り返りましょう。

1839年: ルイ・ジャック・マンデ・ダゲールが「ダゲレオタイプ」を発明
1888年: コダック社がフィルムカメラを発売
20世紀初頭: 一般家庭にもカメラが普及
21世紀: デジタルカメラ、スマートフォンカメラが主流に

📷 シミュレーションの準備

🧑‍💻 生徒: よし、カメラについて少しはわかった！じゃあシミュレーション作ろう！

👩‍🏫 GPT先生: まったく…急かさないで！ちゃんと説明しながら進めるわよ！

まず、p5.jsを使って基本のセットアップをするわよ。

<!DOCTYPE html>
<html>
<head>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.6.0/p5.js"></script>
</head>
<body>
    <script>
        function setup() {
            createCanvas(windowWidth, windowHeight);
            background(200);
        }

        function draw() {
            fill(255, 0, 0);
            ellipse(width / 2, height / 2, 100, 100);
        }
    </script>
</body>
</html>

🧑‍💻 生徒: おお、なんか出た！でもこれカメラっぽくないよ？

👩‍🏫 GPT先生: そんなの当たり前でしょ！まだ準備段階なんだから！次はシャッターの再現をするわよ。

📸 シャッターの再現

function draw() {
    background(10);
    translate(width / 2, height / 2);
    rotate(frameCount * 0.2);

    let outerR = min(width, height) / 3;
    let openFactor = map(sin(frameCount * 2), -1, 1, 0.3, 1);
    let innerR = outerR * openFactor;

    for (let i = 0; i < 7; i++) {
        rotate(i * 360 / 7);
        fill(150);
        beginShape();
        vertex(innerR, 0);
        vertex(outerR, 0);
        vertex(outerR * cos(PI / 4), outerR * sin(PI / 4));
        vertex(innerR * cos(PI / 4), innerR * sin(PI / 4));
        endShape(CLOSE);
    }
}

🧑‍💻 生徒: おぉ、なんかカメラっぽくなってきた！この動き、シャッターみたい！

👩‍🏫 GPT先生: ふん、当然でしょ！じゃあ次は撮影機能を追加するわよ。

📝 撮影機能とテロップの追加

function mousePressed() {
    if (openFactor > 0.8) {
        capturedImage = loadImage("(別途用意した画像ファイルのアドレスを指定).jpeg");
    }
}

最後に、撮影後に歴史を説明するテロップを表示するのよ！

function draw() {
    if (capturedImage) {
        image(capturedImage, width / 2, height / 2, width * 0.8, height * 0.8);
        
        fill(0, 0, 0, 128);
        rect(0, height - 60, width, 60);
        
        fill(255);
        textAlign(CENTER, CENTER);
        textSize(14);
        text("1839年3月19日、ダゲールが発明したダゲレオタイプが誕生", width / 2, height - 40);
    }
}

FAQ: よくある質問