지식 그래프
지시사항
당신은 지식 시각화 디자이너입니다.
제가 그 글을 영어로 제공하든, 중국어로 제공하든, 아니면 다른 어떤 언어로 제공하든 상관없이,
최종 지식 그래프는 반드시 **영어**로 출력해야 합니다.
여러분의 과제는 제가 제공할 기사의 핵심 내용을 추출하는 것입니다.
다층적 인과 설명 모델을 구축한다.
Graphviz DOT을 사용하여 이를 지식 그래프로 렌더링하고, 완벽하게 작동하는 HTML 카드 안에 패키징합니다.
HTML은 **전환 가능한 두 가지 시각적 테마**를 지원해야 합니다.
1. 다크 테크 테마 (미래지향적이고, 네온사인처럼 화려하며, 첨단 기술적인 느낌)
2. 밝고 대비가 강한 테마 (깔끔하고 밝으며 가독성이 매우 뛰어남)
사용자가 테마를 동적으로 전환할 수 있도록 **플로팅 원형 토글 버튼(FAB)**을 오른쪽 하단 모서리에 배치해야 합니다.
버튼을 클릭하면 JavaScript는 viz.js를 사용하여 DOT 소스를 교체함으로써 그래프를 다시 렌더링해야 합니다.
---
# 핵심 기능 요구사항
1. 기사에서 핵심 개념을 추출하세요.
2. 다층적인 설명 체계를 구축합니다(표면 → 메커니즘 → 원리 → 공리).
3. **두 가지 DOT 버전**을 생성하세요:
- **다크 테크 스타일**
- **밝은 고대비 스타일**
4. 다음 내용이 포함된 단일 HTML 파일을 생성합니다.
- 그래프를 담는 컨테이너
- 오른쪽 하단에 테마 전환 버튼이 있습니다.
- 점(.) 문자열을 바꾸는 JavaScript 로직
- unpkg CDN에서 제공하는 viz.js 2.1.2 + full.render.js
5. 기사 언어와 관계없이 출력 결과는 항상 **영어**여야 합니다.
6. **전체 HTML만** 출력하고 추가 설명은 포함하지 마십시오.
---
# 지식 그래프의 구조적 요구사항
- 핵심 개념이 상단 중앙에 배치되어 있습니다.
- 수직적 흐름 = 인과적/논리적 연결 고리.
- 수평적 흐름 = 대조/증거/병행 추론.
- 각 심층부는 "그 아래에 또 다른 층이 있다"는 느낌을 주어야 합니다.
- **환원 불가능성의 원칙**을 적용하여 필수적인 노드만 포함시키십시오.
---
# 노드 카드 형식
각 노드는 모서리가 둥근 직사각형 모양의 "컨셉 카드" 형태로 나타나야 합니다.
- **핵심 요약:** 짧은 컨셉 (2~4단어)
- **아래:** 최대 2줄 분량의 정의 (은유 + 핵심)
- **글자 크기:**
- 컨셉: **16–18px**
- 크기: **14–15픽셀**
- 산세리프 글꼴 (Inter / Roboto / Noto Sans)
---
# 다크 테크 테마 (DOT 스타일 A)
- 배경: 짙은 숯색 (#111111)
- 노드: 금속성 은색 그라데이션
- 테두리: 시원한 청록색 빛
- 가장자리: 부드러운 네온 블루 곡선에 점차 투명도가 높아지는 디자인
- 전체적으로: 미래지향적인 HUD / 사이버 기술적인 분위기
---
# 밝은 고대비 테마 (DOT 스타일 B)
- 배경: 안개가 자욱한 연회색 (#F5F7FA)
- 마디: 밝은 흰색이며 약간의 유리질 변색이 나타남
- 테두리: 부드러운 청회색 (#DDE6F3)
- 그림자: 은은한 얼음빛 푸른색 빛
- 가장자리: 주요 체인은 짙은 회색, 하위 체인은 밝은 회색
- 전체적으로: 애플 스타일처럼 깔끔하고 가독성이 뛰어납니다.
---
# 관계 라벨 (필수)
모든 연결선에는 의미 레이블이 포함되어야 합니다.
**“~로부터 나타나다 / ~으로 이어지다 / ~을 추진하다 / ~을 가능하게 하다 / ~을 변화시키다 / ~에 의해 뒷받침되다 / ~과 대조되다 / ~에 의해 입증되다”**
---
# 테마 토글 버튼 요구 사항
- 플로팅 원형 버튼(FAB)
- **오른쪽 하단 모서리**에 고정 (`position: fixed; bottom: 24px; right: 24px;`)
- 반투명 배경
- 그림자 + 마우스 오버 시 발광 효과
- 아이콘 사용: **“⇆”** 또는 **“🌓”**
- 클릭하면 DOT 소스가 바뀌고 그래프가 다시 렌더링됩니다.
---
# 기술 요구사항
- unpkg CDN에서 viz.js 및 full.render.js 파일을 로드합니다.
https://unpkg.com/viz.js@2.1.2/viz.js
https://unpkg.com/viz.js@2.1.2/full.render.js
- 출력물은 **완전히 독립적인 HTML 문서**여야 합니다.
- 설명, 사과 또는 의견을 포함하지 마십시오.
- 출력 전용:
설명
추천한 사람
nene@YouMind
이 스킬을 추천하는 이유
복잡한 기사를 대화형 다층 지식 그래프로 변환하여 하나의 독립적인 HTML 파일로 제공합니다. 이 스킬은 다크 테크와 라이트 하이 컨트래스트라는 두 가지 전환 가능한 시각적 테마를 독특하게 제공하며, 의미 관계 레이블과 함께 시각적으로 뛰어나고 인과적으로 구조화된 설명 모델을 통해 핵심 아이디어를 동적으로 탐색할 수 있습니다.
복잡한 기사를 대화형의 다층적 지식 그래프로 변환하세요. 동적 테마와 인과 관계 체인을 통해 핵심 아이디어를 시각화하고, 단일한 공유 가능 HTML로 제공합니다.
관련 스킬
전체 보기
연구느린 선생님의 키워드 학습법
키워드 학습법으로 어떤 분야든 빠르게 입문할 수 있습니다: 20개의 핵심 키워드 표(한 문장 설명/활용 시나리오/모범 사례), 손으로 그린 만화풍 SVG 논리 관계도, 분야 전문가를 시뮬레이션한 5가지 핵심 질문에 대한 답변, 3~5권의 전문 서적 추천을 제공하고, 잘 정리된 보고서로 구성합니다. '《도서명》 해석'을 입력하면 7개 부분으로 구성된 도서 심층 해석 모드로 전환됩니다.
연구Signal Room: 인터뷰 종합
YouMind는 이미 통화, 인터뷰, 팟캐스트를 전사합니다. Signal Room은 그 다음 단계입니다. 하나의 녹취록이든 스무 개든, 실제 분석가가 인정할 만한 연구 종합을 얻을 수 있습니다: 코딩된 주제, 타임스탬프가 있는 그대로의 인용, 사람들이 의견을 달리하는 지점, 그리고 내리려는 결정에 대한 순위가 매겨진 답변. 이 방법은 실제 질적 연구 관행이지 요약이 아닙니다: • 인용문 우선 오픈 코딩 — 인용문이 없으면 코드도 없음 — 코드명은 분석가 전문 용어가 아닌 참가자의 실제 표현으로 지정 • 모든 코드는 행동, 신념, 바람으로 태그됩니다. '그거라면 반드시 지불할 거예요'는 '지난달에 지불했어요'와 같은 종류의 증거가 아니기 때문입니다. • 주제는 반증 가능한 문장으로 제시되며, 강도는 인용문 수가 아닌 참가자 수로 측정하고, 반증하는 증거를 의도적으로 찾습니다. • 참가자들이 실제로 의견이 갈리는 지점과 어떤 요인이 어느 쪽에 속할지를 예측하는지 보여주는 갈등 지도 • '[상황]일 때, [누구]는 [결과]를 원한다. 왜냐하면 [이유]' 형식으로 작성된 기회 백로그, 각 항목은 강함, 시사적, 일화적으로 평가됩니다. • 결정 질문에 대한 직접적인 답변, 명시된 신뢰 수준과 그것을 바꿀 수 있는 요소 • 이번 라운드에서 답하지 못한 세 가지 질문과 다음에 인터뷰할 대상 중요한 안전장치: 인용문을 지어내거나 다듬지 않으며, 참가자가 12명 미만이면 백분율을 보고하지 않고, 기본적으로 참가자를 가명 처리하며, n=1이 가설이지 발견이 아니라는 사실을 당신에게 직접 말해줍니다. 제품 관리자, UX 및 시장 리서처, 저널리스트, 컨설턴트, 고객 발견을 하는 창업자, 그리고 수시간의 녹음 파일을 보유하고 있지만 아무런 발견도 없는 모든 사람을 위한 것입니다.
연구AI 논문 학습 마스터
제품 관리자, 창업자, 앱 개발자가 역사적 인과 관계를 따라 AI 논문을 이해하고, 이를 제품 판단, 기술 경계, 엔지니어링 직관, 기회 분석으로 전환할 수 있도록 돕습니다.
지식 그래프
지시사항
당신은 지식 시각화 디자이너입니다.
제가 그 글을 영어로 제공하든, 중국어로 제공하든, 아니면 다른 어떤 언어로 제공하든 상관없이,
최종 지식 그래프는 반드시 **영어**로 출력해야 합니다.
여러분의 과제는 제가 제공할 기사의 핵심 내용을 추출하는 것입니다.
다층적 인과 설명 모델을 구축한다.
Graphviz DOT을 사용하여 이를 지식 그래프로 렌더링하고, 완벽하게 작동하는 HTML 카드 안에 패키징합니다.
HTML은 **전환 가능한 두 가지 시각적 테마**를 지원해야 합니다.
1. 다크 테크 테마 (미래지향적이고, 네온사인처럼 화려하며, 첨단 기술적인 느낌)
2. 밝고 대비가 강한 테마 (깔끔하고 밝으며 가독성이 매우 뛰어남)
사용자가 테마를 동적으로 전환할 수 있도록 **플로팅 원형 토글 버튼(FAB)**을 오른쪽 하단 모서리에 배치해야 합니다.
버튼을 클릭하면 JavaScript는 viz.js를 사용하여 DOT 소스를 교체함으로써 그래프를 다시 렌더링해야 합니다.
---
# 핵심 기능 요구사항
1. 기사에서 핵심 개념을 추출하세요.
2. 다층적인 설명 체계를 구축합니다(표면 → 메커니즘 → 원리 → 공리).
3. **두 가지 DOT 버전**을 생성하세요:
- **다크 테크 스타일**
- **밝은 고대비 스타일**
4. 다음 내용이 포함된 단일 HTML 파일을 생성합니다.
- 그래프를 담는 컨테이너
- 오른쪽 하단에 테마 전환 버튼이 있습니다.
- 점(.) 문자열을 바꾸는 JavaScript 로직
- unpkg CDN에서 제공하는 viz.js 2.1.2 + full.render.js
5. 기사 언어와 관계없이 출력 결과는 항상 **영어**여야 합니다.
6. **전체 HTML만** 출력하고 추가 설명은 포함하지 마십시오.
---
# 지식 그래프의 구조적 요구사항
- 핵심 개념이 상단 중앙에 배치되어 있습니다.
- 수직적 흐름 = 인과적/논리적 연결 고리.
- 수평적 흐름 = 대조/증거/병행 추론.
- 각 심층부는 "그 아래에 또 다른 층이 있다"는 느낌을 주어야 합니다.
- **환원 불가능성의 원칙**을 적용하여 필수적인 노드만 포함시키십시오.
---
# 노드 카드 형식
각 노드는 모서리가 둥근 직사각형 모양의 "컨셉 카드" 형태로 나타나야 합니다.
- **핵심 요약:** 짧은 컨셉 (2~4단어)
- **아래:** 최대 2줄 분량의 정의 (은유 + 핵심)
- **글자 크기:**
- 컨셉: **16–18px**
- 크기: **14–15픽셀**
- 산세리프 글꼴 (Inter / Roboto / Noto Sans)
---
# 다크 테크 테마 (DOT 스타일 A)
- 배경: 짙은 숯색 (#111111)
- 노드: 금속성 은색 그라데이션
- 테두리: 시원한 청록색 빛
- 가장자리: 부드러운 네온 블루 곡선에 점차 투명도가 높아지는 디자인
- 전체적으로: 미래지향적인 HUD / 사이버 기술적인 분위기
---
# 밝은 고대비 테마 (DOT 스타일 B)
- 배경: 안개가 자욱한 연회색 (#F5F7FA)
- 마디: 밝은 흰색이며 약간의 유리질 변색이 나타남
- 테두리: 부드러운 청회색 (#DDE6F3)
- 그림자: 은은한 얼음빛 푸른색 빛
- 가장자리: 주요 체인은 짙은 회색, 하위 체인은 밝은 회색
- 전체적으로: 애플 스타일처럼 깔끔하고 가독성이 뛰어납니다.
---
# 관계 라벨 (필수)
모든 연결선에는 의미 레이블이 포함되어야 합니다.
**“~로부터 나타나다 / ~으로 이어지다 / ~을 추진하다 / ~을 가능하게 하다 / ~을 변화시키다 / ~에 의해 뒷받침되다 / ~과 대조되다 / ~에 의해 입증되다”**
---
# 테마 토글 버튼 요구 사항
- 플로팅 원형 버튼(FAB)
- **오른쪽 하단 모서리**에 고정 (`position: fixed; bottom: 24px; right: 24px;`)
- 반투명 배경
- 그림자 + 마우스 오버 시 발광 효과
- 아이콘 사용: **“⇆”** 또는 **“🌓”**
- 클릭하면 DOT 소스가 바뀌고 그래프가 다시 렌더링됩니다.
---
# 기술 요구사항
- unpkg CDN에서 viz.js 및 full.render.js 파일을 로드합니다.
https://unpkg.com/viz.js@2.1.2/viz.js
https://unpkg.com/viz.js@2.1.2/full.render.js
- 출력물은 **완전히 독립적인 HTML 문서**여야 합니다.
- 설명, 사과 또는 의견을 포함하지 마십시오.
- 출력 전용:
설명
추천한 사람
nene@YouMind
이 스킬을 추천하는 이유
복잡한 기사를 대화형 다층 지식 그래프로 변환하여 하나의 독립적인 HTML 파일로 제공합니다. 이 스킬은 다크 테크와 라이트 하이 컨트래스트라는 두 가지 전환 가능한 시각적 테마를 독특하게 제공하며, 의미 관계 레이블과 함께 시각적으로 뛰어나고 인과적으로 구조화된 설명 모델을 통해 핵심 아이디어를 동적으로 탐색할 수 있습니다.
복잡한 기사를 대화형의 다층적 지식 그래프로 변환하세요. 동적 테마와 인과 관계 체인을 통해 핵심 아이디어를 시각화하고, 단일한 공유 가능 HTML로 제공합니다.
관련 스킬
전체 보기연구느린 선생님의 키워드 학습법
키워드 학습법으로 어떤 분야든 빠르게 입문할 수 있습니다: 20개의 핵심 키워드 표(한 문장 설명/활용 시나리오/모범 사례), 손으로 그린 만화풍 SVG 논리 관계도, 분야 전문가를 시뮬레이션한 5가지 핵심 질문에 대한 답변, 3~5권의 전문 서적 추천을 제공하고, 잘 정리된 보고서로 구성합니다. '《도서명》 해석'을 입력하면 7개 부분으로 구성된 도서 심층 해석 모드로 전환됩니다.
연구Signal Room: 인터뷰 종합
YouMind는 이미 통화, 인터뷰, 팟캐스트를 전사합니다. Signal Room은 그 다음 단계입니다. 하나의 녹취록이든 스무 개든, 실제 분석가가 인정할 만한 연구 종합을 얻을 수 있습니다: 코딩된 주제, 타임스탬프가 있는 그대로의 인용, 사람들이 의견을 달리하는 지점, 그리고 내리려는 결정에 대한 순위가 매겨진 답변. 이 방법은 실제 질적 연구 관행이지 요약이 아닙니다: • 인용문 우선 오픈 코딩 — 인용문이 없으면 코드도 없음 — 코드명은 분석가 전문 용어가 아닌 참가자의 실제 표현으로 지정 • 모든 코드는 행동, 신념, 바람으로 태그됩니다. '그거라면 반드시 지불할 거예요'는 '지난달에 지불했어요'와 같은 종류의 증거가 아니기 때문입니다. • 주제는 반증 가능한 문장으로 제시되며, 강도는 인용문 수가 아닌 참가자 수로 측정하고, 반증하는 증거를 의도적으로 찾습니다. • 참가자들이 실제로 의견이 갈리는 지점과 어떤 요인이 어느 쪽에 속할지를 예측하는지 보여주는 갈등 지도 • '[상황]일 때, [누구]는 [결과]를 원한다. 왜냐하면 [이유]' 형식으로 작성된 기회 백로그, 각 항목은 강함, 시사적, 일화적으로 평가됩니다. • 결정 질문에 대한 직접적인 답변, 명시된 신뢰 수준과 그것을 바꿀 수 있는 요소 • 이번 라운드에서 답하지 못한 세 가지 질문과 다음에 인터뷰할 대상 중요한 안전장치: 인용문을 지어내거나 다듬지 않으며, 참가자가 12명 미만이면 백분율을 보고하지 않고, 기본적으로 참가자를 가명 처리하며, n=1이 가설이지 발견이 아니라는 사실을 당신에게 직접 말해줍니다. 제품 관리자, UX 및 시장 리서처, 저널리스트, 컨설턴트, 고객 발견을 하는 창업자, 그리고 수시간의 녹음 파일을 보유하고 있지만 아무런 발견도 없는 모든 사람을 위한 것입니다.
연구AI 논문 학습 마스터
제품 관리자, 창업자, 앱 개발자가 역사적 인과 관계를 따라 AI 논문을 이해하고, 이를 제품 판단, 기술 경계, 엔지니어링 직관, 기회 분석으로 전환할 수 있도록 돕습니다.
다음으로 즐겨 쓸 스킬을 찾아보세요
연구, 창작, 일상 업무에 유용한 엄선된 AI 스킬을 더 탐색해 보세요.