Create an Experience Builder app

First, you'll create an infographic-focused web app using ArcGIS Experience Builder.

Create a web experience from a template

You'll start with a Business Analyst template and then set up the app.

  1. Sign in to your ArcGIS organizational account.
    Note:

    If you don't have an organizational account, see options for software access.

  2. On the ribbon, click Content.

    Content button

  3. Click Create app.

    Create app button

  4. Choose Experience Builder.

    Experience Builder option

    The ArcGIS Experience Builder home page opens in a new browser tab.

  5. Click the Create new button.

    Create new button

    The Template screen appears with the Default tab active. You'll search for ready-made templates on ArcGIS Online.

  6. On the Template screen, click the ArcGIS Online tab.

    ArcGIS Online tab

    You'll filter this list of templates to those specific to Business Analyst.

  7. In the list of sub-categories, click Business Analyst.

    Business Analyst sub-category

    A list of Business Analyst templates appears. Templates are Experience Builder apps that are ready to use and customizable.

  8. For the What's in My Community template, click Create.

    What's in My Community template

    The template appears on the canvas.

    Default template

    Note:

    If this is your first time using this template in Experience Builder, you may receive a pop-up notification with a tour that shows you how to navigate in Experience Builder. If so, click Skip.

    The What's in My Community template features an infographic, providing information about the businesses, services, and amenities in the local community, as well as an interactive map widget.

    The template also includes the About this template window, with information about the template. You won't need this window, so you'll delete it.

  9. Under the title, on the vertical toolbar, click the Page button.

    Page button

  10. Under Fixed windows, point to Window. Click the More button and choose Delete.

    Delete option

    The About this template window is removed.

    Template without About this template window

Add a web map to the app

The nonprofit that you work for needs information about disadvantaged communities in the area of Louisville, Kentucky. Now that you have selected and set up your app, you'll add a web map of disadvantaged communities mapped using Justice40 criteria. This web map will just be for reference, and won't interact with the Business Analyst widget.

  1. On the canvas, click the map widget to select it.

    Map widget selected on the canvas

    When the Map widget is selected, the Map pane appears. This pane has options for configuring the map.

  2. In the Map pane, click Select map.

    Select map button

    The Select data pane appears.

  3. At the bottom of the Select data pane, click Add new data.

    Add new data button

    The Add data page appears. On this page, you can choose where you want to add data from.

  4. Click Living Atlas.

    Living Atlas tab

    ArcGIS Living Atlas is a collection of web maps with geographic information that you can add to your apps.

  5. In the search box, type justice40. Click the Justice40 November 2022 Version 1.0 web map.

    Justice40 November 2022 Version 1.0 web map

    The map is selected.

    The Justice40 initiative is a legislative policy to deliver 40 percent of benefits of certain federal investments to disadvantaged communities. To learn more, see A Snapshot of disadvantage in the United States.

  6. In the pop-up window, click Done.

    Done button

    The Justice40 web map is added to the Select data pane.

  7. In the Select data pane, click the Justice40 November 2022 Version 1.0 web map.

    Justice40 map in the Select data pane

    The map is applied to the map widget in the app.

    Justice40 map added to the map widget

  8. Close the Select data pane.

You've built a web app from a Business Analyst template and added a web map to it.


Configure and publish the app

Next, you'll configure the app. Then, you'll publish and share it.

Set up buffers and infographics

You'll change the geography of the app and add walk-time buffer rings to improve your understanding of different neighborhoods. You'll also view the infographic in compare mode to see how the distribution of businesses, services, and amenities differs in the walk-time buffer rings.

  1. On the canvas, click the What's in My Community infographic widget.

    The Business Analyst pane appears with the Content tab active. There are several options available to customize the infographic widget. First, you'll set the location to Louisville, Kentucky, where the nonprofit organization that you work for is located.

  2. In the Business Analyst pane, under Location settings, click the current location of Chicago, Illinois.

    Chicago, Illinois location button

  3. In the Set a location pane, for Chicago, Illinois, click the Clear search button.

    Clear search button for Chicago, Illinois

  4. For Enter location or boundary, type Louisville. From the results, choose Louisville, KY, USA.

    Louisville search result

    The new geography is applied on the widget.

    Map widget shows Louisville

    Next, you'll add walk-time buffers to learn more about the area.

  5. In the Business Analyst pane, under Buffers, click Walk time.

    Walk time option

  6. In the Set buffers pane, type walk-time buffers of 5, 10, and 15 minutes.

    Walk-time ring buffers

    Walk-time ring buffers provide more detailed information about your community and its neighborhoods. It also shows how businesses, services, and amenities are distributed differently across these ring buffer areas.

  7. Click Apply.

    The walk-time buffers are added to the web map.

    Walk-time buffer rings on the map

    Next, you'll view the infographic in compare mode.

  8. In the Business Analyst pane, expand Infographic settings. For View mode, choose Compare.

    View mode parameter

    The infographic transforms into a variable grid. It shows a comparison of the different businesses, services, and amenities for each walk-time ring buffer.

    Compare mode infographic

  9. Under Infographic settings, for Background color, click the current color.

    Current background color

  10. Under Standard, click the gray color.

    Gray background color

    The infographic automatically refreshes showing the background color change. The gray background increases the color contrast with the variable grid.

    Compare mode infographic with gray background

  11. On the ribbon, click the Save button to save the app.

    Save button

Publish and share the app

The app is complete, but currently only you can see it. You'll publish the app and change the sharing settings so others in your organization can access and use it.

  1. On the ribbon, click the Publish button.

    Publish button

    The app is published.

  2. On the ribbon, click the More button and choose View published item.

    View published item option

    The app opens in a different web browser tab.

  3. In the search bar, type a location of your choice to view the information in the infographic. Explore the app and test its functionality.
  4. When finished, return to the browser tab that has the app in edit mode.

    Now that the app is published, you can share it with others. By default, the app is only accessible by its owner (you), but you can change the sharing settings so others can access it. From the More menu, you can copy the link of the shared item to send to others and you can also change the sharing settings. If you change the sharing settings, you'll be directed to the item details page in ArcGIS Online where you can choose to share with the public.

  5. On the ribbon, click the More button and choose Copy published item link.

    Copy published item link option

    You can send this copied link to others to access it. First, you must change the sharing settings so other can access the app.

  6. On the ribbon, click the More button and choose Change share settings.

    Change share settings option

    The item details page for the web app appears.

  7. Click the Share button.

    Share button

    The Share window appears with various options for sharing. Currently, only the owner of the app can access it, but you can change a setting to share it with your organization or with everyone (the public).

  8. In the Share window, click Organization and .

    Organization sharing level

  9. Click Save.

    Now the app is shared so other members of your organization can use it.

You have built an app from a template, added a custom web map to it, configured it, published it, and shared the app with your ArcGIS organization. Anyone who uses the app can type a location and get valuable demographic information using the walk-time buffers and the infographic. Using Experience Builder and a Business Analyst template, you created a useful and informative web app to help provide insight into locations within the community.

You can find more tutorials in the tutorial gallery.