[ProtoPie School] 음성 인터랙션 구현하기
40개 이상의 언어에 대한 음성 인터랙션을 구현해보세요.
▶ 이전 학습내용이 궁금하다면? 여기를 클릭!
▶ 어떤 내용을 배울지 한눈에 보고 싶다면? 여기를 클릭!
40개 이상의 언어에 대한 음성 인터랙션을 구현하는 방법에 대해 알아보세요.
디지털 어시스턴트 또는 차량용 핸즈프리 음성 인식 프로토타입 구현이 필요하신가요? 그렇다면 이번 아티클을 반드시 주목해주세요. ProtoPie의 뛰어난 기능 중 하나는 음성 인식을 사용한 인터랙션 구현 기능인데요. 음성은 기술과의 일상적인 인터랙션에서 보편화되었으며, 접근성 측면에서 매우 중요합니다.
이번 아티클에서는 멋진 보이스 인터랙션을 쉽고 빠르게 만드는 방법을 살펴보겠습니다.
필요한 사항
이번 아티클에서는 아래 샘플 Pie 파일을 사용하여 학습을 진행할 예정입니다.
학습할 내용
학습 목표
▶ Speak response를 사용하여 원하는 텍스트를 음성으로 인식하도록 구현하기
▶ Listen response를 사용하여 음성으로 입력된 내용을 들어보기
▶ Voice Command trigger를 사용하여 특정 단어 혹은 구절에 응답하도록 설정하기
완료 시간: ≤15분
1. ProtoPie 음성 인식 기능 구현하기
Studio에서 위에서 다운로드한 샘플 Pie를 엽니다. 인터랙션이 시작될 때 ProtoPie가 대화를 시작하도록 설정해 봅시다.
▶ 우선 Start trigger 를 추가하고, 그 후 Speak response을 추가합니다.
▶ 이제 화면에 있는 텍스트를 ProtoPie가 음성으로 인식하도록 구현해 보겠습니다. 'pieText 1'이라는 텍스트 레이어의 내용을 복사합니다.
위 텍스트를 Speak response의 속성 패널에 있는 "Content" 상자에 붙여넣으세요.음성 텍스트가 어떻게 인식되는지 미리 들어보면 좋겠죠. Voiced By 드롭다운 메뉴에서 남성 또는 여성 음성을 선택할 수 있습니다. 변경 후, 새 음성으로 말하는 텍스트의 미리 보기를 들어봅시다.
중요: ProtoPie는 문화적 포용성 및 접근성에 대해 깊은 관심을 가지고 있습니다. ProtoPie는 40개국 이상의 언어에 대한 음성 인식 서비스를 제공하므로, 현지화된 사용자 경험을 구현하거나, 시각 장애가 있는 사람들을 위한 인터랙션을 구현하기에 최적화된 디자인 툴입니다. Language 드롭다운을 클릭하면 아래와 같이 제공되는 언어의 리스트를 확인 할 수 있습니다.
Pie의 미리보기를 진행할 차례입니다. ProtoPie가 "Hi, I'm ProtoPie. What can I do for you today? (안녕하세요, 저는 ProtoPie입니다. 무엇을 도와드릴까요?)"라고 인사할 것입니다.
2. 음성 들어보기
이제 ProtoPie가 응답을 듣기 시작합니다. 마이크 아이콘을 탭하면 ProtoPie가 음성을 듣기 시작할 것입니다.
▶ 'mic_on' 레이어에 Tap trigger를 추가하고, Listen response를 추가합니다.
ProtoPie가 듣기를 시작하려면, 위 그림처럼 속성 패널에서 Start가 선택되어 있는지 확인해야 합니다.
기본적으로 ProtoPie는 사용자가 말하기를 마칠 때 듣기를 중지합니다. 그러나 Continuous 왼쪽 박스를 체크하면, 음성 명령이 일시 정지된 후에도 ProtoPie가 계속 음성을 인식하게 됩니다. 하지만 이번 예시에서는 음성 명령이 짧기 때문에, 해당 옵션은 선택하지 않고 넘어가겠습니다.
ProtoPie가 듣기를 시작하려면, 속성 패널에서 시작이 선택되어 있는지 확인해야 합니다.마이크 아이콘을 클릭할때 약간의 차이가 있음을 제외하면, 큰 변화가 없음을 확인할 수 있습니다.
Preview 상태 표시줄의 왼쪽 아래 모서리에 작은 깜박이는 마이크 아이콘이 보인다면, ProtoPie가 음성 인식 중임을 뜻하는 것입니다.
음성 인식이 중지되면 마이크 아이콘이 깜박이지 않는 것을 볼 수 있습니다.3. 음성 명령 추가하기
이제 본격적으로 음성 명령을 구현할 차례입니다. "텍스트 및 보이스 인터랙션을 만들 수 있나요?"와 같은 음성 프로토타이핑 기능에 대한 질문을 해보도록 하겠습니다.
▶ Voice Command trigger를 추가합니다.
▶ 이후 Trigger Point 제목 아래, 두 가지 옵션이 표시됩니다.
▶ While Speaking 기능은 음성 인식 중에도, ProtoPie가 단어나 구가 인식하는 즉시 응답하도록 지 시합니다.
▶ After Speaking 기능은 음성 인식을 다 마친 후 ProtoPie가 응답하도록 지시합니다.
이번 예시의 경우, 음성 인식이 멈춘 후 ProtoPie가 응답하도록 설정할 것이므로 After Speaking을 선택하겠습니다.
아래 이미지에서 보여지는 것처럼, Command 박스에서 인식할 텍스트를 입력할 수 있습니다. 전체 질문을 입력해도 되지만 필수 사항은 아닙니다. ProtoPie에서는 같은 의미를 가진 다양한 질문 옵션을 수용할 수 있는 유연성을 가지고 있기 때문입니다. 여기서 주목해야 하는 것은 'voice' 혹은 'speech'와 같은 단어입니다. 그래서 우리는 그 단어 중 하나에 응답하도록 이 trigger를 구성할 수 있도록 설정할 것입니다.
Trigger가 응답할 각 단어나 구를 별도의 줄에 입력합니다.Trigger가 작동할 때, 인식할 단어와 문구 목록에 'talk' 과 'spoken command'를 추가했습니다. 따라서 "Can you respond to a spoken command?" (음성 명령에 응답할 수 있나요?) 또는 "Can you hear me talk?" (내가 말하는 것이 들리나요?)와 같은 질문을 인식할 수 있습니다.
이제 trigger를 설정했으니, ProtoPie가 명령을 인식할 때 실행할 응답을 추가해 보겠습니다.
▶ ProtoPie가 음성으로 응답하도록 설정해 봅시다. Speak 응답을 추가하고 다음 텍스트로 구성합니다.
Certainly! I can create realistic voice interactions based on either reading the text you input or by responding to incoming speech. Need I say more? I'm a prototyping genius! Ha ha ha!
(그럼요! 저는 입력한 텍스트를 읽거나 저한테 말씀주시는 메세지를 기반으로 현실적인 보이스 인터랙션을 구현할 수 있답니다. 이미 아시겠지만 저는 프로토타이핑 천재랍니다. 하하하!)
▶ 모든 것이 일관성있게 들리도록, 1단계에서 했던 것과 동일한 음성을 선택하세요.
▶ 또한 ProtoPie의 음성 응답과 동시에 화면에 텍스트가 보이도록 설정해 봅시다. Text response를 추가합니다. pieText 1 레이어를 선택하고, 위와 동일한 텍스트로 업데이트하세요.
지금까지 설정한 내용을 확인할 차례입니다. 당신의 인터랙션은 ProtoPie가 인사하는 것으로 시작됩니다. 마이크 아이콘을 클릭하고 질문 합니다. 'voice'혹은 'speech'와 관련된 아무 질문이나 물어보세요. Voice Command trigger에 지정한 단어나 구 중 하나 이상이 질문에 포함되어 있으면 ProtoPie는 응답할 것입니다.
4. 피드백 추가하기
반영된 인터랙션이 정확히 작동하는지 확인할 차례입니다. ProtoPie에는 $voiceTranscript 라는 미리 정의된 variable 을 통해, 음성을 인식하는 동안 말하는 모든 단어를 기록할 수 있습니다. 때문이 이 variable을 사용하여 음성 인식이 가능합니다.
▶ 다른 Voice Command trigger를 추가합니다. 동시에 하나 이상의 음성 명령을 활성화해도 괜찮습니다. 오히려 하나 이상의 음성 명령 활성하는 더 강력한 보이스 인터랙션을 만드는 데 중요한 부분입니다. 다양한 시나리오에 들어갈 별도의 Voice Command trigger를 만듭니다.
이번에는 말할 때 질문이 화면에 표시되도록 설정할 것이므로, While Speaking을 trigger point로 선택합니다.
또한 특정 명령을 인식하기보다는, 어떤 메세지를 말하더라도 해당 trigger가 작동하도록 만들어야 합니다. 이 경우 Command 옆 박스의 선택을 취소하면 됩니다.
▶ 이제 Text response를 추가하고, 'userTest 1'을 대상 레이어로 선택합니다 .
▶ Content 하단에서 Formula을 선택하고 아래 빈칸에 $voiceTranscript를 입력합니다.
설정이 잘 되었는지 확인해 봅시다. 마이크 아이콘을 클릭하고 메세지를 녹음하면 말하는 내용이 화면에 나타납니다.
누구든지 쉽게 생성할 수 있는 보이스 인터랙션
ProtoPie에서는 다양한 voice 기능을 사용하여 음성 인식 인터랙션을 쉽게 구현할 수 있습니다.
이번 레슨에서는, ProtoPie의 Speak 그리고 Listen response를 사용하여 음성 인식, 및 인식 내용을 텍스트 변환시키는 법을 배웠습니다.
또한, Voice Command trigger를 사용하여 특정 음성 단어와 구에 응답하도록 하는 방법을 배웠습니다.
마지막으로 미리 정의된 variable인 $voiceTranscript를 사용하여 인식한 내용을 정확히 인식하는 방법을 살펴 보았습니다.
마치기 전 하나 더!
ProtoPie의 voice 기능은 아직 베타 버전이므로, 일부 기능적인 제한이 있습니다. 예를 들어, Pie를 Cloud에 게시하면 Speak trigger가 웹 브라우저 미리 보기에서 작동하지 않습니다. 따라서 해당 트리거를 작동하려면 ProtoPie Studio 또는 ProtoPie Player 앱을 사용해야 합니다. 또한 음성 인식이 작동하려면 인터넷에 연결이 되어있어야 합니다. 여기를 클릭하여 자세한 내용을 확인해 보세요.
