김 용묵의 절대공간 - 블로그

오늘은 1980년대 후반부터 1990년대 중반 사이의 기간에 마소에서 '도움말, 튜토리얼, tour, intro, guide' 장르에 속하는 프로그램을 개발한 것들을 좀 회상하고자 한다.
요즘 튜토리얼이라 하면 컴퓨터 게임에서 본게임을 수행하기 전에 기본적인 조작법을 익히는 싱글 플레이어 미션 정도를 가리킨다. 툼 레이더로 치면 Lara's home이 대표적인 예이다.

하지만 1980년대에는 게임 정도가 아니라 컴퓨터라는 괴상한 기계 자체에 익숙하지 않은 사람이 아주 많았다. '컴맹'이라는 단어 기억하시는가? 1992년에만 해도 '키출판사'라는 곳에서는 <저는 컴퓨터를 하나도 모르는데요>라는 컴퓨터 입문서를 하나 잘 만들어서 전국 서점에서 베스트셀러 자리를 수 년간 석권하며 초대박을 쳤었다.
그런 시절엔 일반인들을 대상으로 컴퓨터에 대한 두려움을 없애고 컴퓨터 입문을 도와 주는 프로그램도 나올 필요가 있었다. 특정 프로그램의 사용법뿐만 아니라 키보드 타자 내지 심지어 마우스 같은 사치품(?)을 다루는 방법도 사용자가 익혀야 했다.

마소에서는 오래 전부터 뭔가 인터랙티브한 학습/데모 소프트웨어를 만드는 것에 남다른 신경을 썼던 것 같다. 그도 그럴 것이, 이거 학습을 잘 시켜야 컴퓨터 사용자를 늘리고 잠재적인 자기 고객도 확보할 수 있을 테니까 말이다.

그리고 사실은 방대한 운영체제나 Office 솔루션의 '설치 프로그램'도 단계별로 뭔가가 진행된다는 점에서 UI 구조가 반쯤은 이런 데모 프로그램과 비슷하다. 그러니 마소에서 1990년대에 '마법사'라는 UI 요소를 만들어 냈고 두 개념을 합쳐 '설치 마법사'라는 말까지 만든 것이지 싶다. (다만, 비슷한 시기에 도입했던 '길잡이 clippy'는 너무 과잉 오버 사족으로 여겨져서 오래 못 가고 망했다만..)

아무튼.. 마소에서 지극히 초창기에 만들었던 학습 프로그램의 원조로 본인은 QuickBasic 4.5에 들어있던 (1) QuickBasic express를 기억한다. 실행 파일은 learn.com이고, qbcbt.ctx/scn/sob, 그리고 bx.pgm이라고 내부 구조를 알기 어려운 코드/데이터 복합 보조 파일을 추가로 사용한다.
이들 파일들을 다 합해 봤자 크기는 100K가 채 되지 않으며, 압축된 것도 아니어서 얼추 내부 문자열 같은 건 그대로 확인 가능하다. 그래도 프로그램을 실행해 보면 저 작은 크기가 믿어지지 않을 정도로 학습 컨텐츠가 많이 들어있다.

화면은 16색 텍스트 모드에서 아스키 아트를 최대한 창의적으로 활용해서 화려하게 꾸몄다. 무려 열차를 그렸으며, 프로그램을 실제로 돌려 보면 연기가 뿜어져 나오고 기관차의 구동축이 움직이며 선로가 가로 스크롤을 하기 때문에 열차가 진짜 달리는 것처럼 보인다. 프로그램 이름에도 BASIC만 빼면 Quick, express 온통 이런 단어들이니 얼마나 스피디한 느낌이 나겠는가? 말 그대로 '퀵베이직 특급· 고속· 급행열차'인 셈이다.

