--- title: "Create a Highlight" slug: "create-a-highlight" updated: 2026-08-06T15:35:43Z published: 2026-08-06T15:35:43Z canonical: "support.whatfix.com/create-a-highlight" --- > ## Documentation Index > Fetch the complete documentation index at: https://support.whatfix.com/llms.txt > Use this file to discover all available pages before exploring further. # Create a Highlight Highlights enable you to grab user attention and get the user to focus on an element while the rest of the screen is blacked out. Create and configure your Highlights using the following steps: - [Step 1: Create a Highlight project](/mobile/docs/create-a-highlight#create-highlight) - [Step 2: Capture your Mobile app screens](/mobile/docs/create-a-highlight#connect-capture) - [Step 3: Identify the screen](/mobile/docs/create-a-highlight#identify-screen) - [Step 4: Design the Highlight](/mobile/docs/create-a-highlight#design-highlight) ## Step 1: Create a Highlight project 1. On the Whatfix Mobile Dashboard, click the app in which you want to create your project. ![Mobile_Db_Select_App.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Mobile_Db_Select_App.png?sv=2026-02-06&spr=https&st=2026-10-29T16%3A21%3A29Z&se=2026-10-29T17%3A21%3A29Z&sr=c&sp=r&sig=iE2aszVYNH7WUS%2BWjBDeWHLdQktx5SzprkbtIPfTlKY%3D) 2. To create a new project, click **+ New**. ![Mobile_new_Project.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Mobile_new_Project.png?sv=2026-02-06&spr=https&st=2026-10-29T16%3A21%3A29Z&se=2026-10-29T17%3A21%3A29Z&sr=c&sp=r&sig=iE2aszVYNH7WUS%2BWjBDeWHLdQktx5SzprkbtIPfTlKY%3D) 1. Under the **Nudges** section, click **Highlight**. ![highlight.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/highlight.png?sv=2026-02-06&spr=https&st=2026-10-29T16%3A21%3A29Z&se=2026-10-29T17%3A21%3A29Z&sr=c&sp=r&sig=iE2aszVYNH7WUS%2BWjBDeWHLdQktx5SzprkbtIPfTlKY%3D) 1. Enter a name for your project. ![Mobile_New_Project_Name.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Mobile_New_Project_Name.png?sv=2026-02-06&spr=https&st=2026-10-29T16%3A21%3A29Z&se=2026-10-29T17%3A21%3A29Z&sr=c&sp=r&sig=iE2aszVYNH7WUS%2BWjBDeWHLdQktx5SzprkbtIPfTlKY%3D) 2. Enter the **App Version** or select the **App Version** using the dropdown. ![Mobile_app_version.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Mobile_app_version.png?sv=2026-02-06&spr=https&st=2026-10-29T16%3A21%3A29Z&se=2026-10-29T17%3A21%3A29Z&sr=c&sp=r&sig=iE2aszVYNH7WUS%2BWjBDeWHLdQktx5SzprkbtIPfTlKY%3D) Info: - Use the latest version of your app to create Whatfix Mobile content. For more information on app version, see [What is an App Version?](/mobile/docs/app-version) - Ensure that you add the correct app version from the app build that was integrated with the Whatfix Mobile SDK. 3. Click **Create**. ![Mobile_Click_Create.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Mobile_Click_Create.png?sv=2026-02-06&spr=https&st=2026-10-29T16%3A21%3A29Z&se=2026-10-29T17%3A21%3A29Z&sr=c&sp=r&sig=iE2aszVYNH7WUS%2BWjBDeWHLdQktx5SzprkbtIPfTlKY%3D) 1. Your Highlight project gets created, and you are redirected to the Whatfix Mobile Studio. ![wfxmobstud.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/wfxmobstud.png?sv=2026-02-06&spr=https&st=2026-10-29T16%3A21%3A29Z&se=2026-10-29T17%3A21%3A29Z&sr=c&sp=r&sig=iE2aszVYNH7WUS%2BWjBDeWHLdQktx5SzprkbtIPfTlKY%3D) --- ## Step 2: Capture your Mobile app screens Capture screens as a one-time step using the Whatfix Creator widget. The widget enables you to capture app screens as screenshots and saves them to your Whatfix Mobile Dashboard to create in-app guidance content. It also enables you to preview your projects and test them before publishing. For more information on how to capture and add app screens, see [Capture Mobile app screens](/mobile/docs/capture-your-app-screen-using-new-screen-capture-experience). Use the following steps to add a screen: 1. On the **Identify Screen** window, click **+ Add screen**. ![new_add_screen.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/new_add_screen.png?sv=2026-02-06&spr=https&st=2026-10-29T16%3A21%3A29Z&se=2026-10-29T17%3A21%3A29Z&sr=c&sp=r&sig=iE2aszVYNH7WUS%2BWjBDeWHLdQktx5SzprkbtIPfTlKY%3D) 2. Select the screen where you want to create the content and click **Add Screen**. ![select_screen_add_screen.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/select_screen_add_screen.png?sv=2026-02-06&spr=https&st=2026-10-29T16%3A21%3A29Z&se=2026-10-29T17%3A21%3A29Z&sr=c&sp=r&sig=iE2aszVYNH7WUS%2BWjBDeWHLdQktx5SzprkbtIPfTlKY%3D) ## Step 3: Identify the screen After capturing the screen, you need to identify the unique elements on the screen and tag the screen so that the in-app experience you create appears on the right page. 1. To identify the unique elements on the screen and to tag the right screen, click **+ Add Identifier**. ![Mobile_Add_Identifier.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Mobile_Add_Identifier.png?sv=2026-02-06&spr=https&st=2026-10-29T16%3A21%3A29Z&se=2026-10-29T17%3A21%3A29Z&sr=c&sp=r&sig=iE2aszVYNH7WUS%2BWjBDeWHLdQktx5SzprkbtIPfTlKY%3D) 2. Click the desired element on the page. ![Mobile_identifier_Home.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Mobile_identifier_Home.png?sv=2026-02-06&spr=https&st=2026-10-29T16%3A21%3A29Z&se=2026-10-29T17%3A21%3A29Z&sr=c&sp=r&sig=iE2aszVYNH7WUS%2BWjBDeWHLdQktx5SzprkbtIPfTlKY%3D) Example: If you want to show a Highlight on the Home screen, choose the title Home, which can uniquely identify the screen and show the Highlight on the correct screen.          Info           Click **Add More** to select more elements on the page, and then repeat step 2. ![add_more_identifier](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/add_more_identifier.png?sv=2026-02-06&spr=https&st=2026-10-29T16%3A21%3A29Z&se=2026-10-29T17%3A21%3A29Z&sr=c&sp=r&sig=iE2aszVYNH7WUS%2BWjBDeWHLdQktx5SzprkbtIPfTlKY%3D) ## Step 4: Design the Highlight You need to choose a template for your Highlight and select the element upon which you want to place the Highlight. Once the Highlight is set to appear on the element you want, you can design the Highlight as per your requirements. Use the following steps to design your Highlight: 1. On the Whatfix Mobile Studio, go to the left and select **Design**. ![element_design ](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/element_design%20.png?sv=2026-02-06&spr=https&st=2026-10-29T16%3A21%3A29Z&se=2026-10-29T17%3A21%3A29Z&sr=c&sp=r&sig=iE2aszVYNH7WUS%2BWjBDeWHLdQktx5SzprkbtIPfTlKY%3D) 2. Choose a template for your Highlight. ![choosetemplate.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/choosetemplate.png?sv=2026-02-06&spr=https&st=2026-10-29T16%3A21%3A29Z&se=2026-10-29T17%3A21%3A29Z&sr=c&sp=r&sig=iE2aszVYNH7WUS%2BWjBDeWHLdQktx5SzprkbtIPfTlKY%3D) 3. To target the element on which you want to place your Highlight, click **Identify Screen**. ![identify_screen](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/identify_screen.png?sv=2026-02-06&spr=https&st=2026-10-29T16%3A21%3A29Z&se=2026-10-29T17%3A21%3A29Z&sr=c&sp=r&sig=iE2aszVYNH7WUS%2BWjBDeWHLdQktx5SzprkbtIPfTlKY%3D) 4. Select the desired element on the screen. ![element_selection](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/element_selection.png?sv=2026-02-06&spr=https&st=2026-10-29T16%3A21%3A29Z&se=2026-10-29T17%3A21%3A29Z&sr=c&sp=r&sig=iE2aszVYNH7WUS%2BWjBDeWHLdQktx5SzprkbtIPfTlKY%3D) 5. Click **Confirm**. ![confirm_identifier](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/confirm_identifier.png?sv=2026-02-06&spr=https&st=2026-10-29T16%3A21%3A29Z&se=2026-10-29T17%3A21%3A29Z&sr=c&sp=r&sig=iE2aszVYNH7WUS%2BWjBDeWHLdQktx5SzprkbtIPfTlKY%3D)          Info           - The Highlight appears on the element you choose. ![screenchoose.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/screenchoose.png?sv=2026-02-06&spr=https&st=2026-10-29T16%3A21%3A29Z&se=2026-10-29T17%3A21%3A29Z&sr=c&sp=r&sig=iE2aszVYNH7WUS%2BWjBDeWHLdQktx5SzprkbtIPfTlKY%3D) - To place your Highlight elsewhere, click **Change**. 6. To add or generate the audio for the in-app experience in the language of your choice, go to the **LANGUAGE SUPPORT** section and then select the language using the dropdown. 7. Configure **AUTO DISMISS** if you want to dismiss an element automatically after an interval. You can also configure the **TRIGGER EVENT** and **ELEMENT TERMINATION** events. ![autodismiss.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/autodismiss.png?sv=2026-02-06&spr=https&st=2026-10-29T16%3A21%3A29Z&se=2026-10-29T17%3A21%3A29Z&sr=c&sp=r&sig=iE2aszVYNH7WUS%2BWjBDeWHLdQktx5SzprkbtIPfTlKY%3D)          Info           For more information on element trigger and termination conditions, see - [How to trigger an element to appear on the app screen?](/mobile/docs/how-to-trigger-an-element) - [How to terminate an element from appearing on the app screen?](/mobile/docs/how-to-make-an-element-stop-appearing-on-the-app-screen) The Highlight you create is automatically saved.          Note           To configure and customize the Body, Media, Buttons, etc. on your Highlight, see [Customize a Highlight](/mobile/docs/customize-a-highlight). Info - [Preview projects on a device](/mobile/docs/preview-projects-on-a-device) before making it live for your end users. - After creating and designing your Project, click **Publish** to make it live for your end users. For more information on publishing Whatfix Mobile content, see [Publish Whatfix Mobile content](https://support.whatfix.com/mobile/docs/publishing-whatfix-content).