Bixby Developer Center

Guides
References

핸즈프리 및 멀티 디바이스 디자인 가이드

이 가이드는 Bixby Views를 사용하여 디자인하기 가이드에 대한 확장 버전으로, 사용자가 Bixby 사용 시 경험할 수 있는 추가 모드를 소개하고 이러한 모드를 염두에 두고 가장 효과적으로 디자인하는 방법을 설명합니다.

핸즈프리 모드와 핸즈온 모드

Bixby는 두 가지 방법으로 호출할 수 있습니다.

Invoking Bixby

  • 핸즈프리 모드: 사용자가 "하이 빅스비"라고 말한 다음 질문이나 요청을 합니다. 사용자가 말을 마치면 마이크가 꺼지고 Bixby가 dialog를 마치면 사용자의 응답을 듣기 위해 마이크가 자동으로 켜집니다.
  • 핸즈온 모드: 사용자가 Bixby button을 누르거나 Bixby가 열린 상태에서 화면 왼쪽 하단의 Bixby 아이콘을 탭하여 질문이나 요청을 합니다. 사용자가 원래 요청에 대한 Bixby의 응답에 답하려면 반드시 Bixby button을 다시 길게 눌러야 합니다.

이때 Bixby는 사용하는 모드에 따라 응답하는 방식이 달라야 합니다.

  • 핸즈프리 모드에서 Bixby는 사용자가 화면을 보지 않고 음성으로만 대화할 것으로 가정하고 동작합니다. 이 경우 화면과 관련 Bixby Views는 최소한으로 사용되며 Bixby가 말하는 dialog가 더 명확해야 합니다. $handsFree expression language 변수를 사용하여 사용자가 핸즈프리 모드를 사용하고 있는지 여부를 확인하고 그에 따라 view를 변경할 수 있습니다.
  • 핸즈온 모드에서 Bixby는 사용자가 화면을 보고 화면과 인터랙션할 것으로 가정하고 동작합니다. 이 경우 Bixby가 말하는 dialog가 최소화되고, 화면과 Bixby Views는 필요에 따라 터치 탐색 또는 button을 사용하여 더 정확하고 풍부한 정보를 보여주어야 합니다.

핸즈프리 모드와 핸즈온 모드 비교

우주 리조트(Space Resorts) 샘플 캡슐을 사용해 핸즈프리 모드와 핸즈온 모드를 비교해보겠습니다. 이 샘플 캡슐에서 사용자는 여러 행성의 호텔 객실을 예약할 수 있습니다. 여러분만의 캡슐을 직접 디자인하기 전에 이 예제를 케이스 스터디 삼아 따라해 보세요.

핸즈프리 모드의 컨버세이션(conversation) 플로우

사용자가 Bixby를 사용하여 특정 우주 리조트 객실을 검색하고 예약하는 일반적인 컨버세이션(conversation) 플로우를 살펴보겠습니다. 먼저 사용자가 호출 어구를 말해 Bixby를 호출한 뒤, 요청을 합니다. Bixby는 결과를 반환하면서 추천 리조트를 제안합니다. 사용자가 이 리조트를 선택하고 이에 따라 Bixby가 계속해서 예약 절차를 진행합니다. 잠시 후 Bixby는 사용자에게 예약을 최종 확인할 것을 요청합니다. 사용자가 예약을 확인한다는 말을 하고, 이에 Bixby는 예약이 완료되었음을 알립니다!

Note

핸즈프리 모드에서는 사용자가 선택 가능한 옵션을 들을 수 있도록 결과가 dialog에 포함됩니다.

먼저 사용자가 Bixby를 호출합니다.

하이 빅스비!

그러면 Bixby가 호출됩니다.

Invoking Bixby, hef

2020년 11월 30일에 은하계에서 제일 좋은 우주 리조트 객실을 2박 3일 예약하고 싶어.

Bixby가 요청을 처리합니다.

Bixby processing, hef

잠시 후 Bixby가 다중 결과를 반환합니다.

Bixby의 응답: 2020년 11월 30일에 은하계에서 예약 가능한 리조트 8개를 찾았어요. 평점이 가장 좋은 리조트는 Venus Space Spa로, 별점 4.7점을 받았고 약 2억 6,000만 킬로미터 거리에 있어요. 이것을 선택할까요?

