책상 위에 루빅스 큐브 하나가 놓여 있다고 생각해 봅시다.
어떤 학생은 색을 맞추려 할 것입니다.
어떤 학생은 가장 빠른 공식을 검색할 것입니다.
또 어떤 학생은 큐브가 움직이는 순서를 그림으로 기록할지도 모릅니다.
그런데, 누군가는 조금 다른 질문을 던집니다.
이 큐브를 웹브라우저 안으로 옮기면 어떨까?
큐브를 투명하게 만들면 내부의 움직임이 보이지 않을까?
큐브의 각 조각에 글자를 넣으면 포스터가 될 수 있지 않을까?
다른 사람도 자유롭게 바꿀 수 있는 도구로 만들면 어떨까?
디자이너이자 개발자인 스튜어트 스미스(Stewart Smith)는 이런 질문을 실제 프로젝트로 옮겼습니다.
그 결과물이 바로 Rubik’s Cube Explorer 입니다.
이 작은 웹 실험은 세계적인 과학 전시의 체험 콘텐츠가 되었습니다. 전시의 로고와 서체에도 영향을 주었고, 마침내 구글 검색 첫 화면의 인터랙티브 두들로 발전했습니다.
더 놀라운 점은 이 모든 일이 거대한 계획에서 출발하지 않았다는 사실입니다.
시작은 직업도, 돈도, 뚜렷한 목표도 없던 어느 겨울날의 작은 호기심이었습니다.
1. 모든 것은 무료한 시간과 낡은 큐브에서 시작됐다
2009년 초, 스미스는 뉴욕의 작은 아파트에서 일거리를 찾고 있었습니다.
금융위기와 인쇄 산업의 침체가 겹치면서 디자이너가 구할 수 있는 일은 많지 않았습니다.
대신 뜻하지 않게 빈 시간이 늘어났습니다.
그때 그는 어린 시절 친구가 루빅스 큐브를 능숙하게 맞추던 모습을 떠올렸습니다.
집에 있던 큐브를 꺼내 들고 유튜브에서 풀이 영상을 찾아보기 시작했지요.
처음부터 잘했던 것은 아닙니다.
가장 기본적인 층별 풀이법을 익히는 데도 몇 주가 걸렸습니다.
그래도 계속 반복하자 손이 순서를 기억하기 시작했습니다.
마침내 영상을 보지 않고도 큐브를 맞출 수 있게 되었습니다.
큐브는 곧 단순한 장난감 이상의 존재가 되었습니다.
그는 지하철과 비행기, 작업실에서도 큐브를 만졌습니다.
복잡한 문제를 생각할 때면 한 손으로 큐브를 돌렸습니다.
현실의 문제는 좀처럼 깔끔하게 풀리지 않습니다.
하지만 큐브 안에서는 흐트러진 색을 다시 질서 있게 되돌릴 수 있었습니다.
혼란을 ‘해결할 수 있는 문제’로 바꾸는 경험이 그에게 작은 안정감을 준 셈입니다.
여기서 창의성의 첫 번째 단서를 찾을 수 있습니다.
창의성은 자신이 오래 관심을 두는 대상을 발견하는 데서 시작됩니다.
2. 혼자 풀지 말고, 먼저 찾아보세요
그해 스미스는 뉴욕대학교 대학원에서 데이터 시각화 수업을 맡았습니다.
그는 학생들에게 첫 과제로 조금 이상한 문제를 냈습니다.
다음 시간까지 루빅스 큐브를 푸는 방법을 설명해 오세요.
학생들에게 직접 큐브를 완성하라고 한 것은 아니었습니다.
이미 나와 있는 자료를 찾아보고, 핵심 원리를 이해한 다음, 다른 사람에게 설명할 수 있도록 정리해 오라는 과제였습니다.
학생들이 문제에 접근하는 방식은 제각각이었습니다.
어떤 학생은 풀이 영상을 찾았고, 어떤 학생은 설명서를 가져왔습니다.
몇몇은 실제로 큐브를 맞추는 법까지 익혀 왔습니다.
이 과제에는 분명한 교육적 의도가 있었습니다.
새로운 문제를 만날 때마다 모든 것을 처음부터 혼자 알아내려 하면 정작 중요한 목표에 도달하지 못할 수 있습니다.
좋은 자료와 기존 코드를 출발점으로 삼으면 남은 시간을 더 나은 설명과 새로운 응용에 쓸 수 있습니다.
물론 검색이 생각을 대신해 주는 것은 아닙니다.
제대로 검색하려면 먼저 자신이 무엇을 모르는지 알아야 합니다.
찾은 자료를 믿어도 되는지 판단하고, 그 내용을 자기 문제에 맞게 다시 구성하는 능력도 필요합니다.
그러므로 창의적인 학생은 필요한 지식을 찾아 배우고, 그것을 새로운 상황에 옮겨 쓸 수 있는 학생입니다.
3. 서로 상관없어 보이던 두 관심이 만나다
스미스의 관심은 한곳에만 머물지 않았습니다.
그는 루빅스 큐브를 좋아했고 그래픽 디자인을 공부했습니다.
코딩과 웹 기술에도 관심이 많았습니다.
처음에는 이 관심들이 서로 떨어져 있는 듯 보였습니다.
그러던 중 그는 구글 크리에이티브 랩에서 새로운 웹 기술을 실험하게 됩니다.
당시는 어도비 플래시가 쇠퇴하고 HTML5, CSS 3D, 자바스크립트 같은 웹 표준 기술이 주목받기 시작하던 때였습니다.
스미스는 한 가지 질문을 품었습니다.
플래시 없이 웹페이지의 요소를 입체적으로 움직일 수 있을까?
처음에는 잡지의 접힌 면처럼 화면이 움직이는 간단한 실험이었습니다.
그러나 CSS 3D의 가능성을 확인한 뒤에는 주말에도 작은 정육면체를 만들고 회전시키며 실험을 이어갔습니다.
그러던 어느 순간, 따로 움직이던 두 관심이 만났습니다.
‘웹에서 움직이는 정육면체’와 ‘내가 좋아하는 루빅스 큐브’를 합쳐 보면 어떨까?
그는 작은 정육면체 27개를 모아 3×3×3 큐브를 만들었습니다.
특정 조각들을 한꺼번에 묶어 회전시키고, 회전이 끝나면 다시 분리되도록 코드를 짰습니다.
키보드로 큐브의 면을 움직이는 기능도 넣었습니다.
이 주말 프로젝트의 첫 이름은 ‘Cuber’였습니다.
사람들은 흔히 창의성을 세상에 없던 것을 떠올리는 능력이라고 생각합니다.
그러나 실제 창작에서는 이미 가지고 있던 관심과 기술을 새롭게 조합하는 힘이 더 자주 작동합니다.
- 루빅스 큐브
- 그래픽 디자인
- 웹 기술
- 입체 공간
- 타이포그래피
- 교육적 설명
각각은 이미 존재하던 것이었습니다.
스미스의 독창성은 이 요소들이 만나는 지점을 발견한 데 있었습니다.
4. 옆길로 새는 실험도 창작의 일부다
큐브를 개발하던 중 스미스는 브라우저의 개발자 도구에서 숫자와 좌표가 실시간으로 변하는 모습을 발견했습니다.
대부분은 이를 디버깅에 필요한 정보로만 보았을 것입니다.
하지만 그는 움직이는 문자들을 바라보다가 또 다른 질문을 떠올렸습니다.
이 문자 변화 자체를 애니메이션으로 만들 수는 없을까?
그 질문에서 HTML 주석을 화면처럼 활용해 문자 그림을 움직이는 ‘Swimmies’라는 별도의 실험이 태어났습니다.
본래 목표였던 큐브와 직접 관련이 없는 옆길이었습니다.
하지만, 그 옆길에서 새로운 표현 방식과 기술적 아이디어가 나왔습니다.
교육 현장에서는 학생이 정답을 향해 곧장 나아가지 않으면 시간을 낭비한다고 생각하기 쉽습니다.
그러나 창작 과정의 우회가 언제나 실패나 산만함을 뜻하는 것은 아닙니다.
무언가를 관찰하다 새로운 질문이 생겼고, 그 질문을 짧은 실험으로 확인했다면 그 우회는 이미 값진 탐구입니다.
5. 우연히 ‘팀 에르뇌’에 합류하다
스미스가 월요일에 Cuber를 회사로 가져가 동료들에게 보여주자 뜻밖의 이야기가 돌아왔습니다.
구글 안에 루빅스 큐브의 발명가 에르뇌 루빅과 함께 국제 순회 전시를 준비하는 팀이 있다는 것이었습니다.
그 팀은 마침 웹에서 작동하는 디지털 큐브를 찾고 있었습니다.
스미스가 주말에 개인적으로 만든 실험이 실제 프로젝트에 꼭 필요한 조각과 맞아떨어진 것입니다.
그는 전시팀에 합류했고, Cuber를 하나의 작품이 아니라 여러 용도로 쓸 수 있는 소프트웨어 도구로 발전시키기 시작했습니다.
새 이름은 큐브의 발명가에게 경의를 표하는 ‘ERNO’였습니다.
구글 내부에는 이런 취지의 말이 있었다고 합니다.
위젯 하나를 만들지 말고, 위젯을 계속 만들 수 있는 공장을 만들어라.
스미스는 디지털 큐브 하나를 완성하는 데서 멈추지 않았습니다.
다른 창작자들이 색과 모양, 글자와 움직임을 바꾸어 자신만의 큐브를 만들 수 있도록 기반을 설계했습니다.
이 관점은 학생들의 프로젝트에도 적용할 수 있습니다.
- 문제 하나의 답만 쓰지 말고 다른 문제에도 적용할 수 있는 풀이 원리 만들기
- 발표 자료 한 장에서 끝내지 말고 다시 쓸 수 있는 템플릿 만들기
- 작품 하나만 완성하지 말고 친구가 이어서 발전시킬 수 있는 규칙 남기기
한 번 쓰고 사라지는 결과물보다 여러 사람이 다시 활용하고 발전시킬 수 있는 틀을 만드는 일이 더 높은 수준의 창작일 수 있습니다.
6. 좋은 창작물은 겉모습과 작동 원리를 함께 설계한다
ERNO를 만들면서 스미스는 큐브의 ‘상태’와 화면에 보이는 ‘모습’을 분리했습니다.
큐브가 어떤 순서로 회전했고 각 조각이 어디에 있는지는 내부 데이터가 관리합니다.
반면 큐브를 플라스틱처럼 보이게 할지, 유리처럼 투명하게 만들지, 철사 구조처럼 표현할지는 별도의 시각 체계가 담당합니다.
두 영역을 나누었기 때문에 같은 작동 원리를 유지하면서도 전혀 다른 모습의 큐브를 만들 수 있었습니다.
스미스는 복잡한 코드를 작은 기능 단위로 나누고, 미래의 자신과 다른 개발자가 알아볼 수 있도록 설명과 그림도 자세히 남겼습니다.
브라우저 콘솔에서 큐브의 상태를 확인하거나 특정 색을 가진 조각만 찾고, 모서리 조각만 둥글게 만드는 기능도 제공했습니다.
초기 소스 코드는 지금도 GitHub stewdio/Cuber-DEMO에서 확인할 수 있습니다.
설명할 수 없는 아이디어는 다른 사람에게 전달되기 어렵고, 기록되지 않은 창의성은 다음 창의성의 재료가 되기 어렵습니다.
7. 큐브를 해체하자 오히려 원리가 보였다
큐브의 조각을 중심·모서리·꼭짓점으로 나누어 볼 수 있고, 각 조각에 번호를 붙여 이동 경로를 추적할 수도 있습니다.
큐브를 투명하게 만들거나 조각 사이의 간격을 벌려 폭발하듯 펼쳐 보는 기능도 있습니다.
완성된 큐브만 바라보면 구조가 몹시 복잡해 보입니다.
하지만 구성 요소를 하나씩 떼어 살펴보면 변하지 않는 규칙이 드러납니다.
- 중심 조각은 움직여도 여전히 중심 조각입니다.
- 모서리 조각이 꼭짓점 조각으로 바뀌지는 않습니다.
- 각 조각이 이동할 수 있는 자리에는 일정한 제약이 있습니다.
- 복잡해 보이는 변화도 몇 가지 회전 규칙이 겹친 결과입니다.
문제를 해결할 때도 비슷합니다.
큰 문제를 통째로 바라보면 막막합니다.
그러나 구성 요소와 관계, 바뀌지 않는 조건을 나누어 보면 손댈 수 있는 문제로 바뀝니다.
8. 코딩 실험이 전시의 얼굴이 되다
디지털 큐브는 곧 미국 리버티 사이언스 센터의 국제 순회 전시 ‘Beyond Rubik’s Cube’에 쓰였습니다.
이 전시는 큐브를 단순한 장난감이 아니라 수학·공학·예술·음악·로봇·디자인으로 뻗어 나가는 창작 플랫폼으로 바라보았습니다.
학생과 가족이 직접 체험하면서 문제 해결과 기하학, 공학을 배울 수 있는 STEAM 전시였습니다.
스미스의 큐브는 관람객이 전시장 터치스크린에서 여러 디지털 큐브를 체험하도록 돕는 기반이 되었습니다.
그런데 더 흥미로운 변화는 전시의 시각 디자인에서 일어났습니다.
스미스는 실험 과정에서 큐브의 면에 굵은 글자를 넣은 포스터를 만들고 있었습니다.
큐브의 몸체를 직접 그리지 않고, 비스듬히 놓인 글자만으로 사람들이 큐브의 형태를 떠올리게 한 것입니다.
이 발상은 전시의 새 로고로 이어졌습니다.
큐브 그림과 제목을 따로 배치하는 대신 제목 자체가 큐브처럼 보이게 했습니다. 화면에는 큐브가 없지만 글자의 배열을 보는 순간 큐브가 느껴지는 디자인이었습니다.
전시를 위해 만든 ‘Rubik Mono One’ 서체도 훗날 구글 폰트 Rubik을 통해 무료로 공개되었습니다.
이후에는 굵기와 형태를 다양하게 갖춘 Rubik 서체군으로 확장됐습니다.
작은 코딩 실험이 소프트웨어에 머물지 않고 포스터와 로고, 서체와 전시 공간의 언어로 번져 나간 것입니다.
9. 구글을 떠난 뒤, 작품이 구글 첫 화면에 오르다
스미스는 프로젝트가 세상에 공개되기 전에 구글을 떠났습니다.
하지만 새로운 직장에 다니면서도 밤과 주말을 내어 남은 작업을 도왔습니다.
2014년 5월 19일, 마침내 인터랙티브 루빅스 큐브가 구글 검색 첫 화면의 두들로 공개되었습니다.
당시 구글은 이 프로젝트를 HTML5와 Three.js 등을 활용한 기술적으로 매우 야심 찬 두들이라고 소개했습니다.
같은 기술을 활용한 Chrome Cube Lab에서는 음악을 만드는 큐브, 사진을 넣는 큐브, 메시지를 전하는 큐브 등 여러 창작자의 변형 작품도 선보였습니다.
Bringing the Rubik’s Cube to the next generation of problem solvers
그날 스미스는 구글이 아닌 새로운 직장, 야후의 책상에 앉아 있었습니다.
그곳에서 자신의 작품이 구글 검색 화면에 등장하는 모습을 지켜보았습니다.
마지막 장면만 보면 화려한 성공담처럼 보입니다.
하지만 그곳까지 가는 길은 전혀 반듯하지 않았습니다.
실직과 독학, 수업 과제와 주말 실험, 동료의 도움과 우연한 만남, 미완성 기능과 퇴사 뒤의 추가 작업이 뒤섞여 있었습니다.
우리가 성공 사례에서 보는 것은 대개 마지막에 맞춰진 큐브입니다.
그러나 창의성은 그 전에 있었던 수많은 뒤틀림과 시행착오 속에서 만들어집니다.
10. 완성하지 못한 기능도 남아 있다
스미스는 실제 큐브를 카메라에 보여주면 디지털 큐브가 그 상태를 인식하고, 실물 큐브를 해결하는 순서를 안내해 주는 기능도 구상했습니다.
하지만 시간이 부족해 완성하지 못했습니다.
자동 풀이 기능 역시 윗면의 십자 모양을 맞추는 단계까지만 구현되었습니다.
그렇다고 미완성이 이 프로젝트의 가치를 떨어뜨리지는 않습니다.
오히려 다음 사람이 이어갈 질문을 남겼습니다.
- 카메라로 큐브의 상태를 정확히 읽을 수 있을까?
- 임의의 두 상태 사이에서 가장 효율적인 이동 경로를 찾을 수 있을까?
- 큐브를 교육·음악·미술과 어떻게 연결할 수 있을까?
- AI를 이용하면 개인별 큐브 학습 도우미를 만들 수 있을까?
좋은 프로젝트는 모든 질문에 답한 뒤 문을 닫지 않습니다.
더 좋은 질문을 남겨 두고 다음 사람을 안으로 초대합니다.
11. 큐브는 결국 우주를 생각하는 도구가 되었다
몇 년 뒤 스미스는 이론물리학자 브라이언 그린과 블랙홀, 홀로그램 원리에 관해 이야기를 나누었습니다.
3차원의 정보가 어떻게 2차원 표면에 손실 없이 기록될 수 있는지를 생각하던 그는 루빅스 큐브를 비유로 들었습니다.
처음 큐브를 보는 사람에게는 모든 색 조각이 어디로든 자유롭게 움직일 수 있는 것처럼 보입니다.
하지만 구조를 이해하면 가능한 상태가 매우 많을 뿐 무한하지는 않다는 사실을 알게 됩니다.
움직임에도 분명한 제약이 있습니다.
그렇다면 우주도 우리가 수학적으로 상상하는 것만큼 무한한 자유도를 지니지는 않았을지 모릅니다.
스미스는 큐브를 돌리며 이런 질문에 다가갔습니다.
어린 시절의 장난감이 웹 기술과 디자인을 거쳐 물리학적 사고를 돕는 비유로까지 확장된 것입니다.
창의적인 사람은 하나의 대상을 한 과목 안에 가두지 않습니다.
익숙한 대상을 다른 분야를 이해하는 사고 도구로 바꾸어 씁니다.
12. 배울 수 있는 창의성의 일곱 가지 원리
1. 좋아하는 것을 가볍게 여기지 않는다
장난감과 게임, 만화와 음악도 깊이 들여다보면 수학·과학·언어·예술을 잇는 탐구 주제가 됩니다.
2. 모르는 것은 찾아서 배운다
창의성은 기존 지식을 무시하는 능력이 아닙니다.
이미 알려진 지식을 빠르게 익히고, 새로운 목적에 맞게 다시 구성하는 힘입니다.
3. 서로 다른 관심을 연결한다
“큐브를 좋아한다”와 “웹 기술을 배운다”는 별개의 활동처럼 보입니다.
하지만 새로운 아이디어는 이런 관심들이 마주치는 자리에서 자주 태어납니다.
4. 작게 만들어 직접 시험한다
거대한 계획부터 세우기보다 주말 동안 움직이는 정육면체 하나를 만들어 보는 편이 낫습니다.
손에 잡히는 작은 결과물이 다음 질문을 불러옵니다.
5. 제약을 창작의 재료로 삼는다
스미스는 플래시를 쓰지 않고 일반 웹 요소와 CSS만으로 입체 큐브를 만들려 했습니다.
제약이 있었기에 더 독특한 해결법을 찾아야 했습니다.
6. 다른 사람이 이어 쓸 수 있게 만든다
설명과 기록, 소스 공개와 모듈화는 한 사람의 아이디어를 여러 사람이 함께 키우는 자산으로 바꿉니다.
7. 답보다 오래 남는 질문을 만든다
완성하지 못한 기능과 새롭게 떠오른 의문은 단순한 실패의 흔적이 아닙니다.
다음 탐구가 시작되는 입구입니다.
13. 창의성은 질문을 오래 돌려보는 힘이다
루빅스 큐브는 한 번 돌린다고 모든 색이 제자리를 찾지 않습니다.
한쪽을 맞추려면 다른 쪽을 잠시 흐트러뜨려야 할 때도 있습니다.
잘못 돌렸다면 되돌리고, 구조를 살펴본 뒤 다른 순서를 시도해야 합니다.
창의적인 공부도 이와 닮았습니다.
처음부터 완벽한 진로나 작품을 정할 필요는 없습니다.
자신이 좋아하는 것을 오래 관찰하고, 필요한 것을 배우고, 작은 실험을 시작하면 됩니다.
그 과정에서 다른 사람의 생각과 만나면 관심의 세계는 더 넓어집니다.
스미스의 프로젝트도 그렇게 시작되었습니다.
무료한 겨울날 손에 든 낡은 큐브는 웹 실험이 되었습니다.
웹 실험은 소프트웨어 도구가 되었고, 그 도구는 전시와 포스터, 서체와 구글 두들로 뻗어 나갔습니다.
마침내 큐브는 우주를 이해하기 위한 비유가 되었습니다.
에르뇌 루빅이 강조했던 생각처럼 때로는 답보다 질문이 더 중요합니다.
학생들에게 필요한 것도 ‘정답을 빨리 맞히는 창의성’만은 아닐 것입니다.
익숙한 것을 낯설게 바라보고, 서로 멀어 보이는 지식을 연결하며, 자신만의 질문을 작은 실험으로 바꾸는 힘.
그 힘이 한 사람의 사소한 관심을 세상과 연결합니다.
리드마스터 영어전문 국어논술 학원. 이후 이름은 리드마스터.
전화 010-3368-7873
경기도 부천시 옥길로 113 상림프라자 501호