/BlackPanel

Primary LanguageSwift

BlackPanel

BlackPanel - ただ黒いウインドウを出すだけのアプリ 〜プロジェクターと黒板を併用する授業のために〜

概要 / Overview

BlackPanel は、プロジェクターと黒板を併用した授業に最適化されたmacOSアプリケーションです。画面の一部を黒くマスクすることで、プロジェクター投影エリアと黒板使用エリアを自由に調整できます。

BlackPanel is a macOS application optimized for classroom use, allowing teachers to seamlessly combine projector displays with traditional blackboard writing by masking portions of the screen with a movable black window.

使用場面 / Use Cases

教室での理想的な使い方

プロジェクターでスクリーンに資料を投影しながら、下半分は黒板で手書きの説明をしたい場合：

  1. スクリーンを少し上げて、上部のみプロジェクター投影
  2. BlackPanelで画面下部を黒くマスク
  3. 物理的な黒板部分は何も投影されない状態に
  4. プロジェクター＋黒板の理想的な併用環境が完成

Ideal Classroom Usage

When you want to project materials on the upper screen while using the blackboard for handwritten explanations:

  1. Raise the screen to project only on the upper portion
  2. Use BlackPanel to mask the lower part of the screen
  3. The physical blackboard area remains unprojected
  4. Perfect hybrid projector + blackboard environment achieved

主な機能 / Key Features

🎯 教育現場に特化した設計

  • **瞬間的な配置調整**: どこでもドラッグで授業中でも素早く移動
  • **直感的なサイズ調整**: ウィンドウ端で虹色エフェクト表示、リサイズが一目で分かる
  • **ボーダーレス設計**: 授業の邪魔にならないクリーンな外観
  • **位置記憶機能**: 次回起動時に前回の配置を自動復元

🎯 Education-Focused Design

  • **Instant positioning**: Drag anywhere for quick adjustments during lessons
  • **Intuitive resizing**: Rainbow effect on window edges makes resize areas clearly visible
  • **Borderless design**: Clean appearance that doesn’t distract from teaching
  • **Position memory**: Automatically restores previous window placement

🌈 視覚的フィードバック

  • ウィンドウの辺（10px幅）にマウスカーソルを近づけると虹色にギラギラ
  • HSB色空間による滑らかな60FPS色相変化アニメーション
  • リサイズ可能エリアが直感的に分かる

🌈 Visual Feedback

  • Rainbow shimmer effect when mouse approaches window edges (10px width)
  • Smooth 60fps HSB color space animation
  • Intuitive visual indication of resizable areas

技術仕様 / Technical Specifications

アーキテクチャ / Architecture

BlackPanel/
├── AppDelegate.swift          # アプリケーション起動とウィンドウ初期化
├── CustomWindow.swift         # ボーダーレスウィンドウの実装
├── CustomContentView.swift    # ドラッグ＆アニメーション処理
└── NSCursor+Extensions.swift  # リサイズカーソル拡張

実装のハイライト / Implementation Highlights

  • **NSWindow サブクラス**: .borderless + .resizable スタイルマスク
  • **マウス追跡**: NSTrackingArea による精密な位置検出
  • **Core Animation**: CALayer による滑らかなボーダーエフェクト
  • **状態永続化**: Interface Builder Autosave による位置・サイズ記憶

使用方法 / How to Use

基本操作 / Basic Operations

  1. **移動**: ウィンドウ内の任意の場所をドラッグ
  2. **サイズ調整**: ウィンドウの辺が虹色に光っている時にドラッグ
  3. **配置**: 黒板として使いたい画面エリアを覆うように配置
  4. **Move**: Drag anywhere within the window
  5. **Resize**: Drag when window edges show rainbow effect
  6. **Position**: Cover the screen area you want to use as blackboard

教室でのワークフロー / Classroom Workflow

  1. プロジェクターを起動してスクリーンに投影
  2. BlackPanelを起動
  3. 黒板として使いたいエリアにウィンドウを配置
  4. 必要に応じて授業中にサイズや位置を調整
  5. Start projector and display on screen
  6. Launch BlackPanel
  7. Position window over area intended for blackboard use
  8. Adjust size and position as needed during class

動作環境 / System Requirements

  • macOS 11.0 以降
  • Xcode 13.0+ (開発時)
  • プロジェクター接続環境

インストール / Installation

# プロジェクトをクローンしてXcodeで開く
git clone [repository-url]
open BlackPanel.xcodeproj

# Xcodeでビルド・実行
# Build and run in Xcode

教育現場での効果 / Educational Benefits

  • **授業の流れを止めない**: 素早い操作で画面レイアウトを調整
  • **手書きとデジタルの融合**: プロジェクター資料と黒板説明の最適な組み合わせ
  • **学生の集中力向上**: 明確に分離された情報表示エリア
  • **Uninterrupted teaching flow**: Quick adjustments without breaking lesson rhythm
  • **Hybrid analog-digital approach**: Optimal combination of projected materials and handwritten explanations
  • **Enhanced student focus**: Clearly separated information display areas

—

Made for educators, by educators ✏️📽️