미디어 · 커뮤니티
도각도각 (Dokak)
기계식 키보드 스위치의 소리를 탐색하고 재생하는 모바일 웹+앱 플랫폼. '도각도각'은 기계식 키보드를 두드릴 때 나는 소리를 표현한 우리말 의성어입니다.
keyboard
Main Screenshot
서비스 개요
도각도각은 브랜드·타입(Linear / Tactile / Clicky)별로 기계식 키보드 스위치를 탐색하고 타건음을 스트리밍으로 재생(폴리포니)하는 플랫폼입니다. 핵심 기능인 '스튜디오'에서는 키캡 배치 구성을 저장·편집·조회할 수 있으며, three.js 기반 3D 미리보기에서 뷰·스위치 선택·키캡 선택 3가지 모드로 스위치를 배정하고 키캡을 색상·문구·이미지·크기·회전으로 꾸밀 수 있습니다.
기술적 접근
백엔드는 Node.js 20과 Fastify, Prisma ORM으로 PostgreSQL을 다루며, 브랜드·스위치·사운드·이미지·유저·댓글· 좋아요·스튜디오 빌드·키캡 이미지 모델을 정교하게 설계했습니다. 웹 프론트엔드는 Vue 3와 Pinia, TypeScript로 구성했고, 3D 지오메트리는 별도 라이브러리 레이어로 분리해 관리합니다. Flutter 앱은 이 3D 스튜디오를 WebView로 그대로 재사용해 iOS·Android에서도 동일한 경험을 제공합니다. 인프라는 GCP Cloud Run과 GCS, Cloudflare Tunnel을 통한 홈랩 PostgreSQL 연결로 구성되어 있습니다.
주요 기능
search
브랜드·타입별 스위치 탐색 및 타건음 스트리밍 재생
view_in_ar
3D 스튜디오 — 키캡 배치 구성, 저장·편집·보기
palette
키캡 꾸미기 — 색상·문구·이미지·크기·회전 커스터마이징
favorite
사운드·이미지 좋아요, 댓글, 사용자 업로드
phone_iphone
Flutter 앱 — 3D 스튜디오 WebView 재사용
login
Google 로그인, 계정 삭제, 약관·개인정보 정적 페이지
화면 갤러리
imageScreenshot
imageScreenshot
imageScreenshot
imageScreenshot