화면에 표시되는 내용: 2020년 11월 30일에 은하계에서 예약 가능한 리조트 8개를 찾았어요. 이것을 선택할까요?

Bixby results hef

사용자가 Bixby의 질문에 답합니다.

그러면 Bixby는 이렇게 응답합니다. 좋아요. 2020년 11월 30일부터 12월 2일까지 Venus Space Spa를 예약할게요. 총 결제액은 500 갤럭시 코인입니다. 지금 예약할까요?

화면에는 확인 프롬프트가 나타나고 여기에 지금 예약할까요? 라는 텍스트가 표시됩니다.

Bixby confirmation hef

사용자가 구두로 확인을 합니다.

그러면 Bixby가 예약을 진행하고 사용자에게 예약 완료를 알립니다. 예약을 완료했어요! 곧 예약 확인 이메일을 발송할게요. 화면 내용도 이 dialog와 일치합니다.

Bixby receipt hef

이것으로 핸즈프리 모드의 컨버세이션(conversation) 플로우가 종료됩니다.

핸즈온 모드의 컨버세이션(conversation) 플로우

핸즈온 모드와 핸즈프리 모드가 어떻게 차이가 있는지를 알아보기 위해 이번에는 핸즈온 모드 플로우를 살펴보겠습니다.

먼저 사용자가 Bixby button을 눌러 Bixby를 호출합니다. 그런 다음 요청을 합니다.

2020년 11월 30일에 은하계에서 제일 좋은 우주 리조트 객실을 2박 3일 예약하고 싶어.

Bixby는 이렇게 응답합니다. 2020년 11월 30일에 은하계에서 예약 가능한 리조트 8개를 찾았어요.

Bixby Views에는 목록 view가 사용된 Result Moment가 표시됩니다.

Bixby normal mode, results list

사용자가 목록에서 첫 번째 카드를 탭합니다.

Bixby는 Result Moment의 세부 정보 view를 표시하여 응답합니다. 그러나 음성 dialog는 없습니다.

Bixby normal mode, results details

사용자는 결과 view 하단의 "Make reservation" conversation-driver를 탭할 수 있습니다.

Bixby가 예약을 확인할까요? 라고 물어보고 동시에 Bixby Views의 프롬프트 view에는 Confirmation Moment가 표시됩니다.

Bixby normal mode, confirmation

사용자가 화면 하단의 "Book" conversation-driver button을 탭하면 Bixby가 예약을 합니다.

Bixby가 예약을 완료했어요! 곧 예약 확인 이메일을 발송할게요. 라고 말하고, 화면에는 Result Moment의 receipt view가 표시됩니다.

이것으로 핸즈온 모드의 컨버세이션(conversation) 플로우가 종료됩니다.

4가지 유형의 핸즈프리 모드

핸즈프리 모드에는 크게 네 가지 유형이 있습니다. 이러한 모드를 구현하는 자세한 방법은 핸즈프리 목록 탐색 개발자 가이드를 참조하시기 바랍니다.

네 가지 모드는 다음과 같습니다.

  • Read One
  • Read a Few
  • Read All
  • Read None
Read One

핸즈프리 모드에서는 대개 사용자가 한 번에 많은 정보를 소화하기가 어렵습니다. 정보를 쉽게 소화할 수 있도록 하려면 read-one 키(key)로 Read One 모드를 사용하세요. 이 모드는 적절한 정보로 한 번에 한 가지 결과만 제시하는데, 사용자는 제시된 결과를 선택할지, 다음 결과를 들을지 결정할 수 있습니다. 사용자가 원하는 것을 선택하면 Bixby가 해당 항목에 대해 수행할 수 있는 action을 제시합니다. 이 경우 추가해야 하는 단계가 너무 많아질 수는 있겠지만 사용자 입장에서 복잡함이 줄어들게 됩니다. 이때 개발자 여러분은 사용자가 선택할 가능성이 가장 높은 결과가 먼저 제시되도록 정보를 정렬해야 합니다.

가까운 라멘 전문점 찾아줘

