Do-It-Yourself Geo Apps MOOC

Exercise
Find Amenities in Denver, CO

Section 1 Exercise 1
07/2020
 Do-It-Yourself Geo Apps MOOC

Find Amenities in Denver, CO

Instructions
Use this guide and ArcGIS Online to reproduce the results of the exercise on your own.
Note: ArcGIS Online is a dynamic mapping platform. The version that you will be using for
this course may be slightly different from the screen shots you see in the course materials.

Time to complete
Approximately 25-45 minutes.

Technical note
To take advantage of the web-based technologies available in ArcGIS Online, use the
latest version of Google Chrome, Mozilla Firefox, Apple Safari, or Microsoft Edge. Other
browsers may not display your maps and apps correctly.

Introduction
In this exercise, you will build on the lectures from this section to make a web map and a web
app. You will add data to a web map using ArcGIS Online, configure a layer's pop-up window,
and publish a geo app that highlights amenities within a certain distance from a location using
a configurable app template.
There are three steps to building your web app. First, you start with the data, like any analysis.
The data must be online, in the form of feature layers (https://bit.ly/2kE916h). A hosted
feature layer is a collection of geographic data in the form of points, lines, or polygons that
support vector querying, visualization, and editing. Second, you add layers to make a
web map (https://bit.ly/1qERGr4). Hosted feature layers are powerful because you can add
them to one or more maps. Third, from the map, you create a web app
(https://bit.ly/2DP4PIh) for the best way to share the information. ArcGIS apps are an integral
part of a web GIS.

Copyright © 2020 Esri. All rights reserved. 1

 Do-It-Yourself Geo Apps MOOC

Throughout this exercise and the rest of the course, try to keep this workflow in mind. Also,
remember the three principles that Ian mentioned in his lecture: purpose, functionality, and
aesthetics. Lastly, think in terms of iterative development. DIY means that your apps may not
be perfect on your first try. Iterative development allows you to configure web maps and geo
apps the way you like. Make small changes, check the results, and then add more elements or
make additional changes. You will need to try different approaches in your web maps and
apps before you finally decide how you want to present information and how you want users
to interact with your map. We will show you one pathway to app creation in this exercise, but
we highly encourage you to experiment with new things along the way.

Step 1: Sign in to your course ArcGIS Online organizational account

This course uses ArcGIS Online, a web-based GIS platform. Every registered student receives
a user name and password to access ArcGIS Online during the course. Collectively, this user
name and password are known as your "course ArcGIS credentials." The first step of this
exercise explains where to find your course ArcGIS credentials and how to sign in for the first
time.

a On the black navigation bar in the MOOC platform, click the Lessons tab to locate your
credentials.

If you registered in the last few hours, your credentials may not be ready. You will see a
message asking you to check back later.
Note: You will need to refresh the web page to check whether your credentials are available.
We will do our best to provide your credentials within one business day after you register.
After you locate your course ArcGIS credentials on the Lessons tab, you may sign in to ArcGIS
Online for the first time.

b Open a new private or incognito browser window (https://bit.ly/2qTQdQL).

c Go to www.arcgis.com.

Copyright © 2020 Esri. All rights reserved. 2

 Do-It-Yourself Geo Apps MOOC

d Click Sign In.

e Under ArcGIS Login, copy and paste or type your course ArcGIS credentials (user name
and password).

Copyright © 2020 Esri. All rights reserved. 3

 Do-It-Yourself Geo Apps MOOC

f Click Sign In.

The first time you sign in you will be asked to set a security question. Follow the instructions
on-screen to set your security question.
Note: An automated email will be sent to the email address associated with the account,
telling you that your account was recently modified. No action is required.
After you set your security question, you will see the home page of the MOOC organization.

Note: ArcGIS Online is a dynamic mapping platform, so the organization's home page may
look slightly different from the graphic.
You will leave the private or incognito browser window open for the rest of the exercise.
However, if you plan to finish the exercise later, you may close the browser window now.
Each exercise will instruct you to open a new private or incognito browser window and sign in
to ArcGIS Online (or another website) with your course ArcGIS credentials.
You will use your course ArcGIS credentials to access ArcGIS Online only. If you or your
computer accidentally uses your course ArcGIS credentials to sign in to an Esri.com website,
you may see the following message: "Your active ArcGIS organizational account <user
name>_geoapps is not enabled for esri.com websites."
If you see this message:

• Choose the option Sign Out Of This Account.

• Go to the website you are trying to reach.
• Choose Sign In, and then sign in with the correct user name and password (that is, not
your course ArcGIS credentials).

Copyright © 2020 Esri. All rights reserved. 4

 Do-It-Yourself Geo Apps MOOC

Note: The setting that shows that your course ArcGIS account "is not enabled for esri.com
websites" is correct. The account administrator is not able to change this setting.
Now that you are familiar with your ArcGIS Online course credentials, you will create a new
web map.

Step 2: Add data to a web map

To create a geo app, you first need to create a web map. You will create a web map using
layers that show amenities in Denver, Colorado. You will use layers that already exist and are
shared publicly.

a At the top right, click the App Launcher button.

b From the list of apps that is displayed, click Map Viewer Beta.
Map Viewer Beta is the next-generation map-making tool for ArcGIS Online. You will use Map
Viewer Beta to create your map.

Copyright © 2020 Esri. All rights reserved. 5

 Do-It-Yourself Geo Apps MOOC

Note: The app icons may appear in a different order than what is shown in the graphic.

c On the Welcome To Map Viewer Beta message, click OK.

Copyright © 2020 Esri. All rights reserved. 6

 Do-It-Yourself Geo Apps MOOC

You should now see a blank web map ready for you to begin adding data to.
You will add layers to the map. You can search for layers that have been publicly shared in
ArcGIS Online, layers that have been shared within your organization only, and private layers
that you own or that have been shared with you through a group. You can search using
keywords and apply a spatial filter to limit the results of your search to the map extent. You
can also use ArcGIS Online groups to organize data layers and access the layers directly in the
map.

d Under Layers, click Add layer.

Copyright © 2020 Esri. All rights reserved. 7

 Do-It-Yourself Geo Apps MOOC

e Under Add Layer, click the My Content down arrow and choose ArcGIS Online.

f In the Search For Layers field, type Denver mooc and press Enter.
Five layers representing local Denver amenities appear in the results.

Copyright © 2020 Esri. All rights reserved. 8

 Do-It-Yourself Geo Apps MOOC

Note: If you do not see the Denver items, first confirm that you are signed in to ArcGIS Online
with your course credentials (where your user name includes _geoapps). If you are signed in to
the correct account, please go to the Help tab in the MOOC platform.

Copyright © 2020 Esri. All rights reserved. 9

 Do-It-Yourself Geo Apps MOOC

g Next to each of the five layers owned by EsriTrainingSvc (Libraries, Swimming Pools,
Picnic Areas, Parks, and Playgrounds), click the Add button to add the layers to the
map.

h At the top of the Add Layer pane, click the Back button to return to the Layers pane.

Step 3: Reorder map layers

In the map, you do not want the Playgrounds or Parks polygons obscuring the other amenity
point features, so you will move these layers to the bottom of the Layers pane.

a In the Layers pane, click and drag the layers up or down so that the layers appear in the
following order: Swimming Pools, Libraries, Picnic Areas, Playgrounds, and Parks.
Your Layers pane should match the graphic below.

Note: It's OK if you are not able to rearrange the layers if, for example, you are completing
the exercise on a tablet device. You can still finish the exercise even if the layers are in a
different order.

b Zoom out or pan the map as necessary to view all of the features.
Question: It is easy to visualize the different geometries for the layers that you have added to
the map. But when you use GIS, your features can contain both location information and

Copyright © 2020 Esri. All rights reserved. 10

 Do-It-Yourself Geo Apps MOOC

attribute information, which allows you to learn more about each feature. How can you find
this attribute information?
Answer: If you want to look at the attribute data associated with those geometries, you must
explore their tables.

Step 4: Examine attribute data in a table

You will open the table for the Libraries layer to see what attribute information is available.

a In the Layers pane, next to the Libraries layer, click the Open button.

b Below Libraries, click Show Table.

The table displays all of the attribute data associated with the features in the Libraries layer,
including the name and address of each library.
Tables have many capabilities, including:

• Sorting on a field
• Dragging columns to reorder fields
• Changing the column widths
• Showing and hiding fields
• Expanding the table to see more rows
• Getting field information, including field type and description
• Applying a filter
• Editing records, if editing is enabled

c In the upper right of the table, click the close button.

Copyright © 2020 Esri. All rights reserved. 11

 Do-It-Yourself Geo Apps MOOC

If you own or have editing privileges for a layer, you can work with its data in the attribute
table or in the item page (https://bit.ly/2RGX5jn), under the Data tab. You can also work with
a layer's data in a pop-up window.

Step 5: Configure pop-up windows

Now that you know what information is available about each library, you will configure the
pop-up window with a subset of the available attributes. It is a best practice to always
configure pop-up windows in your web map.

a In the map, click a feature of your choice to open its pop-up window.
When you explore your feature pop-up window (like the one in the image below), you may
notice that you cannot edit the data. You cannot edit the data because you do not own the
layer, and the owner of the layer did not enable editing.

Pop-up windows are useful because they are how users receive information from your map. In
this course, it is especially important to remember that the pop-up configuration of your web
map's layers influences the behavior of the geo apps that you publish.

b Close the pop-up window.

Copyright © 2020 Esri. All rights reserved. 12

 Do-It-Yourself Geo Apps MOOC

c If necessary, in the Layers pane, click the Libraries layer to select it.

d On the right side, on the Settings toolbar, click Configure Pop-ups.

Here, you will use the layer attribute data to control what information is shown when a feature
is selected on the map and how certain geo app components behave. You will see the geo
app component later. For now, you will configure the Libraries layer pop-up window.

e In the Pop-ups pane, under Title, click the Edit button.

Copyright © 2020 Esri. All rights reserved. 13

 Do-It-Yourself Geo Apps MOOC

f From the Title field, delete the word libraries.

You will configure the pop-up title to show the name of each library instead of the word
libraries.

g To the right of the Title field, click the Add Attribute button .

h From the list that opens, select {LIBRARY_NAME}, and then click OK to add it as the title
of the pop-up window.

i In the Attributes section, click the Expand button.

Copyright © 2020 Esri. All rights reserved. 14

 Do-It-Yourself Geo Apps MOOC

Here, you can choose the fields to display in your pop-up window. You will remove all of the
display attributes except ADDRESS_LINE1 and CIRCULATION.

j Click the X to the right of each attribute except ADDRESS_LINE1 and CIRCULATION.
You can rename the fields using a display name to better describe your data.

k On the Settings toolbar, click Configure Attributes.

l Click the ADDRESS_LINE1 attribute.

m Under Display Name, replace the text with Address and then click Done.

n Click the CIRCULATION attribute.

o Under Display Name, replace the text with Circulation.

p For Show 1000 Separator, turn the option on, and then click Done.

You have updated the display names that are shown in the pop-up window. Let's take a look
at the result.

q In the map, click a library feature.

Hint: On the left toolbar, click Legend to determine which features are libraries.
The pop-up window for the feature should resemble the following graphic.

Copyright © 2020 Esri. All rights reserved. 15

 Do-It-Yourself Geo Apps MOOC

Configuring pop-up windows allows you to control the information delivered to someone
viewing your web map or geo app.

Step 6: Save your map

To create your geo app, you must first save your web map.

a On the left toolbar, click Save.

b In the Save Map window, in the Title field, type Denver Amenities, followed by an
underscore and your first and last names so that the map has a unique name.
Note: Because many other students are creating a similar map, adding your first and last
names ensures that you can find your map later.
It is also a good idea to add metadata—tags and other identifying information about the
data—to your items. This information helps you and others find this map, either in your
organization or the general public, depending on how you share your map. Tags also help
organize different types of items together (such as maps, map layers, or apps) so that they can
be easily searched.

c In the Tags field, type Denver, amenities, swimming pools, libraries, parks, and any
additional tags you would like.
Note: Press Enter after each tag to save it in the Tags field.

d If you like, you can add a summary description of your map in the Summary field (for
example, Web map with layers showing amenities in Denver).

Copyright © 2020 Esri. All rights reserved. 16

 Do-It-Yourself Geo Apps MOOC

e Click Save Map.

Note: ArcGIS Online is a dynamic platform, so we recommended periodically saving your map
as you work.
The map will be saved to your Content collection, which contains all the content you have
created in ArcGIS Online. You can access your content at any time by signing in to your
course account and clicking on Content.
Now that the pop-up configuration is stored in the web map, you will see how the pop-up
window influences the behavior of a geo app. A geo app is one type of web app that has a
spatial component, giving you a better way to share information.

Step 7: Create a web app

Although you can author and share maps, geo apps are better for sharing geographic data
with your organization or the general public, especially for non-GIS users. This quality reflects
the purpose, as discussed in the lecture video. You must think about your reasons for making
an app, just like analyzing the purpose of the map. Whether you are sharing spatial
information with an offline audience, such as field workers, or informing nontechnical users
who would rather use an app than a map, different tools suit different purposes.

Copyright © 2020 Esri. All rights reserved. 17

 Do-It-Yourself Geo Apps MOOC

a Next to the name of your map, click the Menu button.

b Click Content.

c Click the title of your Denver Amenities web map.

d On the right, click Create Web App.

e Note the different options shown.

This shows some of the options for creating geo apps from maps. You can create a web app
with a map using ArcGIS Configurable Apps, ArcGIS Web AppBuilder, ArcGIS StoryMaps, or
ArcGIS Dashboards. Each of these options offers various functionality. You will learn about

Copyright © 2020 Esri. All rights reserved. 18

 Do-It-Yourself Geo Apps MOOC

many of these options in this course. In this exercise, you will use one of the configurable app
templates. Configurable Apps provide a suite of app templates.

f Click Configurable Apps.

The Create A Web App window is organized by what you are trying to achieve with your app.
If you'd like, you can explore the available configurable app templates
(https://bit.ly/2w1X8I7). For now, you are going to use the Local Perspective app template.

g In the Create A Web App window, on the left under What Do You Want To Do, click
Provide Local Information.

h In the filtered list on the right, select the Local Perspective (https://bit.ly/2kbehhp)
configurable app template.

The Local Perspective app is designed to give a user information about amenities within a set
distance of a given location.

i On the right, click Create Web App.

Copyright © 2020 Esri. All rights reserved. 19

 Do-It-Yourself Geo Apps MOOC

In the Create A Web App dialog box, you can see the Title and Tags from your web map.

j Verify that your name is included in the title for the new app.

k In the Summary field, type Local Perspective app highlighting amenities in Denver, CO,
and then click Done.

Step 8: Configure your web app

You can use the General, Theme, and Options tabs at the top left of the app configuration
window to configure your app. Because you created the app from the item page for your
Denver Amenities map, the web map is already selected in the configuration settings. On the
General panel, you want to allow users to access ArcGIS Online's routing service and be able
to get directions to the amenities that interest them, so you will enable access to this service.

a On the General tab, in the Subscriber Content section, check the Route box to enable the
routing service.

Copyright © 2020 Esri. All rights reserved. 20

 Do-It-Yourself Geo Apps MOOC

Note: You will see a note that the Route service consumes credits from your ArcGIS Online
organization. The more the Route service is used, the more the number of credits deducted.
However, you will be the only one creating routes with your app, so credit use will be minimal.
Enabling subscriber content in an app, whether it originated from a web map or an app
template, is required if you want to share the app with the public.

b Click the Theme tab.

Copyright © 2020 Esri. All rights reserved. 21

 Do-It-Yourself Geo Apps MOOC

The theme settings are where you decide how your app will look. You have the option to
select a color that will remain constant as you cycle through the different amenity layers, or
you can choose the default, which is to cycle through various colors for each of the layers in
the map. Feel free to experiment with these different options.

c Click Save to preview your changes.

d Click the Options tab.

e Check the Enable Routing Directions box.

f Increase the Maximum Distance to 30 miles and the Default Distance to 10 miles, so that
you will find some amenities by default when you launch the app.
You again have freedom to experiment with the information you want to provide your app's
users. We encourage you to explore the rest of the options.

Copyright © 2020 Esri. All rights reserved. 22

 Do-It-Yourself Geo Apps MOOC

g When you have finished configuring your web app, in the bottom-left corner, click Save,
and then click Close.
The item page for your web app will display. The item page has more metadata options than
the short description you entered when creating the app. You can add a long description,
terms of use, more tags, and credits.

h Explore the different tabs and fields containing additional information and settings for
your app.

Step 9: View the configured web app

Now that you have configured your web app, you will explore how the app works and see the
impact of configuring the pop-up windows in your map.

Copyright © 2020 Esri. All rights reserved. 23

 Do-It-Yourself Geo Apps MOOC

a In the top-right corner of the item page, click View Application to open the app.
Local Perspective geo apps can do a lot without much configuration. This quality is related to
the second point from the lecture video: functionality.
You can change the center of the amenities search zone by clicking the map or entering an
address, you can adjust the distance of the search zone, and you can get information about
returned features through the side panel. All of this functionality supports this app's purpose
of providing information about amenities close to a given location.
Also, you may notice how the points are rendered on the map. The map cartography is set
automatically by the template. So, the configurable apps also ensure good aesthetics.

b Click a feature on the map or choose a feature from the list in the side panel.
Note: You can click the map to move the center point and view more features.
The information presented in the side panel is the same as the information you can access
through the layer attribute table and the information in the pop-up window you explored
earlier.

Copyright © 2020 Esri. All rights reserved. 24

 Do-It-Yourself Geo Apps MOOC

c In the top-right corner of the side panel, click the Next button to scroll to the next layer.

Clicking Next displays the Libraries layer. Do you notice anything different about the side
panel when the Libraries layer is displayed? The amenity list shows the library names, whereas
the Swimming Pools layer showed the layer name.

Copyright © 2020 Esri. All rights reserved. 25

 Do-It-Yourself Geo Apps MOOC

d Select one of the libraries from the list.

The information that is displayed is also different from what was displayed for the Swimming
Pools layer. The information differs because the Local Perspective template uses the pop-up
configuration you saved in the web map to decide what information to present to the user.

Now that you know how the web map's pop-up configuration controls the Local Perspective
app's behavior, you could return to your original web map and experiment with the other
layers' pop-up configurations.
Congratulations!
You have created your first web map and a geo app that provides information to app users
about amenities around Denver, Colorado. Hopefully you learned that creating visually
appealing geo apps that provide relevant functionality is relatively easy using configured app
templates in ArcGIS Online. And, you should have a better understanding of what it means to
go from web layers to web maps to web apps. We look forward to seeing the other apps you
create in this course!

Learning Resources
Here are some more resources to continue learning:
ArcGIS Online Resources (https://bit.ly/1qljbR0)
10 Free GIS Data Sources: Best Global Raster and Vector Datasets (https://bit.ly/2L1tNE6)

Copyright © 2020 Esri. All rights reserved. 26

 Do-It-Yourself Geo Apps MOOC

More Esri training:

Learning Plans:
ArcGIS Online Fundamentals (https://bit.ly/2TUrnyr)
Make and Share Web Maps with ArcGIS Online (https://bit.ly/36KXzJA)
Training Seminars:
Power Your Organization with ArcGIS Online Maps, Apps, and Analytics
(https://bit.ly/31wDEtO)
Build Your Own Web Apps (https://bit.ly/2qDFZq7)
Get Started with Configurable Apps (https://bit.ly/2jwdqC2)
Tutorials:
Learn ArcGIS (https://bit.ly/2kuoA0t)
How to Smart Map tutorial (data visualization) (https://bit.ly/2L7kDGg)
Try Map Viewer Beta: Quick-start tutorial (https://bit.ly/3djkMVK)
Video:
ArcGIS Online: App Basics (https://bit.ly/2P81glM)

Copyright © 2020 Esri. All rights reserved. 27