본문으로 건너뛰기

HandwritingInput

필기 � 력 캔버스 통합 — DigitalInk + RecognitionBridge + BrushConfiguration 조립

상태​

항목값
Layercomposite
TierL1
Statuswip
Version0.9.0
가격Free (free)
**카�
�고리**Input & UX

개요​

개요​

HandwritingInput 은 multi-saas-kit 의 Layer 2 Composite Plugin � 니다. 3개 base plugin 을 조립한 첫 Composite 으로, 캔버스 stroke � 력 → provider 인식 호출 → 정규화된 결과 반환을 단일 진� 점으로 제공합니다.

의존 base plugins (3�​

)

Plugin역할Layer
DigitalInkstroke 표준 + 검증 (StrokeData, StrokeNormalizer)L0 Foundation
BrushConfiguration캔버스 / brush 렌더 설정 (BrushDefaults, BrushConfigNormalizer)L0 Foundation
RecognitionBridge인식 API 어댑터 (RecognizerInterface, HandWriterRecognizer, GoogleInputToolsRecognizer, RecognizerChain)L1 Core

핵심 컴포넌트​

HandwritingInputService​

단일 진� 점 process() — 다음 5단계 흐름을 캡슐화:

1. StrokeData::fromArray($payload)              ← DigitalInk 검증
2. (선택) StrokeNormalizer 정규화 round-trip   ← 좌표 클린�

3. RecognizerInterface::recognize              ← RecognitionBridge
4. (선택) BrushConfigNormalizer::normalize     ← brush 메타 첨부
5. (선택) StrokeNormalizer::boundingBox        ← 필기 영역 메타
→ HandwritingInputResult

HandwritingInputResult (DTO)​

{
  ok, provider, elapsed_ms, candidates, message,
  canvas: { width, height },
  brush: { line_width, stroke_color, ... },     // include_brush=true 시
  bounding_box: { min_x, max_x, width, ... }    // include_bounding=true 시
}

설정 (config/handwriting-input.php)​

return [
    'enabled' => env('PLG_HANDWRITING_INPUT_ENABLED', true),
    'flow' => [
        'normalize_strokes' => false,  // true 면 0~1 정규화 후 다시 환산 (provider 호환)
        'include_brush'     => true,   // 결과에 brush config 포함
        'include_bounding'  => true,   // 결과에 bounding box 포함
    ],
];

사용 예시​

use App\Plugins\BrushConfiguration\Services\BrushConfigNormalizer;
use App\Plugins\DigitalInk\Services\StrokeNormalizer;
use App\Plugins\HandwritingInput\Services\HandwritingInputService;
use App\Plugins\RecognitionBridge\Recognizers\HandWriterRecognizer;
use App\Plugins\RecognitionBridge\Recognizers\GoogleInputToolsRecognizer;
use App\Plugins\RecognitionBridge\Services\CandidateNormalizer;
use App\Plugins\RecognitionBridge\Services\RecognizerChain;

$candNorm = CandidateNormalizer::fromConfig(config('recognition-bridge.candidates'));
$chain = new RecognizerChain([
    new HandWriterRecognizer(config('recognition-bridge.hand_writer'), $candNorm),
    new GoogleInputToolsRecognizer(config('recognition-bridge.google_input_tools'), $candNorm),
]);

$service = new HandwritingInputService(
    recognizer: $chain,
    strokeNormalizer: new StrokeNormalizer,
    brushNormalizer: BrushConfigNormalizer::fromConfig(config('brush-configuration')),
    flow: config('handwriting-input.flow'),
);

$result = $service->process(
    payload: ['ink' => [...], 'width' => 200, 'height' => 100],
    brushInput: ['line_width' => 8, 'stroke_color' => '#0000ff'],
    options: ['language' => 'en', 'mode' => 'numeric', 'returnCount' => 5],
);

return response()->json($result->toArray());

범위​

HandwritingInput 은 � 력 스택 조립만 담당합니다. 도메인별 채점, 학습 평가, 제출 workflow, 화면 UI 는 포함하지 않습니다. Recognition provider 운영/과금은 RecognitionBridge 의 provider 설정이 가리키는 프로젝트가 담당하고, SaaS별 � 무 규칙은 consumer 쪽에서 구현합니다.

라이선스​

MIT

의존성​

데모​

🛒 Plugin Store에서 보기: store.codebase.how/plugins/handwriting-input