Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to I add a link that punches out to a website?

Tags:

bixby

I know that typically we want to keep the interaction fully within the Bixby experience, but if I want to show very detailed non-assistant style information, it may be advantageous to offer a link that allows the user to see more at a given URL. I have seen this UX practice in capsules that come with Bixby on the Note9, such as Yelp (Bixby shows highlights of reviews, but to get the full list of all reviews, you can see more on Yelp), The Weather Channel, etc.

My question is what is the recommended way to put a "See more on SITE" link into a layout?

like image 725
Adam Cheyer Avatar asked Mar 13 '19 18:03

Adam Cheyer


1 Answers

The current recommended method would use the app-launch key available within result-view.

You would need to create the following:

  • A primitive (text) concept named Url

  • An Action named FetchUrl whose output is the url you would like to launch

  • A separate result-view where the app-launch key is defined. This is where your desired url will be launched from.

Your flow would be:

  1. Your capsule provides a result-view that displays a "See more on SITE" card (this can be any display element that contains an on-click).

  2. The "See more on SITE" card's on-click would contain an intent whose goal is your FetchUrl Action and whose value(s) is/are the relevant input(s) you need to return the url to be launched.

  3. Once the "See more on SITE" card is clicked by the user, the intent results in a Url output.

  4. Due to the match pattern, this triggers the result-view containing the app-launch key (example shown below). Since this result-view only contains the app-launch, nothing would be displayed and your desired Url will be launched on the user's default browser.

How to define app-launch within the result-view:

result-view {
  match: Url (this) {
    min(Required) max (One)
  }

  render {
    nothing
  }

  app-launch {
    payload-uri {
      template ("#{value(this)}")
    }
  }
}
like image 177
Ameya Avatar answered Nov 09 '22 04:11

Ameya