Skip To Content

Make an app

You can add value to the map you made in the previous lesson by publishing it as a web app. A web app is a customized user interface that enhances your map's appearance, adds (or removes) functionality, and helps you integrate the map with other media. You can choose from several predefined configurable templates, or use Web AppBuilder for ArcGIS to design your own.

In this lesson, you'll publish your lava flow risk zone map in the Map Styler template. This web app allows you to choose color schemes, add descriptive text, and decide which map tools you want to make available to users. To create a web app, you'll need either an ArcGIS organizational account or a public account to save and share your map. You can sign up for a free trial account if you do not have one.

Save the map

You'll begin by saving your map. (If you already followed these steps to save your map earlier, skip to the next section.)

  1. If you do not have an account, sign up for a free ArcGIS trial account.
  2. Return to the browser window with your Hawaii map.
  3. On the ribbon, click the Save button and choose Save.
  4. If necessary, sign in to your ArcGIS account.
  5. In the Save Map window, type Hawaii Island Lava Flow Hazard Zones in the Title box.
  6. For the tags, type words that will help people find the map through searches. After each tag, press Enter.
  7. For the summary, type a brief description of the map's content.

    Save Map window

  8. Click Save Map.

    The map is saved to My Content, which you can access from the content page in the organization.

Edit item details

Next, you'll edit the information that describes your map (also known as its metadata). The metadata changes you make to your map will carry over to your web app. In particular, you'll edit your map's Description, which will allow users to learn about the map's content.

  1. In the upper left corner of the page, click Home and choose Content.

    On the My Content tab of the content page, the map is listed by its name and other details.

  2. Click the map title to view its item details.

    Map title in My Content

    The item page contains information about your map. From this page, you can also share the map, monitor map usage to gauge its popularity, and edit settings such as the map extent.

  3. On the item page, for Description, click Edit.

    You can also edit by clicking the blue text below the heading.

  4. In the Edit Description box, type (or copy and paste) the following text: The classification of lava flow hazard zones on the island of Hawaii was made by the United States Geological Survey in 1974. The risk levels are based on the location and frequency of historic eruptions.

    If you copy and paste the text, it may be formatted in the description box. You can remove the formatting by highlighting the text and clicking the Remove Format button on the Description toolbar.

  5. Click Save.

    Your map's item details are updated.

Save the shelters as a layer

The Emergency Shelters layer exists in your map but nowhere else. Nobody would be able to find it, for instance, by searching the organization's layers. By saving it as a layer to My Content, you can share it and add it to other maps. You'll be its owner, and the properties you give it will be its defaults. When someone else adds the layer to a map (assuming you share it), it will display with the symbology you chose.

  1. Near the top of the item page, click Open in Map Viewer.
  2. Open the properties for the Emergency Shelters layer and choose Save Layer at the bottom of the menu.

    This menu choice is only available for layers that you've created. You won't see it in the properties for other layers in this map. (If you're an administrator of the organization that owns the content, you'll also see this menu choice.)

  3. In the Create Item window, keep the title Emergency Shelters.
  4. Add a few tags that will help people find the map through searches. After each tag, press Enter.
  5. Add a summary of the layer's content.

    Create Item window

  6. Click Create Item.
  7. Save the map.
  8. In the upper left corner of the page, click Home and choose Content.

    Emergency Shelters layer

    The layer appears as an item in My Content.

Create a web app

Now, you'll create your web app. The first step is to share your map so others can see it.

  1. Open the map. On the ribbon above the map, click the Share button.

    Share button

  2. In the Share window, check the box to share the item with your organization—or, if you want, share it with everyone.

    Share window


    If you want to share the map through social media accounts such as Facebook or Twitter, share it with everyone.

    When you share the map, the Update Sharing window appears, which indicates that the Emergency Shelters layer that you own may not be visible to others because it is not shared in the same way as the map.

  3. Click Update Sharing to adjust the settings of the listed layer so it can be viewed in the web map.

    Now that the map is shared, you'll make the web app.

  4. In the Share window, click Create a Web App.

    Create a Web App button

    The Create a New Web App window appears, presenting a gallery view of the available templates. Some are designed for specific purposes; others are for general use.

    The templates are in alphabetical order. You can use the scroll bar to review the full gallery, or you can filter the templates by using the tabs on the left or the Search box at the top.

  5. On the left, click Showcase a Map.

    Filtered gallery of templates


    If your organization has configured custom galleries, you may not see these same configurable apps.

  6. Click the Map Styler template, and then click Create Web App.
  7. In the Create a New Web App window, accept the default title and tags.

    It won't be a problem that the web app has the same title as the map it's based on, because the two items are of different types.

  8. For the summary, type a brief description of the app.

    Create a New Web App window

    By default, the web app is given the same sharing properties as the web map.

  9. Click Done.

    The Configure window appears with a preview of the app.

    Configure window

Configure the app

