텐서플로 플레이그라운드
작은 신경망을 브라우저 안에서 직접 학습시켜 보는 실습 페이지입니다. 층과 뉴런의 수, 활성화 함수, 학습률을 바꾸면 데이터를 나누는 경계선이 어떻게 달라지는지 눈으로 확인할 수 있습니다. 내려받는 모델이 없어 열자마자 바로 돌아갑니다.
🔬
원리를 눈으로 — AI는 어떻게 동작하나
"되는 건 봤으니, 이제 안을 열어 봅시다." 신경망이 무엇을 배우고 어떻게 판단하는지, 클릭하며 눈으로 확인하는 시각화 자료들입니다.
수식은 거의 나오지 않습니다. 값을 바꿔 보고 결과가 어떻게 달라지는지 지켜보는 편이 훨씬 오래 남습니다.
1
신경망은 어떻게 배우나
점 몇 개를 나누는 일부터. 뉴런과 층이 늘어날 때 무엇이 달라지는지 직접 만져 봅니다.
ConvNetJS (브라우저 신경망 학습)
ConvNetJS는 브라우저에서 딥러닝 모델을 학습할 수 있는 라이브러리입니다. 데모를 통해 신경망의 학습 과정과 결과를 시각화해서 볼 수 있습니다.
wevi (워드 임베딩 학습 관찰기)
word2vec이 단어 벡터를 만들어 가는 과정을 한 단계씩 눈으로 따라가는 도구입니다. 'eat|apple, drink|milk'처럼 아주 작은 학습 데이터를 넣고 학습을 진행시키면 입력·출력 가중치 행렬의 칸 색이 조금씩 바뀌고, 아래 PCA 그림에서 단어 점들이 자리를 잡아 갑니다. 임베딩이 미리 정해진 값이 아니라 반복 학습을 거치며 조금씩 만들어진 결과라는 점을 이해하게 됩니다.
Embedding Projector (임베딩 공간 탐색)
단어 같은 데이터를 수백 차원 벡터로 나타낸 임베딩을 2차원이나 3차원으로 줄여서 보여 주는 텐서플로 도구입니다. 처음 열면 200차원 Word2Vec 단어 1만 개가 점으로 찍혀 있고, 단어 하나를 고르면 그 단어와 가장 가까운 이웃 단어들이 목록으로 나옵니다. 뜻이 비슷한 단어가 공간에서 가까이 모인다는 임베딩의 기본 성질을 눈으로 확인하게 됩니다.
2
이미지를 보는 눈 (CNN)
한 장의 그림이 층을 지나며 무엇으로 바뀌는지, 필터 하나하나가 무엇을 붙잡는지 들여다봅니다.
CNN 시각적 설명
사용자가 CNN의 내부 작동 방식을 쉽게 이해할 수 있도록 구현한 프로그램입니다. 이미지 인식 과정을 단계별로 시각화해서 볼 수 있습니다.
3D CNN 시각화 (손글씨 숫자 인식)
손글씨 숫자를 알아맞히는 합성곱 신경망(CNN)의 내부를 3차원으로 펼쳐 보여 주는 시각화입니다. 입력층에서 합성곱층, 다운샘플링층, 완전연결층, 출력층으로 넘어가며 그림이 점점 작고 추상적인 값으로 요약되는 과정을 볼 수 있습니다. 신경망이 통째로 된 블랙박스가 아니라 역할이 다른 층들이 이어 붙은 구조라는 점을 이해하게 됩니다.
텐서플로우 시각화
TensorFlow로 사전 훈련된 딥러닝 모델을 로드해서 이를 3D 시각화 장면으로 출력합니다. 각 모델의 처리 과정을 시각화하여 볼 수 있습니다.
3
언어 모델의 속
글자가 토큰으로 쪼개지고, 단어들이 서로를 바라보고(어텐션), 다음 낱말이 뽑혀 나오기까지를 단계별로 따라갑니다.
토크나이저 플레이그라운드
입력한 문장이 인공지능 모델 안에서 어떤 조각(토큰)으로 쪼개지는지 색으로 보여 주는 페이지입니다. GPT-4, Claude, Llama 3, Gemma, Mistral, BERT, T5 등 13가지 모델의 토크나이저를 골라 비교할 수 있습니다.
Tiktokenizer (토큰 분해 체험)
언어 모델이 문장을 어떤 단위(토큰)로 쪼개는지 눈으로 확인하는 도구입니다. 글을 입력하면 토큰 개수와 함께 색으로 구분된 토큰 조각, 그리고 각 토큰의 숫자 ID가 바로 표시됩니다. 대화 형식이 실제로 어떤 특수 표시와 함께 모델에 전달되는지도 볼 수 있습니다.
Transformer Explainer (트랜스포머 동작 원리)
GPT 계열 언어 모델이 다음 단어를 어떻게 고르는지 단계별로 보여 주는 학습용 시각화입니다. 브라우저에서 GPT-2(small)를 실제로 돌려, 입력한 문장이 토큰과 임베딩으로 바뀌고 셀프 어텐션과 MLP를 거쳐 다음 단어 확률이 나오기까지의 흐름을 따라갈 수 있습니다. 언어 모델이 마법이 아니라 '다음에 올 가능성이 가장 큰 단어'를 계산하는 장치라는 점을 이해하게 됩니다.
Attention Viz (트랜스포머 어텐션 전역 지도)
트랜스포머 모델의 어텐션 패턴을 층과 헤드별로 한 화면에 늘어놓아 비교하는 시각화 도구입니다. 쿼리 벡터와 키 벡터를 같은 공간에 함께 투영하기 때문에, 헤드마다 전혀 다른 모양의 패턴이 나타나는 것을 한눈에 볼 수 있습니다. 어텐션 헤드들이 각자 다른 관계를 보고 있다는 점을 확인하게 되며, 트랜스포머 구조를 이미 알고 있는 학습자를 대상으로 합니다.
LLM Visualization (언어 모델 3D 해부)
GPT 언어 모델의 내부를 3차원 그림으로 펼쳐 놓고 위에서 아래로 따라 내려가는 해설입니다. 파라미터가 8만 5천 개뿐인 nano-gpt로 시작해, 'C B A B B C' 같은 글자열을 알파벳 순으로 정렬하는 아주 단순한 과제를 모델이 어떻게 처리하는지 봅니다. 숫자가 임베딩이 되어 여러 층을 지나 다음 토큰 확률로 나오기까지, 층마다 어떤 계산이 일어나는지 감을 잡을 수 있습니다.
4
없는 것을 만들어 내는 원리
둘이 겨루는 GAN과, 노이즈에서 그림을 걷어 올리는 디퓨전. 생성형 AI의 두 축입니다.
GAN 시각적 설명
GAN의 학습 과정을 대화형 시각화 도구로 실시간으로 살펴볼 수 있는 프로그램입니다. 2D 데이터에 대한 생성자와 판별자의 작동 과정을 예시로 제시하였습니다.
디퓨전 익스플레이너 (이미지 생성 원리 시각화)
스테이블 디퓨전이 글을 어떻게 그림으로 바꾸는지 단계별로 보여 주는 시각화 자료입니다. 문장을 토큰으로 쪼개고, 벡터로 바꾸고, 무작위 노이즈를 조금씩 걷어내며 그림을 다듬은 뒤 해상도를 키우는 과정을 한 화면에서 따라갈 수 있습니다.