물론, 아스키 128번 이후 문자를 이용한 아스키 아트는 2바이트 단위의 동아시아 문자 코드와는 상극이니 이런 프로그램은 한글화 따위는 절대 불가능했을 것이다. 아니면 아스키 아트들을 2바이트 특수문자 기반으로 완전히 마개조 재창조 초월번역을 해야 할 텐데, 일본은 몰라도 그 당시 한국 마소에서 그런 용자짓을 할 여유와 능력, 재량이 있었으리라 여겨지지는 않는다.

마소에서는 이런 부류의 프로그램에 대해 내부적으로 이미 CBT(computer-based training)이라는 용어를 쓰기 시작했다.
뭐 본격적으로 프로그래밍 언어를 가르치는 것도 아니고, 전적으로 컴맹 왕초보를 위해서 QuickBasic을 구동하고 프로그램을 불러오고 실행하는 것까지만 설명하는 튜토리얼을 상당한 덕력을 담아서 굉장한 고퀄로 만든 것이다.
화차 그림에 쓰인 주의사항 보이시는가? 아주 대단한 선심이라도 쓰는 듯 "주목: 이런 지식은 아무 데서나 알려주는 거 아니야!" 이런 드립까지 친다.

열기: "자, 디스크에 저장된 프로그램을 불러오는 걸 실습해 보시겠습니다."
저장: "짜잔~! 프로그램이 final.bas라는 이름으로 저장됐습니다."

문장들의 문체가 전반적으로 은근히 재치 있고 익살스럽기 때문에, 한국어의 사무적인 해요체 합쇼체로 번역하기에는 너무 무겁고 길이도 너무 길다.
저건 그야말로 디스크와 파일에 대한 개념도 아직 부족해서 하드디스크에 몇백 GB짜리 사진을 저장하면 컴퓨터의 무게가 물리적으로 증가할 것처럼 생각하는 왕초짜를 위한 설명이다..;; C언어라면 몰라도(저 때는 마소에서 아직 C++ 컴파일러를 개발하지 않았던 시절) 베이직만은 그야말로 왕초보라도 접근 가능한 대중적인 프로그래밍 툴로 만들려는 빌 게이츠의 야심이 담긴 것 같다.

다 끝나고 나면 이 프로그램이 가르쳐 준 lesson의 핵심 요약을 요렇게 쭉~~ 늘어놓아 준다. 잊어버릴까 봐 종이에다 프린트 명령까지 제공하는 배려를 했다.
사실, 영어권에서 뭔가 개념원리 학습 자료를 만들어 놓은 걸 보면 참 대단하고 부러움이 느껴질 때가 많다. 기본기를 탄탄하게 다지는 게 느껴지기 때문이다.

가령, 컴퓨터 쪽은 아니지만 무려 1930년대에 GM사에서 영업사원들(이미 기계공학을 전공한 엔지니어들 말고) 교육용으로 변속기의 원리를 설명해 놓은 필름을 보면.. 매체의 기술 수준 말고, 강의 자체는 기본적인 물리 법칙부터 시작해서 공학적인 응용에 이르기까지.. 지금 봐도 나무랄 데 없는 고퀄이다. 저렇게 기본기와 실용주의에 충실한 교육이 쌓이고 쌓인 덕분에 미국이 과학 기술 선진국이 된 게 아닌가 싶다.

다 끝나고 나면 다시 열차 그림과 함께 엔딩 화면이 나타나는데..
이번에는 시작 화면과는 달리 화차가 텅 비었고 아무 짐도 실려 있지 않다. 아하.. 이런 차이를 담았구나!!
난 그걸 전혀 눈치 채지 못했는데.. 이번에 스크린샷을 찍기 위해 프로그램을 오랜만에 다시 돌려 보면서 차이를 알게 됐다.

QuickBasic은 시대를 풍미했던 명작이고, 지금도 고전 레트로 레거시 프로그래밍 장난감으로서 외국에 매니아 커뮤니티가 있다.
그런데 QuickBasic의 인지도에 비해 이 자습서 프로그램은 존재감이 너무 묻히고 있는 것 같다. QuickBasic learn.com, Express 등 내가 생각하는 모든 관련 키워드들을 조합해서 검색해도 스크린샷 한 장 뜨는 게 없기 때문이다.