Bixby의 응답: 근처의 라멘 전문점을 찾았어요. 첫 번째는 돈코츠야입니다. 별점 4.2점을 받았고 약 1.6킬로미터 거리에 있어요. 여기로 선택할까요?

hef flow, read 1

  • 핸즈프리 모드에서는 Bixby Views에 각 옵션이 하나씩 렌더링되며, 사용자가 "다음"이라고 말하면 다음 옵션이 표시됩니다.
    hef screen, read 1

  • 핸즈온 모드에서는 Bixby가 각 옵션을 세로 목록으로 정렬된 카드로 표시합니다. 사용자는 스크롤하여 더 많은 옵션을 볼 수 있습니다.
    screen, read 1

Read a Few

Read a Few 모드에서는 read-many 키(key)를 지정하며, 여기서는 사용자가 이미 아는 정보에 대한 간단한 결정을 내립니다. 예를 들어 사용자가 어떤 번호로 전화를 걸지 이미 알고 있는 상태인데, 몇 가지 옵션 중에서 간단한 확인이 필요할 때가 있습니다.

Note

사용자에게 부담을 주지 않도록 한 번에 3~4가지 결과만 제시하는 것이 좋습니다. 이것은 read-manypage-size 자식 키(key)를 사용하여 지정합니다.

아내에게 전화해줘

Bixby의 응답: 아내 이름으로 세 개의 번호가 저장돼 있습니다. 사무실, 모바일, 집. 어떤 번호로 전화를 걸까요?

화면에 표시되는 dialog는 다음과 같습니다. 어떤 번호로 전화를 걸까요?

hef flow, read 3

read-many의 핸즈프리 모드에서는 목록에 가장 적절한 옵션을 표시해야 합니다. 예를 들어 연락처 목록에는 총 6개의 옵션이 있지만 Bixby는 통화 기록에서 최근에 가장 많이 통화한 3개의 번호를 선택합니다. highlights 키(key)를 사용하여 가장 적절한 옵션을 선택해 제시하세요.

hef screen, read 1

Read All

Read All 모드는 모든 정보를 온전하게 제시해야 의미를 갖는 경우에만 사용해야 합니다. 사용자가 여러 항목 중에서 결정을 하려고 하는 경우에는 이 모드를 사용하면 안 됩니다. 사용자가 한 번에 너무 많은 정보를 처리해야 하기 때문입니다.

알람을 삭제해줘

Bixby의 응답: 오전 7시, 오전 8시, 오전 8시 30분, 오전 9시, 오후 2시에 알람이 있습니다. 어떤 알람을 삭제할까요?

오전 7시

Bixby의 말: 오전 7시 알람을 삭제했습니다.

hef flow, read all

여기서는 read-many를 반환하는 결과 집합의 size() 즉, page-size (size(this))로 설정해야 합니다(이때 this는 반환하는 항목을 의미). 고유한 탐색 모드를 설정하지 않는 경우에는 view 파일에서 spoken-summary 키(key)를 설정하여 Bixby가 각 항목을 소리 내어 읽도록 만듭니다.

핸즈프리 모드에서 Bixby가 모든 옵션을 읽으므로 view가 핸즈온 모드와 동일합니다.

hef screen, read all

Read None

Read None 모드는 사용자가 일반적인 데이터 집합 중에서 답을 알고 있다고 확신하는 경우 사용합니다.

다음 주 Bixby의 응답: 무슨 요일인가요?

hef screen, read none

View의 탐색 모드에서 read-none 키(key)를 지정합니다.

핸즈프리 모드를 정의해야 하는 경우

Bixby는 차세대 대화형 비서 플랫폼이므로 핸즈프리 모드를 디자인하는 것은 필수입니다. 아래에는 다음 워크플로우에 따라 핸즈프리 모드를 정의하는 가장 효과적인 방법이 설명되어 있습니다.

Diagram

1단계: 비즈니스 goal 정의
  • 일반적으로 비즈니스 goal을 정의합니다. 자세한 내용은 디자인 가이드의 Bixby Views를 사용하여 디자인하기에서 확인할 수 있습니다.
  • 지원할 디바이스를 선택합니다. 이 중에서 기본적으로 사용할 디바이스를 이미 생각해 두었다 하더라도 선택한 모든 디바이스를 동시에 지원해야 합니다.
  • 비즈니스 goal을 토대로 메인 컨버세이션(conversation) 플로우를 생성합니다.