You can change the web app's configurable properties using the tabs in the Configure window. Some of these properties, such as the title, theme, and text color, have default settings. In this section, you'll make changes to some of these settings.

  1. Click the General tab.

    By default, the web app title is the same as its source map.

  2. Leave the default setting for the title, or type a new title of your own.

    If you type a new title, it will display when users open the web app. The title of the web app item in My Content, however, will remain Hawaii Island Lava Flow Hazard Zones (the title you accepted when you published the web app in the last section).

    The About panel gives a short description of the map. This text comes from the item summary you created for the web map. You can override this text.

  3. Uncheck the Add item summary to the About panel box and copy and paste the following text into the About box:

    The boundaries and classification of lava flow hazard zones on Hawaii Island were first mapped by the U.S. Geological Survey in 1974. This classification scheme divides the island into 18 major zones that are ranked from 1 through 9 based on the probability of coverage by lava flows. The risk levels are based primarily on the location and frequency of historic eruptions (those for which there are written records or that are known from the oral traditions of the Hawaiians) and the geologic mapping and scientific dating of the old flows from prehistoric eruptions.

  4. In the About box, press Enter twice to add a blank line, and type (or copy and paste) Click a hazard zone or volcano to learn more.
  5. Highlight the sentence you just typed. On the toolbar at the top of the About box, click the Italic button to italicize the sentence. Click some white space to deselect the text.

    About box

  6. In the first line of text, highlight the word classification. On the toolbar, click the Create Link button.

    Create Link button

  7. In the Link Properties box, copy and paste into the URL text box. Click the arrow next to Target and choose New Window. Click Set.

    Link Properties

    This link will take the user to a United States Geological Survey page that describes the hazard zones in more detail.

  8. Click the Search tab.

    The purpose of your web app is to inform people about volcanoes and areas of lava flow risk. They probably don’t need to look for specific addresses or places on the map. You'll disable the search options.

  9. Uncheck the Enable ArcGIS World Geocoding Service box and the Find places box.
  10. Click the Theme tab. For Preset Colors, choose a theme color.

    Preset color

    You can choose any color. The theme color will be used as the background color for the web app title.

  11. Click Save.

    The preview of your configured web app updates to show your changes. The About panel takes up a lot of space on the map, and the legend is hidden. You'll change the layout so the legend appears when you first open the app.

  12. Click the Layout tab and select Legend as the startup panel.

    Legend selected for startup panel

  13. Click Save.

    Configured web app

  14. At the bottom of the Configure window, click Close.

    You're taken to the web app's item page.

Edit the app's item details

The item title, summary, and tags are already completed from when you created the web app. You still need to add a description and some other information.

  1. On the item page, next to Description, click Edit.
  2. In the Edit Description box, type a description of the web app, for example:

    Lava flow hazard zones for the island of Hawaii as defined by the U.S. Geological Survey. Volcanoes, emergency shelters, and major highways are also shown.

  3. Click Save.
  4. For Terms of Use, click Edit and type None. Public domain data and images. Click Save.
  5. In the lower right of the page, for Credits (Attribution), click Edit and type Hawaii State GIS Program; United States Geological Survey.
  6. Click Save.

    If you later decide to make changes to the way the web app is configured, open this item page and click Configure App.

View the app

  1. At the top of the item page, click the thumbnail image to open the application. (You can also click View Application.)
  2. Explore the app by navigating and opening pop-ups.

    Hazard zone pop-up

    The pop-ups behave the same in the web app as they do in the web map.

  3. Click the Default extent button to return to the original view of the map.

    Default extent button


    Any changes you make to the source web map, such as adding or removing layers, changing symbology, or configuring pop-ups, will be reflected automatically in the app. If you change the sharing properties of the map (or if you delete it), this will affect the app as well.

Make a thumbnail image

The last thing to do is replace the default generic thumbnail image in the item details with one that shows your app.

  1. Capture an image of the app with your image editing software.

    If you're not sure how to do that, capture the image with the Print Screen key (PrtScn) on your keyboard and paste it into the Windows Paint accessory. In Windows 7, you can open Paint from Start > All Programs > Accessories.

  2. Resize the image to a width of 600 pixels, but don't alter the aspect ratio.

    The ideal aspect ratio is 3:2. When the image width is 600 pixels, the height should be about 400 pixels. If your height value is substantially different, crop the image to avoid distortion in the thumbnail.

  3. Save the image in PNG file format to a folder on your computer.
  4. Return to the web app's item page.
  5. Above the default thumbnail image, click Edit Thumbnail.
  6. In the Upload Thumbnail window, click Choose File (or your browser's equivalent command). Browse to the folder where you saved the thumbnail and upload the image. Click OK.

    The new thumbnail image appears.

    App thumbnail image

You now know how to make a map, add layers to it, create your own layers from file-based data, configure pop-ups, and publish your map as a web app. What's next? You can try Analyze Volcano Shelter Access in Hawaii, which considers the accessibility of emergency shelters from populated areas on the island of Hawaii. You can learn how to publish map layers from ArcMap to ArcGIS Online in Homeless in the Badlands. If you'd like to delve deeper into web apps, try Get Started with Story Maps or Oso Mudslide - Before and After in which you'll create an app with Web AppBuilder.