게다가 learn.com은 어찌 된 이유인지 도스박스에서 안 돌아가고 시스템이 뻗는다(0.72 기준). 이것 때문에 더욱 접근이 어려웠다. VMware 같은 다른 가상화 유틸에서 돌려야 했다.

QuickBasic 말고 자습서로서 가장 유명한 건 아마 (2) Windows 3.1의 자습서이지 싶다. '프로그램 관리자'의 도움말 메뉴에 당당히 등재돼 있기 때문에 쉽게 접근 가능하다. PC 환경의 판도를 도스에서 Windows로 완전히 뒤바꾸기 위해서는 사용자에게 기본적인 마우스 사용법을 가르치고 Windows의 기본 UI 요소들을 다루는 일에 익숙하게 하는 것이 반드시 필요했기 때문이다.

이 자습서야 검색을 해 보면 스크린샷과 동영상들이 이미 넘쳐나니 이곳에서 미주알고주알 자세히 설명할 필요는 없을 것이다.
이런 식으로 고해상도(?) 화면에서 16색+도트 노가다로 깔끔하게 파스텔톤 그림을 그려 놓은 화풍을 개인적으로 좋아했다. 문자 때문에 고해상도가 필요했던 일본 게임들의 그림체도 이런 형태이긴 했다.

'파일-열기' 명령을 내려서 기존 문서를 불러오는 실습은 QuickBasic 자습서와 Windows 자습서에 공통으로 존재한다.

그 밖에 창 제목을 마우스로 드래그 해서 창의 위치를 옮기는 것, 그리고 라디오· 체크· 콤보 등 기본 GUI 요소들을 실습하는 것도 있다.

사실은 (3) Windows 95에도 자습서가 있다.
1990년대 중후반은 컴퓨터의 기본 조작에 익숙하지 않은 세대에 대한 고려가 여전히 필요한 시기였으며, Windows 95가 3.1에 비해 UI 요소가 바뀐 것도 워낙 많았기 때문에 시작 메뉴, 작업 표시줄, 폴더 같은 것에 대한 학습이 필요했다. 이때는 Windows 95 사용 관련 컴퓨터 서적도 정말 많이 출간됐었다.

단, 95의 자습서는 모든 컴퓨터에 기본으로 깔리지 않았으며, 운영체제를 설치할 때 사용자가 수동으로 자습서를 직접 골라야 했다. 그리고 구동하는 방법도 내 기억으로 도움말 어딘가에 숨겨져 있었고 메뉴에서 바로 선택 가능하지 않았다. 그렇기 때문에 3.1의 자습서보다는 훨씬 덜 알려져 있다.

내 기억이 맞다면 95의 자습서는 Visual Basic으로 개발되었지 싶다. 외부 링크로 소개를 대신하고자 한다.
그 당시 Windows 95의 비주얼 컨셉은 푸른 창공, 하늘과 구름이었다. 제품 패키지 박스와 부팅 스플래시 화면부터가 그렇고, 이스터 에그에 내장되었던 음악도 clouds.mid였으니.. 그러니 자습서에도 경비행기 그림이 있는 게 수긍이 간다.

그리고 끝으로.. 이거야말로 정말 오래된 기억에만 의지해서 회상하는 것이지만..
MS Word 중에서 16비트 Windows를 지원하는 마지막 버전이었던 (4) 6.0 역시 자습서를 내장하고 있었다.
구체적으로 무슨 내용이었는지는 기억이 안 나지만... Windows 3.1 자습서와 같은 엔진 기반으로 추정되고 비슷한 톤의 흰색 계열 화면이었다. 하지만 Windows 자습서와는 분명 다른 내용이었고, 배경 그림에 그 당시 Word 특유의 만년필 그림이 있긴 했다.

