Voice Search for the rest of us

HTML5 규약에 음성인식이 추가된 것을 이제 와서 굳이 언급할 건 없겠지만, 그래도 데모 웹사이트를 본 이후 개인적으로는 처음, 이 HTML5 음성인식 태그를 실제로 적용시킨 웹사이트를 발견했다.

쿨럭... 뭐 애당초 자바스크립트를 penthousemag.com 소스를 분석해가며 배운 사람으로서 새삼스럽지만, 어쨋든 그닥 자랑할만한 웹사이트는 아니긴 하다. 그러고나서 대충 구글링해 보니 어느새 개인 블로그를 중심으로 음성인식 태그를 적용시킨 사례가 눈에 띄게 늘어나고 있는 듯하다.

... 그래서, 그냥 나도 해 봤다.

이 블로그를 구글의 크롬(Chrome) 브라우저나 크롬OS를 통해서 들어왔다면(구글이 현재로선 HTML 규약을 가장 발빠르게 적용하고 있기도 하고, 사실 브라우저 만드는 회사 중에서 흔치 않게 자체적인 음성인식 솔루션을 보유하고 있기 때문에 가능한 기능일게다), 본문 위 오른쪽의 검색 입력창에 마이크 아이콘이 나타나 있을 거다. 그걸 클릭하고 검색하고 싶은 단어를 "말하면" 된다. 노트북에 내장되었거나 헤드셋에 달려있는 마이크를 써야 하는 건 당연하겠고. 아무 언어나 그냥 자연스럽게 말하면 된다.

그냥 잘 된다. ㅡ_ㅡ;;;

다른 블로그에 나와있는 걸 보고 티스토리 블로그 형태에 맞춰서 적당히 수정했을 뿐인데, 그냥 바로 적용이 되어 버리는 걸 보고 내가 오히려 놀랐다. 10초만에 이 블로그 -- Voice UI에 대해서 기회가 될 때마다 징징거리는 -- 가 음성검색이 가능한 블로그가 되어 버렸다. 쿠헐. 쫌 허무할 정도다.

이제 인터넷에서 음성인식을 통해서 뭔가를 입력한다는 것은, 비록 Voice UI 자체의 제약조건 등은 여전히 유효하겠지만, 비교적 간단하고 당연한 일이 되어 버렸다. 위에 링크한 규약을 보면 단순한 음성검색 외에도 VUI의 기본적인 설계에 필요한 이런저런 내용이 정의되어 있어서, 화면에 표시되는 정보와의 공조라든가 음성안내(합성음 혹은 미리 녹음된 음성을 이용한)에 대한 내용까지도 포함되어 있다.

그동안 수많은 사람들이 힘겹게 힘겹게 물을 대서 말라죽지 않게 해왔던 음성 UI에, 이제 날개가 달린 셈이다. 과연 음성 사용자 인터페이스라는 것이 될성푸른 떡잎이었는지 아니면 애당초 글러먹은 쭉쩡이였는지 드러나는 순간이 드디어 오고야 말았다. 참으로 반갑고, 두려운 마음이다.

혹시나 참고가 될까해서... 티스토리 블로그에 음성검색을 부가하려면, 관리자 메뉴에서 스킨의 HTML 편집에 들어가서 아래 코드를 찾은 후 파란색 글자 부분을 추가하면 된다. 아직은 구글 Chrome에서만 검색이 된다는 점에 유의할 것.

<input type="text" name="##_search_name_##]" value="##_search_text_##]" onkeypress="if (event.keyCode == 13) { ##_search_onclick_submit_##] }" class="input" x-webkit-speech="" x-webkit-grammar="builtin:search" onwebkitspeechchange="##_search_onclick_submit_##]" />