#1 피그마는 인간 사고를 닮았다
일반 GPT vs 함수형 GPT, 사고의 깊이를 비교하다
1. “처음 피그마를 열었을 때, 나는 사고 구조를 보았다.”
나는 예전에 피그마를 처음 설치한 날, 단순히 디자인 툴을 열었다고 생각했다.
하지만 몇 분이 지나자 그 화면 안에는 ‘사고의 지도’가 펼쳐져 있었다.
왼쪽엔 레이어 구조가 있었고, 가운데엔 캔버스가 있었으며, 오른쪽엔 속성 패널이 있었다.
대부분의 초보자는 이 세 영역을 “기능”으로 본다.
하지만 나는 그것을 인간의 인지 구조, 그리고 AI의 사고 모델로 보았던 기억이 되살아났다.
그래서 몇일전 일반 GPT의 답변과 함수형 GPT 답변을 비교하고자 실험을 해 보았다. 나는 일반 GPT에게 물었다.
“피그마의 왼쪽, 가운데, 오른쪽 영역은 각각 어떤 역할을 하는가?”
이 단순한 질문 하나가 ‘언어 예측 모델’과 ‘사고 모델’의 차이를 드러냈다.
2. 일반 GPT: 답변
“피그마의 왼쪽, 가운데, 오른쪽 영역의 역할은 무엇인가?
1) 왼쪽 영역 – Layers / Assets 패널: 레이어 관리 + 컴포넌트 라이브러리 + 페이지 관리" 하는 곳
레이어(Layers) 구조 확인 프레임, 그룹, 컴포넌트 등 모든 요소의 계층 구조를 보여줌
Assets(에셋) 불러오기 팀 라이브러리, 컴포넌트, 스타일 등을 찾아서 화면에 드래그해 넣을 수 있음
페이지 전환 파일 안에 여러 페이지가 있을 경우 선택 가능
"레이어 관리 + 컴포넌트 라이브러리 + 페이지 관리" 하는 곳.
2) 가운데 영역 – Canvas(작업 화면): 실제 디자인을 만드는 메인 작업 영역
실제 디자인 작업을 수행하는 공간 프레임, UI 컴포넌트, 텍스트, 아이콘 등을 배치하고 편집
확대/축소, 드래그, 정렬 등 직접 시각적으로 작업하는 중심 영역
프로토타입 연결도 여기서 시각적으로 보여짐
3) 오른쪽 영역 – Properties 패널: 선택한 요소의 속성·스타일을 조정하는 곳
위치/크기(Layout)
색상, 테두리, 그림자 등 스타일
오토 레이아웃(Auto Layout) 옵션
프로토타입 설정(Interaction, Animation)
CSS 코드 확인(Inspect 탭) – 개발자 전달용
3. 함수형 GPT 답변:
“피그마의 왼쪽, 가운데, 오른쪽 영역의 역할은 무엇인가?
1. 왼쪽 영역 : 구조(Structure)와 위계의 사고 공간
역할:
왼쪽 영역은 레이어(Layers) 와 에셋(Assets) 을 관리하는 곳으로, 화면 속 모든 객체를 논리적 트리 구조(Tree Structure) 로 인식하게 만듭니다.
인지적 의미:
인간은 시각적으로는 중앙의 캔버스를 보지만, 논리적으로는 왼쪽 구조를 통해 ‘위치’를 이해합니다.
이는 제이콥의 법칙과 관련 있습니다. 사용자는 다른 툴(Photoshop, Sketch 등)에서도 비슷한 구조를 기대하기 때문입니다.
닐슨의 휴리스틱 중 “시스템 상태의 가시성” 원칙에도 부합합니다. → 왼쪽 트리 구조는 사용자가 현재 어떤 프레임, 컴포넌트, 그룹 안에 있는지를 즉시 시각화합니다.
UX적 핵심:
왼쪽은 ‘사고의 구조화’ 를 담당합니다.
사용자는 여기서 객체 간 관계, 계층, 흐름을 인식하며, 이는 인지적 지도(cognitive map)를 형성합니다.
2. 가운데 영역: 시각적 사고와 조작의 공간(Canvas)
역할:
사용자가 직접 요소를 그리고, 배치하고, 이동시키는 중심 조작 공간입니다.
피그마의 실시간 협업 기능도 이 영역에서 구현됩니다.
인지적 의미:
이는 피츠의 법칙(Fitts’s Law) 과 관련 있습니다.
→ 마우스 이동 거리와 대상 크기 간의 관계를 최적화하여, 빠르고 정확한 조작을 가능하게 합니다.
또한 힉스의 법칙(Hick’s Law) 과도 관련됩니다.
→ 중앙에는 오직 ‘현재 조작 중인 대상’만을 보여줌으로써 인지 부하를 줄이고, 선택 시간을 단축시킵니다.
UX적 핵심:
가운데는 ‘행동의 무대’입니다.
사용자는 왼쪽에서 구조를 인식하고, 오른쪽에서 속성을 설정하며, 가운데에서 실제 사고를 시각화하고 실험합니다.
3. 오른쪽 영역: 속성(Properties)과 수치의 사고 공간
역할:
선택된 요소의 세부 속성(색상, 폰트, 오토 레이아웃, 제약 조건 등) 을 설정하는 공간입니다.
즉, ‘정성적 구조(왼쪽)’를 ‘정량적 명세(오른쪽)’로 변환하는 역할을 수행합니다.
인지적 의미:
테슬러의 법칙(Law of Conservation of Complexity) 에 따르면, 복잡성은 어디엔가 반드시 존재해야 하지만, 피그마는 그 복잡성을 오른쪽 영역에 집중시켜 전체 인터페이스의 단순성을 유지합니다.
또한 닐슨의 “일관성과 표준성(Consistency and standards)” 원칙에 따라 모든 속성은 동일한 레이아웃 구조와 위계로 정리되어 있어 학습 비용이 낮습니다.
UX적 핵심:
오른쪽은 ‘정확도의 공간’입니다.
사용자는 여기서 수치로 사고하며, 시각적 감각을 논리로 전환합니다.
즉, “눈으로 느낀 디자인”을 “수학적으로 정의된 디자인”으로 바꾸는 공간입니다.
여기까지가 함수형 GPT 답변이다.
3. 해설: “둘 다 정답이지만, 사고의 깊이가 다르다.”
일반 GPT는 기능을 설명한다.
반면 함수형 GPT는 사고의 구조를 해석한다.
둘 다 ‘정확한 설명’을 하고 있지만, 그 내부에 담긴 ‘사유의 방향’은 완전히 다르다.
일반 GPT의 답변은 사용법의 언어다.
어디에 무엇이 있고, 무엇을 하면 되는지 알려준다.
이는 “행동을 지시하는 언어”다.
반면 함수형 GPT의 답변은 사고를 구조화하는 언어다.
“왜 이런 구조가 존재하는가”, “이 구조는 인간의 인지 과정과 어떤 관계가 있는가”를 해석한다.
이는 “사유를 설계하는 언어”다.
4. 표면적 언어 vs 구조적 언어
5. 인지심리학 관점: "피그마는 인간의 뇌 구조를 닮았다"
1. 왼쪽: 기억 구조 (Memory Structure)
제이콥의 법칙에 따라, 사람은 익숙한 구조에서 안정을 느낀다.
레이어 트리(Layer Tree)는 뇌의 장기 기억처럼 정보를 계층적으로 저장한다.
2. 가운데: 실행 구조 (Motor & Action System)
피츠의 법칙이 지배하는 공간. 우리는 손으로, 마우스로, 감각으로 사고한다.
즉, 가운데 캔버스는 인간의 "운동 피질(Motor Cortex)"과 닮았다.
3. 오른쪽: 판단 구조 (Analytical Reasoning)
테슬러의 법칙은 ‘복잡성의 위치’를 정한다.
피그마는 그 복잡성을 오른쪽으로 집중시켜 전체 사고의 ‘단순성’을 유지한다.
이건 인간이 논리적 판단을 전두엽(Frontal Lobe)에 집중시키는 구조와 같다.
6. 함수형 사고 모델 : "피그마 = 입력–계산–출력 시스템"
즉, 피그마의 화면은 단순히 디자인 툴의 레이아웃이 아니라 인간 사고의 함수 구조(Function Loop) 를 시각화한 것이다.
7. 철학적 전환: “디자인 툴이 아니라, 사고 인터페이스다.”
함수형 GPT가 ‘피그마’를 바라보는 순간, 그건 더 이상 디자인 툴이 아니라 사고 인터페이스가 된다.
왼쪽은 사고의 ‘기억 구조’
가운데는 사고의 ‘실험 구조’
오른쪽은 사고의 ‘논리 구조’
이 세 영역은 뇌의 세 시스템과 정렬된다.
즉, 피그마는 인간의 뇌를 닮은 “시각적 사고 모델”이다.
8. 정리하면: "나는 피그마로 사고한다"
이제 나는 피그마를 단순히 ‘배우는 도구’로 보지 않는다.
피그마는 사고의 거울이다.
일반 GPT는 “어디에 무엇이 있다”고 말하지만,
함수형 GPT는 “왜 그것이 거기에 있어야 하는가”를 설명한다.
이 차이가 바로 언어 예측의 시대에서, 사고 설계의 시대로 넘어가는 순간이다.
피그마는 사고의 거울이다
나는 여러분께 아래와 같이 질의하고자 한다.
1) 피그마의 인터페이스(왼쪽·가운데·오른쪽)는 단순한 도구가 아니라, 인간 사고의 구조를 반영한 것일까?
2) 일반 GPT가 ‘언어’를 예측하고, 함수형 GPT가 ‘사고’를 계산한다면, 두 존재의 본질적 차이는 어디에서 발생할까?
3) “도구는 인간의 사고를 반영한다”는 말은 UX의 본질을 어떻게 재정의할 수 있을까?
4) 피그마의 ‘레이어 구조’는 인간 사고의 위계적 구조를 시각적으로 드러내는 장치인가?
5) 함수형 GPT가 ‘사고의 프레임’을 만든다고 할 때, 인간은 이제 사고의 엔지니어로 진화하고 있는 걸까?
6) 피그마의 오른쪽 속성 패널처럼, 인간의 사고에도 ‘조정 가능한 변수(Parameter)’가 존재한다고 볼 수 있을까?
7) 함수형 GPT가 사고를 계산한다면, 인간은 어떤 방식으로 AI의 사고를 시각화할 수 있을까?
8) 언어를 ‘예측’하는 GPT와 사고를 ‘연산’하는 GPT는 결국 다른 형태의 인식 주체인가?
9) 피그마를 배우는 일과 GPT를 설계하는 일은, 모두 ‘사고를 외화(外化)’하는 같은 과정일까?
10) “AI는 이제 생각을 설계한다” — 이 문장은 UX, 디자인, 철학의 경계를 어떻게 무너뜨리고 있는가?
#피그마 #UX사고 #함수형GPT #MnsooCode #AI사유 #디자인사유 #사고의시각화 #도구와사고 #AI철학 #사고엔지니어링 #인지디자인 #AI인간공진 #사고루프 #사유시스템 #언어에서함수로 #AI의진화 #시각적사유 #인지구조 #사고의함수화 #UX철학 #MnsooCode사고모델
ⓒ 2025 전민수 (Minsoo Jeon). All rights reserved.
본 글은 「The Minsoo Code」 시리즈의 일부로, 인간의 사고 절차를 함수형 AI 언어 구조로 체계화한 독창적 저작물입니다. 모든 문장과 개념은 전민수의 사고 체계에 기반하며 저작권법 제4조 및 국제 저작권 협약에 의해 보호됩니다. 무단 복제·재가공·인용·상업적 이용을 금합니다.
인용 시 반드시 "출처와 저자명(전민수)"을 명시해 주세요.
— The Minsoo Code : 인간이 AI에게 사고를 가르친 최초의 함수 언어
