Adding Hints is a great way to teach users how to interact with your Lens. Common Hints include "Open Your Mouth", "Look Around", "Try Rear Camera" and more. A single hint can be easily added to a Lens by setting the Main Hint in the Project Info window. This is explained in the Lens Hints guide. This only works if you want to show a single hint at the beginning of the Lens. For more complex hint use (like multiple hints or showing a hint on trigger), you need to script the hint. This guide first walks through an importable helper script used for showing hints that's tuned in the Inspector panel. It then walks through how you can script Hints on your own for even more complex use cases. 

Adding the Hints Package

Add the Hints package to your project by following these steps. 

1. Download the Lens Hints package
2. Unzip the downloaded package
3. Open your project in Lens Studio
4. Drag and drop the Lens Hints [EDIT_ME].lso ( just downloaded ) into the Objects panel
5. You should see the Lens Hints [EDIT_ME] object appear in your Objects panel

Now you can add Hints to your Lens! 

Adding Hints

The Lens Hints package you just downloaded has two Hints added. In the Inspector panel, you will see two Script Components under the Lens Hints [EDIT_ME] Object. The ShowHints.js is bound to a specific Event. The Hint will be displayed when the event is called.

For example, in this case, "Open Your Mouth" will be displayed with user switches to the front camera.

You can add more Hints by adding a Script Component and selecting ShowHints.js in the Scripts folder in the Resources panel. Alternatively, you can also drag and drop the ShowHint.js from the Resources Panel to the Inspector Panel. 

Note
You will not see the actual Hint message in Lens Studio. The Hint will only appear when you preview your Lens on your device. For debugging hints in Lens Studio, a print statement like "Showing Hint: lens_hint_open_your_mouth" will be displayed in the Logger panel. 

Hint Settings 

The ShowHints.js script has a number of settings that can be configured in the Inspector panel. 

• Hint Id - The hint to show. A drop down of all available hints
• Show Time - The number of seconds that the hint message will be displayed
• Delay Time - The number of seconds to wait before showing the hint after the Event is triggered
• Show Once - If enabled, the hint will only show once. If not, the hint will be displayed every time the Event gets triggered

Note
Hints will continue to display when users are recording snaps. However, in the resulting Snap, the hint message will not be visible

 

Script Your Own Hints 

You can also script your own Hints directly instead of using the above package. For hints to work, you need to first create a Hints Component in Script.

var hintComponent = script.getSceneObject().createComponent( "Component.HintsComponent" );

You can control the Hints Component by using the methods showHint(hintID, showDuration) and hideHint(hintID). HintID is an ID that references a specific Hint string. Here is a list of supported HintIDs: 

lens_hint_aim_camera_at_the_sky
lens_hint_blow_a_kiss
lens_hint_blow_a_kiss_voice_changer
lens_hint_come_closer
lens_hint_do_not_smile
lens_hint_do_not_try_with_a_friend
lens_hint_draw_with_your_finger
lens_hint_find_face
lens_hint_find_image
lens_hint_find_marker
lens_hint_find_snapcode
lens_hint_kiss
lens_hint_kiss_again
lens_hint_look_around
lens_hint_look_down
lens_hint_look_left
lens_hint_look_right
lens_hint_look_up
lens_hint_make_some_noise
lens_hint_move_your_head
lens_hint_nod_your_head
lens_hint_now_kiss
lens_hint_now_open_your_mouth
lens_hint_now_raise_your_eyebrows
lens_hint_now_smile
lens_hint_open_your_mouth
lens_hint_open_your_mouth_again
lens_hint_open_your_mouth_voice_changer
lens_hint_pick_a_face
lens_hint_pick_a_photo
lens_hint_pick_an_image
lens_hint_raise_your_eyebrows
lens_hint_raise_your_eyebrows_again
lens_hint_raise_eyebrows_or_open_mouth
lens_hint_raise_your_eyebrows_voice_changer
lens_hint_rotate_your_phone
lens_hint_say_something
lens_hint_smile
lens_hint_smile_again
lens_hint_smile_voice_changer
lens_hint_swap_camera
lens_hint_tap_a_surface
lens_hint_tap_ground_to_place
lens_hint_tap_surface_to_place
lens_hint_tap_ground
lens_hint_tap
lens_hint_tilt_your_head
lens_hint_try_friend
lens_hint_try_rear_camera
lens_hint_turn_around
lens_hint_voice_changer
lens_hint_walk_through_the_door

Example of Scripting Hints: 

hintComponent.showHint("lens_hint_tap", 3);
hintComponent.hideHint("lens_hint_tap");