FLICK

커뮤니티 게시글을 유튜브 쇼츠 포맷에 맞게 바꾸어주어 쇼츠 생성을 용이하게 해주는 확장 프로그램

[핵심 한줄] 국내 커뮤니티(에펨코리아, 디시인사이드, 네이버 카페, 웃대 등)의 게시물에서 제목·이미지·동영상·텍스트를 추출하여 방해 요소를 제거하고, 집중·요약·스크랩 친화적인 “쇼츠형 레이아웃”으로 화면 위에 오버레이해 보여주는 경량 확장입니다. [주요 특징 하이라이트] 원클릭/단축키(F4)로 현재 글을 가볍게 ‘읽기 모드 + 카드형 쇼츠 뷰’로 전환 페이지의 광고/잡음 DOM 요소는 배제하고 본문 핵심 블록(이미지·영상·텍스트)만 순서 유지 제목 인라인 편집 + 글자 크기 즉시 조정 (슬라이더) 텍스트 강조(하이라이트) 색상 사용자 지정 & 강조 해제 버튼 헤더/푸터 영역 드래그로 동적 높이 조절(개인 취향 레이아웃 저장) 다중 비디오 존재 시 중복 제거 후 정돈된 목록화 새로고침/재방문 시 폰트 크기, 헤더·푸터 높이, 강조 색상 자동 복원(localStorage) SPA(네이버 카페 등)의 동적 라우팅 변화 감지 → 버튼/레이어 자동 재주입 완전한 클라이언트 사이드 처리: 외부 서버 전송 없음 (로컬에서만 동작) [누가 사용하면 좋은가] 커뮤니티 글을 빠르게 요약 스크랩하고 싶은 크리에이터 길고 산만한 레이아웃 대신 핵심 미디어/텍스트만 집중 소비하려는 사용자 영상/이미지 다수 포함 글을 ‘슬림한 뷰(Shorts 감각)’로 살펴보고 싶은 리서처 화면 캡처나 2차 편집 전, 노이즈 없는 클린 소스로 보고 싶은 편집자 [동작 방식 (기술 개요)] 페이지 진입 시 자동 매칭: 등록된 규칙(match 정규식)으로 지원 사이트 판별 사용자가 F4 또는 플로팅 ‘FLICK’ 로고 클릭 → 추출 파이프라인 실행 DOM에서 본문 영역을 기준으로 이미지/비디오/텍스트 노드를 순회하며: 중복 이미지·비디오 필터 불필요한 공백/브레이크/컨트롤 노이즈 제거 문단 단위 정규화 → <br> 기반 최소 구조 HTML 변환 결과를 오버레이 컨테이너(.flick-wrap-injected)로 렌더링 사용자 상호작용(드래그 리사이즈, 글자 크기, 하이라이트) → 즉시 반영 및 localStorage에 키 단위 저장 닫기(Escape, 버튼) 시 원본 페이지 그대로 복원 (DOM 오염 최소화) [권한 & 프라이버시] 최소 권한 정책: (권장 설정 시) 특정 지원 도메인 매칭만 사용. 외부 네트워크 전송(fetch/XHR/WebSocket/sendBeacon) 코드 없음. 수집/전송하는 개인정보 0. 저장 항목(localStorage): flick:titleFontSize (제목 폰트 크기) flick:headerHeight / flick:footerHeight (레이아웃 높이) flick:highlightColor (강조 색상) 모든 데이터는 브라우저 로컬에만 존재, 제거는 브라우저 저장소 비우기 또는 확장 삭제. [빠른 시작] 지원 사이트 기사(글) 페이지로 이동 우측 상단(또는 body 영역) ‘FLICK’ 로고 확인 로고 클릭 혹은 F4 → 쇼츠 뷰 열림 제목 수정 / 글자 크기 슬라이더 조정 / 원하는 텍스트 드래그 → 자동 강조 강조 색 변경: 플로팅 패널 내 컬러 피커 완료 후 ESC 또는 로고 재클릭으로 닫기 [단축키 & 인터랙션] F4: 열기/닫기 토글 (게시글 페이지 조건) ESC: 열린 상태 즉시 닫기 마우스 드래그: 헤더 / 푸터 경계 바(가운데 작은 바) 잡아 높이 조절 텍스트 드래그(선택 후 마우스 놓기): 선택 영역 자동 강조 강조 해제 버튼: 모든 강조 span 제거 [커스터마이징 요소] 제목 폰트 크기: 12px~72px 범위 실시간 반영 강조 색: 컬러 피커로 HEX 지정 (#RGB / #RRGGBB) 레이아웃 높이: 헤더·푸터 독립 조절 → 시각적 정보 밀도 조정 추후(로드맵): 다크/라이트 테마, 폰트 패밀리 선택, 이미지 그리드 모드 [지원 사이트 (초기)] 에펨코리아 (fmkorea.com) 디시인사이드 (gall.dcinside.com, m.dcinside.com) 네이버 카페 (cafe.naver.com) 개드립 (dogdrip.net) (추가 요청 가능: 업데이트 시 매칭 규칙 확장) [다른 ‘읽기 모드’ 대비 차별점] 쇼츠/카드형 감각: 세로 스크롤 집중 흐름 유지 멀티 비디오/이미지 정리 + 반복된 미디어 중복 제거 즉시 편집 가능한 제목과 컬러 강조 내장 (외부 툴 불필요) SPA 라우팅 탄력 대응(감지 + 재주입 로직) 설정값 자동 복원으로 반복 조작 최소화 [FAQ] Q. 광고나 페이지 일부가 사라졌어요. A. 의도적으로 본문 외 요소를 제거(필터)합니다. 원본은 닫으면 그대로 남아있습니다. Q. 강조가 안 될 때가 있어요. A. 제목 영역 밖이거나 선택이 collapse 상태이면 무시됩니다. 텍스트 한 글자 이상 드래그 후 마우스를 떼세요. Q. 저장된 설정 초기화는? A. 개발자도구 > Application > Local Storage 에서 flick:* 키 삭제 또는 브라우저 사이트 데이터 삭제. Q. 왜 확장 서버와 통신하지 않나요? A. 가벼움·프라이버시 최우선 설계. 향후 동기화 필요 시 명확 고지 예정. Q. 모바일 크롬에서도 되나요? A. 데스크톱 환경 최적화. 모바일 확장은 브라우저 정책 한계로 제한될 수 있습니다. [문제 해결 가이드] 버튼이 안 보임: 현재 페이지가 지원 사이트/기사인지 확인 → 새로고침 → 여전히 없으면 다른 확장(CSS 차단류) 충돌 여부 점검 레이아웃 깨짐: 확대/축소 비율(브라우저 줌) 100% 재확인 단축키 충돌: 다른 확장/사이트가 F4 캡처 가능. 그 경우 로고 클릭 사용 비디오가 안 나옴: 원문이 지연 로딩하는 경우 약간 늦게 열기 또는 새로고침 후 다시 [향후 로드맵] 테마 (다크/라이트, 고대비) 이미지 뷰 모드(모자이크 / 슬라이드) 내보내기(클립보드/마크다운) 사용자 규칙 커스터마이저 (CSS 셀렉터 기반) 다국어 UI (EN, JP) 하이라이트 공유(옵션) 기능 (도입 시 별도 동의 + 투명한 정책 공개) [버전 / 변경내역] v0.0.2 타입스크립트로 소스코드 전환 로고 리브랜딩 v0.0.1 (Initial) 기본 사이트 규칙 4종 쇼츠 뷰 생성, 제목 편집, 폰트 크기 슬라이더 텍스트 자동 강조 + 컬러 선택 + 전체 강조 해제 헤더/푸터 드래그 리사이즈 + 자동 저장 F4 / ESC 단축키, SPA 라우팅 감지 [문의 & 피드백] 버그/기능 제안: andongmin94@gmail.com 오픈소스 구조: 규칙 모듈 + UI 모듈로 분리 설계, 기여 환영 (Pull Request Guideline 추후 제공) [면책 및 주의] 본 확장은 각 커뮤니티의 공식 서비스가 아니며, 표시되는 콘텐츠 저작권은 원저작자 및 해당 커뮤니티에 귀속됩니다. 상업적 재배포나 자동 대량 추출 용도로 사용하지 마십시오. 사이트 구조 변경 시 일부 기능은 예고 없이 일시 중단될 수 있습니다. [프라이버시 요약] “FLICK은 어떤 개인 정보도 수집·전송하지 않으며, 사용자 설정은 브라우저 로컬 저장소에만 보관됩니다.”