이 역시 내가 구글링 능력이 부족해서인지, 아니면 진짜로 역사 속으로 묻혀 버려서 그런지 인터넷 상으로는 자습서의 장면이나 동영상을 구할 수 없다.
16비트 시절 회상은 이 정도까지 하겠다.
사실, 도스박스로도 Windows 3.1 정도는 돌릴 수 있다. 이것도 0.6x대의 구버전에서는 안 되다가 후대 버전에서 가능해진 것이다.

도스박스는 여느 가상화 툴처럼 디스크 이미지를 별도로 만들 필요 없이, 기존 파일 시스템의 디렉터리를 곧장 mount 해서 쓰면 되는 게 참 편하다.
Windows 95까지도 돌린다고는 하지만, 그 정도부터는 아무래도 하드웨어 가상화의 도움을 받는 VMware 같은 더 정교한 가상화 프로그램의 도움이 필요할 것이다.
도스박스에서 Windows 3.1을 설치하면 다 좋은데, 프로그램 그룹의 수집과 생성이 왜 자동으로 되지 않는지가 의문이다. 프로그램 관리자가 기본 프로그램, 보조 프로그램 같은 그룹이 아무것도 없는 채로 시작된다.

한편, Windows 95부터는 부팅 직후에 간단한 welcome 프로그램을 실행하던 관행이 있었다.

95 때는 '알고 계십니까' 팁을 출력했지만 98과 2000에서는 인터넷 연결, 제품 등록 같은 걸 안내하는 것으로 프로그램의 실행 형태가 바뀌었고, ME와 XP부터는 이런 게 없어졌다.
2000년대 ME/XP 시기에는 컴퓨터의 기본 사용법을 가르치는 클래식한 자습서는 사라졌지만, Windows의 새 기능을 소개하는 데모는 플래시 내지 HTA (HTML application) 형태로 잠시 존재했다.
특히 XP에 내장돼 있던 플래시 기반의 "새 기능 투어"는 굉장한 퀄리티였다. 비록 한글화되지 않았으며, 이런 관행 역시 Vista와 그 이후부터는 역사 속으로 사라졌지만 말이다.

그럼 이제 프로그래머의 직업병을 발휘하여, 이런 자습서 내지 튜토리얼 프로그램들을 만드는 과정은 어떠할까 생각해 보고 글을 맺겠다.
웹이나 플래시는 처음부터 멀티미디어 컨텐츠를 표시하는 데 최적화된 저작도구 내지 플랫폼이라 치지만, EXE 기반의 전통적인 데모 내지 자습서· CBT 프로그램은 어떤 방법론을 동원하여 만들었을까?

순차적인 절차대로 진행되는 프로그램을 이벤트 드리븐 방식으로 개조하는 건 만만찮은 작업이기 때문이다. 쉽게 말해 과거의 터보 C/파스칼에 존재하던 BGIDEMO 예제처럼 순차적으로 일괄적으로 그래픽 데모가 진행되는 프로그램을 Windows용으로 짜는 걸 생각해 보자. 간편하게 자기가 원하는 타이밍 때 그림을 그리고 마는 게 아니라, 운영체제로부터 그림을 그리라는 요청을 받았을 때에만 그림을 그려야 한다.

그러니, 지금은 어느 데모의 그래픽을 출력할 차례인지 내부적인 진행 상태를 추상화해서 잘 관리해야 한다. 그리고 애니메이션이나 끊임없는 그리기 작업은 스레드나 타이머 같은 완전히 다른 방법론을 동원해서 해야 한다.

더 세부적으로 들어가면.. 자습서 프로그램은 그 특성상 학습 대상 프로그램이 실행된 가상의 화면을 표시할 일이 많고 심지어 그 가상의 화면에서 사용자가 창을 조작하는 것을 흉내까지 내야 할 때가 있다.
모든 그림들을 무식하게 비트맵 이미지로 때려박는 건 공간 효율과 유지 보수(일부 컨텐츠가 수정되었을 때, 화면 해상도가 변경됐을 때 등) 관점에서 별로 좋지 못하다.

