🍄서버자파리작업과정텍스트시각화

텍스트 분석

  • 추출 방법

    • 도구 : Kiwi (Korean Intelligent Word Identifier) - 한국어 형태소 분석기

    • 텍스트를 형태소 분석하여 명사만 추출 (품사 태그가 NN으로 시작하는 것)

    • 명사의 빈도수를 계산

    • 가장 많이 나온 상위 5개를 키워드로 선택

    단어수 카운팅

    • 방법 : len(text.split()) : 공백 기준으로 분리한 단어 개수

    레벨링

    레벨에 따라 다른 식물 이미지(plant_01.png ~ plant_05.png)가 표시되는 형태

    • 레벨 1: 단어 수 50개 미만

    • 레벨 2: 단어 수 50~99개

    • 레벨 3: 단어 수 100~199개

    • 레벨 4: 단어 수 200~399개

    • 레벨 5: 단어 수 400개 이상

    요약문 생성

    • 첫 번째 문장 추출 (. ! ? 기준)

    • 첫 문장이 100자 이하면 그대로 사용

    • 100자 초과 시 100자로 자르고 ... 추가

시각화

기능 정의 (간단하게)

작은 선이 모여 패턴을 이루도록. 패턴이 모여서 풍경을 만들도록.

시각화 목적

- 음성 기록을 식물 형태로 변환하여 기록 과정의 즐거움과 지속성을 높임
- 시각적 아카이브를 통해 기존 기록 탐색을 유도

시각화 결과

- 각 음성 기록 = 하나의 식물
- 데이터(txt) 기반으로 잎 개수·형태 변화

스타일

- 거칠지만 자유로운 드로잉 스타일
- 연필·펜 질감, 패턴 기반 채움
- 관엽·선인장·허브 등 다양한 식물 형태
- 색 대신 패턴으로 면 구성
- 식물 간 겹침도 자연스럽게 표현


시각화 목적

- 기록 동기 부여: 음성 기록을 시각적인 형태(식물)로 변환하여, 기록 과정을 시각적으로 즐기고 지속할 수 있도록 함.
- 탐색 유도: 이미 기록된 음성 기록들을 식물 형태로 보여주어, 과거 기록을 다시 살펴보는 계기와 탐색 동기를 제공.

시각화 결과물

- 형태: 각 음성 기록 → 하나의 식물 그룹으로 표현.

- 변화 요소: 기록 데이터(텍스트) 기반으로 잎의 개수와 배치가 달라짐.
- 문장 수, 단어 수 등의 지표를 레벨(1~17)로 변환하여 잎 개수 결정.
- 다양성: 식물 형태(줄기, 잎 모양, 배치 패턴)는 데이터와 시드(seed)에 따라 달라져, 반복 기록이라도 변주를 가짐.

스타일 가이드

- 자유로운 형태: 매끈한 디지털 벡터보다 거칠고 자연스러운 선.
- 질감 : 연필/펜 드로잉 같은 질감과 패턴.
- 패턴 채움: 색채보다는 해칭, 점묘 등 패턴으로 면을 구성.
- 다양한 식물 형태: 관엽식물, 선인장, 허브 등 형태 변화를 반영.
- 중첩 자연스러움: 식물들이 겹쳐도 시각적으로 어색하지 않게.

- 데이터 기반 구성 : 음성 기록(txt)의 데이터를 기반으로 문장이나 단어가 이 많을수록 잎이 많아지고, 형태가 풍성해짐. 생각하기위해 비어있는 시간도 시각화에 반영함

구현 방향

데이터 해석

- 음성 기록(txt) → 문장 수 계산 → 레벨 매핑(1~17)
- 레벨 = 잎 개수, 또는 잎/가지 조합 변화에 직접 반영
- 시드(seed) 값으로 같은 기록은 같은 식물 형태 유지

시각화 엔진

- SVG 기반 랜더링 (PNG 불사용)
- 줄기·잎을 베지어 곡선으로 생성
- feTurbulence + feDisplacementMap 필터로 손그림 효과
- 잎, 줄기, 가지 위치를 시드 기반 난수로 배치

UI/UX 흐름

- 아카이브 페이지: 모든 기록을 격자 형태로 나열, 식물 미리보기 표시
- 각 식물 클릭 시 세부 화면(기록 내용, 생성 날짜 등) 확인

확장 고려

- 식물 종류 선택/랜덤
- 잎 패턴 스타일 추가

우선순위

기본 기능

- 텍스트 데이터 기반 잎 개수 매핑
- SVG 줄기+잎 랜더링
- 아카이브 페이지에서 모든 기록을 식물 형태로 표추가 구현
- 손그림 효과 필터 적용
- 식물 다양성(모양, 패턴) 구현
- 잎·줄기 성장 애니메이션

후속 확장

- 사용자 맞춤 스타일 선택
- 식물과 기록 내용을 결합한 공유 이미지 생성
- 필터/검색 기능(기간, 키워드별)

중요 검토 항목

- 성능 문제: SVG 렌더링에서 레벨이 높거나 식물 수가 많아질 경우 브라우저 성능 저하 가능성.
- 시드 값 관리: 동일 기록에서 시각화 결과가 변하지 않도록 고정 시드 생성 로직 필요.
- 데이터 매핑 규칙: 문장 수, 단어 수, 문자 수 등 어떤 기준을 레벨 결정에 쓸지 확정.
- 반응형 디자인: 작은 화면에서도 식물 형태와 텍스트가 잘 보이도록 비율 조정.
- 접근성 고려: 패턴·선만으로 표현 시 시각장애인 또는 색각이상 사용자의 이해도 확보 방안.
- 브라우저 호환성: feTurbulence 등 SVG 필터의 지원 범위와 모바일 환경 적용 여부 확인.
- 저장·재사용: 렌더링된 SVG를 서버에 저장할지, 매 요청마다 생성할지 결정 필요.