2단계: 메인 플로우 생성
  • 일반적으로 화면에 표시할 정보를 정의합니다.
  • Resultinput moment를 지정합니다.
  • 사용할 핸즈프리 목록 탐색 모드를 Read One, Read a Few, Read All 또는 Read None 중에 지정합니다.
3단계: Bixby의 dialog 작성

핸즈온 모드와 핸즈프리 모드를 위한 dialog를 작성합니다.

캡슐에 적합한 dialog를 작성하는 지침은 디자인 가이드의 Dialog 작성하기에서 확인할 수 있고, dialog를 구현하는 자세한 방법은 개발자 가이드의 Dialog 구체화하기에서 배울 수 있습니다.

4단계: 최적의 구성 요소 찾기

각 view에 가장 적합한 구성 요소를 선택합니다. 각 moment에 사용할 구성 요소에 대한 자세한 지침은 구성 요소 및 레이아웃 패턴에서 확인할 수 있습니다.

5단계: View 구현
  • Bixby Developer Studio를 사용하여 다양한 view, dialog 및 탐색 지원(필요한 경우)을 생성합니다.
  • 시뮬레이터에서 캡슐과 여러 가지 타겟을 모두 테스트합니다.
6단계: 성공적인 디자인을 위해 반복하기
  • 사용자 경험을 최적화할 수 있도록 각각의 디바이스 타겟에 지금까지 수행한 단계를 반복합니다.
  • 각 디바이스와 관련된 추가적인 처리가 필요할 경우 적절하게 추가합니다.

디바이스 간 이식성

사용자는 자신이 보유한 모든 Bixby 디바이스에서 여러분의 캡슐을 사용할 수 있기를 기대합니다. 따라서 여러분은 사용자가 모든 Bixby 디바이스에서 일관되면서도 적절한 환경을 경험할 수 있도록 해야 합니다. 이렇게 하면 디자인과 개발이 간소화되며 모든 디바이스에 대해 하나의 환경만 관리하면 됩니다. 여러분이 capsule.bxb 파일에 target을 추가할 경우에, 나중에 Samsung에서 새로운 디바이스가 출시되었을 때 해당 디바이스에서 캡슐이 바로 동작하게 됩니다.

Note

Bixby Views를 사용하면 다양한 디바이스에서 동작하는 디자인을 더 쉽게 빌드할 수 있습니다. 한 디바이스에 대해 빌드한 다음 구성 요소를 하나 선택하면 모든 디바이스에 해당 구성 요소가 매핑됩니다.

팁: 먼저 한 디바이스에 대해 빌드하고 시뮬레이터에서 view를 테스트한 다음, 다른 디바이스에서 조정하고 커스터마이즈할 부분이 있는지 확인하도록 하세요.

멀티 디바이스를 사용한 핸즈프리 및 핸즈온 모드

Bixby Views는 모드별로 다른 layout을 생성하지만 핸즈프리 모드와 핸즈온 모드에 사용되는 구성 요소는 같습니다. 모드에 따라 화면 layout이 해당 모드에 맞춰 변경될 수 있습니다. 또한 $handsFree expression language 변수를 사용하여 view를 전환할 수 있습니다.

우주 리조트를 예로 들어보겠습니다.

2020년 11월 30일에 은하계에서 제일 좋은 우주 리조트 객실을 2박 3일 예약하고 싶어.

모바일, 패밀리 허브(냉장고), 워치:

Bixby의 응답: 2020년 11월 30일에 은하계에서 예약 가능한 리조트 8개를 찾았어요. 평점이 가장 좋은 리조트는 Venus Space Spa로, 별점 4.7점을 받았고 약 2억 6,000만 킬로미터 거리에 있어요. 이것을 선택할까요?

Cross Device, View All

TV용 Farfield 모드:

TV용 Farfield 모드에서 Bixby는 사용자가 TV 화면을 보고 있는 상태로 "하이 빅스비"라고 말한다고 가정합니다. 따라서 사용자가 화면을 볼 수 있다고 판단해 결과를 소리 내어 읽지 않습니다.

TV, View All