저런 건 진짜 윈도우를 생성한 뒤에 서브클래싱 같은 customization으로 내가 원하는 형태로만 동작하게 제약을 추가하는 식으로 구현할 수도 있고, 아니면 윈도우 그림만 가짜로 그린 뒤에, 창의 이동과 크기 조절, 메뉴 표시 같은 당장 학습에 필요한 이벤트에만 임기응변으로 반응하게 만들 수도 있다. Windows 자습서는 정황상 대부분의 UI는 후자 방식으로 구현된 것으로 보이지만.. 이건 좀 어설프고 삽질스러워 보이는 면모가 있다.

당신이 Visual Basic의 짝퉁 개발툴을 직접 개발한다고 생각해 보자. VB의 디자인 모드에서 떡 나타나 있는 폼의 '윈도우 프로시저'는 어떻게 구현되어 있을지가 궁금하지 않은가? 평소에는 클라이언트 영역에 일정 간격으로 격자 도트가 찍혀 있을 것이고, 자신의 위치나 크기가 바뀌면 폼의 정보가 수정된다. 자기에게 놓인 차일드 컨트롤을 클릭하면 크기 조절을 위한 8개 모서리가 주변에 표시되며, 이걸 더블 클릭하면 해당 컨트롤에 대한 이벤트 핸들러 코드를 편집하는 창이 뜬다.

자습서 창 내부에서 특정 윈도우의 외형과 동작을 구현하는 일도 이런 것과 비슷한 차원일 것이다. 어떤 물건이긴 한데, 실물이 아니라 뭔가 영화 촬영용 소품과 비슷한 격의 물건을 갖다놓는 격이 된다.
'짝퉁'을 만드는 식으로 접근하는 방법론이 한계에 달했는지, 나중에 마소에서는 실제 프로그램이 돌아가는 상태에서 그때 그때 도움말이 응용 프로그램으로부터 신호를 받아 인터랙티브한 형태로 출력되는 모델을 고안하게 되었다.

그래서 오죽했으면 윈도우 훅 중에서도 WH_CBT라는 게 있다. 어떤 프로그램이 내부에서 창을 생성하거나 없애고, 포커스가 바뀌고 창의 크기를 조절하는 것.. 자습서는 학습 대상 프로그램에서 요런 특정 동작만 감지하면서 상황에 맞는 도움말을 출력하거나 지시를 사용자에게 내릴 수 있다. 이런 간단한 용도라면 굳이 모든 메시지를 통째로 훔쳐보는 무거운 다른 훅을 설치할 필요 없이 저것만 사용하면 된다.

이런 훅을 사용한 아주 모범적인 사례가 있다. 바로 HTML 도움말인 CHM 말고, Windows XP까지 지원되었던 재래식 HLP 파일을 생성하는 (5) 오리지널 Help Workshop 툴을 보면.. 도움말 프로젝트를 생성하는 요령을 설명하는 traning card라는 자습서 세션이 있었다. 전용 자습서가 거창하게 뜨는 게 아니라, 화면 옆에 아주 자그마한 도움말 창만 추가로 뜬 뒤, 도움말이 시키는 대로 실제로 프로젝트를 만들고 프로그램을 사용하면서 기능을 익힐 수 있었다.

물론 지금이야 HLP 도움말 자체가 폐기되었으며, 이런 식의 도움말 디자인 패러다임 역시 완전히 한물 가고 역사 속으로 사라졌다는 것은 아쉬운 점이다. Help Workshop에 이런 간소화판 자습서 튜토리얼이 존재했다는 것도 오늘날 인터넷에서는 흔적을 거의 찾을 수 없다.

Posted by 사무엘