Section3Exercise1 CreateCollectionAndDashboardApps

Do-It-Yourself Geo Apps MOOC
Exercise
Create Collection and Dashboard
Apps
Section 3 Exercise 1
09/2018
Create Collection and Dashboard Apps
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 screenshots you see in the course materials.
Time to complete
Approximately 50-60 minutes
Technical note
To take advantage of the web-based technologies available in ArcGIS Online, you need to
use a fairly new version of a standard web browser, such as Google Chrome, Firefox, Safari,
or Internet Explorer. Older web browsers may not display your maps correctly.
For information on supported browsers, visit the documentation (https://bit.ly/2pIIN2T).
Introduction
You have heard about smart communities and crowdsourcing to learn from citizens in an area,
and now you will learn how to do it. You will create two items:
1. A web data collection form, using Survey123 for ArcGIS

2. A viewer app to display the crowdsourced data, using Operations Dashboard
Survey123 (https://bit.ly/2bLewJ1) allows users to enter data with a form and thereby add
locations and information to a hosted feature layer. The layer can be displayed in a web map,
and both of them must be public-facing and editable. Survey forms are a great way to
crowdsource data; they allow you to collect data and display it in another web app. Collector
for ArcGIS is a similar configurable web app for the field. It is more focused on mobile field
workers adding more structured data onto maps than the public crowdsourcing simple survey
data into a form.
Operations Dashboard (https://bit.ly/2BclAYx) is a good app for displaying and sharing
crowdsourced or other field data, especially more dynamic data, complex data, or live real-
time data. Another alternative would be the Summary Viewer app template. Ops Dashboard
gives you more element options to include in a dashboard, such as charts and graphs.
Copyright © 2018 Esri. All rights reserved. 1

Remember the basic workflow of starting with a web layer, making a web map, and
subsequently making a web app:
In this exercise, you will gather the data for your web layer by crowdsourcing it from other
students.
Part I - Guided
The exercises in Sections 2 through 6 are split into two parts: the Guided part, which provides
step-by-step instructions, and the Do-It-Yourself part, where you can explore further and build
your own geo apps.
Step 1: Explore a crowdsourcing geo app

First, you will examine a simple survey that uses Survey123 to collect crowdsourced data.
Survey123 for ArcGIS is a field data collection tool included with your ArcGIS Online
subscription. It is easily configurable to collect data, including location, using a desktop app
or a web app. Surveys can be taken in a web browser or on your mobile device with the
Survey123 app. Because it automatically creates the web layer for you, it is easy to analyze the
results in a map and to create a web app from the map. First, you will see an example of a
survey. Later, you will create your own.
a Open a new private (or incognito) web browser tab or window.

We recommend that you open a private or incognito browser window whenever you need to
work in ArcGIS Online to help prevent conflicts with your accounts.
b Browse to https://arcg.is/14L5uX to view the example survey.


c Fill out the survey about your community.

The results of the survey will be used to create a web app that will show citizen perceptions of
how smart communities are around the world.
d At the bottom, click Submit.

Along with your scores, you have just added a location point to a feature layer. If you were to
use that layer to make a web map, you would be able to view all the data that has been
submitted.
Now that you have seen how a Survey123 app can be used to collect data, you will build your
own.
Step 2: Create a Survey123 app to collect data

The Survey123 form will create the hosted feature layer that you need in order to show the
results in a web map. Feature layers are added to Map Viewer in ArcGIS Online, where you
can symbolize, analyze, and combine them with basemaps and other feature layers to create
great-looking web maps. Remember, Map Viewer is the place where you author maps, but as
a best practice, geo apps are better for sharing geographic data with, or collecting data from,
the general public.
The following graphic illustrates how layers, web maps, and web apps can be shared in
ArcGIS Online. For more information about sharing, click here (https://bit.ly/1IwRKdn).
After creating the feature layer and the web map, you will create a web app to share the
survey results.
a Browse to survey123.arcgis.com.

b At the top right, click Sign In, and use your course credentials to sign in.
Note: The Section 1, Exercise 1 PDF explains how to determine your ArcGIS Online
credentials (username and password) for this course. If you have trouble signing in, you can
check the Common Questions on the Help tab, search for other students with the same issue
in the forum, or use the Have A Question form at the bottom of the Help tab.
c If necessary, at the top, click My Surveys.
d Click Create A New Survey.
e If you see options for using the web designer or Survey123 Connect, choose the web
designer.
Survey123 Connect is the desktop app that you can also use to create survey forms. You will
use the web designer for this exercise.
f Fill in the survey fields as follows:
• Name: How Smart is Your Community?_<your name>

• Tags: smart communities, survey form
• Summary: Survey to collect data on communities around the world.

g Click Create.
You are directed to the survey builder, which will help you configure your app. On the right
are the question types that you can add to your survey and then edit. On the left is the survey
form preview that will show your changes dynamically.
First, you want to add the ability for users to add their location.
h On the right, verify that the Add tab is selected.
i Click and drag the GeoPoint question type to the left, above the Submit button.
j Click the new question, named Untitled Question 1, to show the Edit tab on the left.
k Fill in the survey fields as follows:
• Label: Set your community location

• Hint: Pan and zoom the map as needed to show the location of your community.
• For Validation, check the box to make this question required.

l At the bottom, click Save.

It is a good idea to save frequently.
m Next, click the Add tab to add another question.
n Click the Likert question type and drag it into your form, below the set location question.
A Likert scale is a popular method in surveys and questionnaires for getting opinions along a
preset range, typically a rating of how much the taker agrees or disagrees with a statement.
o Click Untitled Question 2 to edit its settings.
p Fill in the survey fields as follows:
• Label: Would you describe your community as smart?

• Hint: Rate your community on how well you think it is taking advantage of
technology to poll or inform its citizens.
• For Validation, check the box to make this question required.
You should enable the Required option for any question you consider to be the most
important information that you need to collect.

q Next, add a Dropdown question type to your form, below the previous question.
r Fill in the survey fields as follows:
• Label: Do you feel well-informed by your community?

• Hint: Good communication helps you feel informed on issues, rules, and questions,
via any media including websites or web apps.
• Choices: Change the text of the first choice to Yes and the second choice to No.
• For the third choice, use the Remove button to delete it.
s Add another Likert question type to your form, below the previous question.
t Fill in the survey fields as follows:
• Label: How likely would you be to use a web or mobile app to give feedback to
your community government?
• Choices: Very likely, Somewhat likely, Neutral, Somewhat unlikely, Very unlikely

u At the bottom, click Save, and then click Preview.

This shows you how your form will look to users. You can use the buttons on the right to
preview the form on a phone or tablet, as opposed to a desktop. You cannot actually take the
survey in the preview; you must publish the survey first.
v When you are finished previewing, at the top right, click the Close Preview button.
w If you caught any errors during the preview, fix them now.
Your survey uses a fairly simple data model with just a few questions. When you create your
own crowdsourcing apps, you can add as many fields as you want, which depend on the kind
of data you need to collect. You can also make dependent questions that follow rules you set
to only appear based on the answer to another question. Remember what you are going to
do with that data, though, when creating your data model. Will you want to filter it? Analyze
it? Symbolize it based on a field? Show the results in a geo app? Display high-level results in a
dashboard for executive briefings? These factors, along with your survey takers' experience,
are important considerations when collecting data.
Step 3: Publish and view your survey data collection app

Now you are ready to publish your survey.
a When you are done editing and previewing the form, click Publish.
b When it asks if you are sure, click Publish again.
c When publishing is complete, at the top, click the Collaborate tab.

You can now set the sharing options for your survey.
Currently, no one except you can currently submit data to the survey. Normally, you would
share the survey to a group, your organization, or Everyone (the general public) to begin
collecting data. However, only you need to be able to take this survey, as a test. When you
create a web map and geo app later in this exercise, you will use the class survey because it
will have more data to view.
d Below the sharing options, note the buttons to copy the shortened URL or QR code for
sharing the survey.
Note: Your results will be different from the graphic, as each survey receives a unique URL.
e Click the third button to the right of the URL to open the survey in a new tab.
f Complete your survey, and then submit your results.
g Close the browser tab to return to the survey settings.
h At the top, click the Analyze tab.
Here, you can see the current results of your survey. There is a chart for each question, with a
table below to show answer counts and percentages. The Data tab also presents survey
results in a more visual manner. Your survey only has one result, so the graphs do not have
much data to show.
Step 4: Edit and save a web map

For each user who takes your survey, the feature layer will have one more point feature
added. Because your survey does not have many results included yet, you will use the class
example survey to make your map in ArcGIS Online.

a At the top left, next to Survey123 for ArcGIS, click the down arrow.
b Click ArcGIS Online.
c If necessary, sign in using your course credentials.
d At the top, click Map.
e Click Add, and then click Add Layer From Web.
f In the URL text box, copy and paste in this address:

https://services5.arcgis.com/oFt0RLBVxpTM7Dv0/ArcGIS/rest/services/How_Smart_is_Your_Community_layer/FeatureServer
Note: When copying and pasting URLs from the exercise PDF, be sure to copy all of the
characters. If you receive a message that the URL is invalid, check to ensure that you have the
whole URL, with no added spaces.
This is the REST endpoint (URL) of the data from the class survey that you viewed earlier. A
web app can use a REST URL to access the data for analysis or display. If you were to paste
that URL into a web browser, you would see a Services Directory page with details describing
the data. The Services Directory works using REST, which is one common way for web
developers to share and access data using web services.
Note: Verify that there are no spaces in the URL after copying and pasting.
g Click Add Layer.

You may need to zoom out to see all of the features in the layer. You could change the
basemap or point symbology to display the data differently in the web app. But for now, you
will just turn on clustering. Clustering is a method of aggregating data to simplify display by
grouping numerous nearby points into fewer larger points. Cluster points are dependent on
the map scale, so as you zoom in to a map that is using clustering and ground distances get
smaller, symbols are broken out into multiple smaller symbols.
h Pause your pointer over the survey data layer, and then click Cluster Points to turn on
clustering.
Now you can save the map in order to use it in a web app.
i At the top, click Save, and then click Save As.

j Fill in the fields as follows:
• Title: Smart Community Survey Map_<your name>

• Tags: smart communities, survey results
• Summary: Web map for a smart community survey.
• Save in folder: <your ArcGIS Online login name>
k Click Save Map.

If you recall the geo apps workflow, you have created the web layer, and now you have the
layer added to a web map. The third step is to use the map to create a web app.
Step 5: Create an Operations Dashboard app

You can now use the web map with the map layer to create an Operations Dashboard web
app to display the crowdsourced survey data. A dashboard is a view of geographic
information that helps you monitor events or activities. First, you will share your map.
a At the top of Map Viewer, click Share.
b Check the box to share with Everyone (Public).

Sharing with people, such as Everyone or your organization, is necessary for crowdsourcing
apps so you can allow people to take your survey. The Share dialog box is also used for
sharing a map with a geo app so the app can use and display the map.

Sharing a web app means you must share the underlying web map, and sharing a web map
means sharing the layers in the map. By default, your feature services and web maps are
private. When you update the sharing settings of a web map, or create an app that is based
on the sharing settings of the map, you should update the sharing settings of the map layers.
If you set the sharing of a map to a setting that the map layers do not have, you will be asked
if you would like the sharing settings for the layers to automatically be updated.
Currently, the Embed In Website button is enabled. This function allows you to take the code
for the map and embed it in your own external website. If the map were not shared with the
public, the button would not be enabled. For this exercise, you will create a web app with the
map instead.
c Click Create A Web App.

Many different options are shown. Configurable apps are reviewed in this course in Sections
1, 2, 3, and 6. Section 4 has Web AppBuilder apps, and Section 5 specializes in native apps.
For this exercise, you will create an Operations Dashboard app to display crowdsourced data.
d Click the Operations Dashboard tab.

e Update the fields as follows:
• Title: Smart Community Survey Dashboard_<your name>

• Tags: smart communities, survey results
• Summary: Web app for a smart community survey.
• Save in folder: <your ArcGIS Online login name>
f Verify that the box to share the app in the same way as the map is checked.
g Click Done.
The dashboard web app is displayed and ready for you to add elements. Elements are tools
like charts, gauges, and more. The best element to add first is the Map element because map
layers can serve as data sources for other elements. The map has probably already been
added automatically, but if not, you should add it first. You can then configure the app to
show additional elements.
By constructing both a collection app (the survey) and a display app (the dashboard) from the
same feature layer, you ensure that any new data from the collection app is added to the
display app in real time. Use this workflow if the collected data does not need to be vetted
before it is made public, and you want to see the changes live, as they occur.
Step 6: Add elements to the dashboard

a To configure your dashboard, at the top right, locate the button to add or edit elements.
b Click the Add button.

c In the drop-down list of elements, click Indicator.
d For the data layer, click the first How Smart is Your Community layer (not the metadata
layer).
The options to configure the element appear on the left, and the preview is on the right.
e To configure the Indicator element, on the left, click the Indicator tab.
f In the Top Text field, type Surveys completed:.
g Click through the different tabs, and feel free to make any additional changes.

h At the bottom right, click Done.

You can see the element added to the dashboard, along with the map. The Indicator element
is a real-time display of how many surveys have been completed. When you have more
elements, you can drag them around to rearrange them.
i At the top right, click the Save button.

As always, it is a good idea to save frequently. Now you will add and configure a dynamic
chart element.
j Next, click the Add button again, and click Serial Chart.
k Select the non-metadata data source.
l On the configuration page, from the Data tab, click the Category Field drop-down list,
and then click the "Would you describe your community…?" choice.
The preview updates with the results of the survey question that asks about smart
communities.
m Click the Value Axis tab.

The value (vertical) axis defaults to divide the results into even numbers, but because that
number represents the number of survey takers who chose a particular answer, you want it to
show only whole numbers.
n Click the Integers Only option to turn it on.
o Click the Series tab.
p Change the Bar Colors to By Category to show each bar in a different color.
q Click the General tab.
r Change the Description to Would you describe your community as smart?

Hint: Click Edit.
s Click through the other tabs and make any other changes you like.
t Click Done.
Now you have more than one element, and can see how your dashboard will start to come
together.

Step 7: Rearrange the elements

Now that you have more than two elements, you see that you should rearrange them.
a Pause your pointer over the top left of the Serial Chart element until you see four icons.
The first button, Drag Item, is used for moving elements around in the dashboard. The
second button allows you to go back to the configuration page to make more changes.
b Click the Drag Item button, and drag your pointer to the right, over the Indicator element.
When you drag the Serial Chart element, you see small squares on the Indicator element.
These are used for docking the element. If you use left or right docking, the element will be
added to a new column on the left or right. If you use top or bottom docking, it will be
docked as a row above or below.
c Drag the Serial Chart element to the top docking icon to move the chart into the same
column as the other element.

d Grab and drag the bars that separate the elements to expand the Map element and to
shrink the Indicator element.
Your dashboard should look similar to this graphic.
Note: Your map and survey results will have higher totals than three surveys completed.
You can click any point to see the survey data for that record. You can also configure the map
to filter the results so that when you zoom in to a subset of the points, the bar graph is
automatically filtered to only show the results in the map extent. This way, you can see how
people from different parts of the world perceive how tech-savvy their communities are.
Because you do not want to have to click a point to see survey information, there is one more
element that would be good to add: the Details element.
e Click the Add button, and then click Details.
f Select the first data source option.

You would like to see the most recently added survey results at any given time.
g On the configuration page, click the Data tab, and click Sort.
h For the Sort By drop-down list, choose CreationDate.
i Below the drop-down list, click Descending.

j Change any other settings you would like, and then click Done.
k Pause your pointer over the top left of the new element, click the Drag Item button, and
move the element into the same column as the other two elements.
l Rearrange the elements' sizes again until you are satisfied, and add more elements, if you
want.
Now your dashboard looks a little more complete, and will be a good, informative way to
display results from your survey.
Step 8: Finish the dashboard

Now you have a live dashboard that reflects the current state of your survey. You can monitor
a dashboard for changes, or share it with members or your organization or the general public.
a Save the dashboard again, and explore the buttons to the top right.
You can set other general options, or get a shortened URL for sharing.
Note: The link that you see will be different from the graphic.
To share your dashboard with others, you would send this URL.
There is no publish or launch function because the dashboard is configured live and shared
with whomever you shared it with when you created it.
b At the top left, click the Home down arrow, and choose Content.
This brings you to your ArcGIS Online Content page. You can see the dashboard at the top of
your contents.

Congratulations! You have made a dashboard that displays and analyzes dynamic survey data.
In the next part of the exercise, keep going: apply what you have learned and do it yourself!
Part II - Do It Yourself
The Do-It-Yourself part contains additional optional goals for you to apply what you learned in
the Guided part of the exercise and build your own geo apps with less guidance. Feel free to
explore and experiment! Resources and samples to help you are listed in the Learning
Resources section at the end.
We do ask you that you read through this section even if you choose not to complete a DIY
project so that you will find and learn from your fellow students' work.
Build a data-collection geo app

The Guided part of this exercise conveyed the potential of a workflow that collects and
publishes live survey result data through the same feature service. At the beginning of the
exercise, you used a pre-existing survey form to submit your community opinions. Then, you
created your own Survey123 form. Finally, you created an Operations Dashboard app to view
other MOOC participants' entries.
The Survey123 app creates and populates the feature service (in this case, points with
attribute information), and the dashboard app uses that same service. Even though in the real
world you would create a dashboard or other viewing app from the same feature service, in
this exercise, you used a different feature service to create the geo app so it had some results
to view.
Now that you understand how a single hosted feature layer can be used to both collect and
share information, try building your own app that interests you. You are welcome to do one or
both of these two options:

1. Create a new survey form

Create a survey in Survey123, and ask a couple questions. Don't forget to add the map
component so you can see the locations of the participants. Post the survey in the forums and
ask students to take it so you can gather some data.
2. Display the results of the survey
Create a geo app to display the results of your survey. You can use Operations Dashboard,
any of the configurable apps (https://bit.ly/SO0jiz), Web AppBuilder (https://bit.ly/1DAV2Kb),
or even a Story Map (https://bit.ly/1X8Bkl4) to share your work in an engaging way. Or,
display any other data in an Operations Dashboard app.
Share your work with the class

When you are done with this DIY part, we ask that you share your results with the class.
For a crowdsourcing project, you will first need to share a survey with the class and ask
everyone to take the survey. If you display the results of the survey with an Operations
Dashboard or other geo app, go back and make a new forum post or add on to the existing
post to announce it, and share the link.
To share your work with the class, perform these tasks:
1. Share your app with Everyone (public).

2. Create a new forum post to announce your app so students and instructors can review it.
3. Give the post a meaningful title, and add the hashtag #DIYSection3.
4. Add the link to your app. This can be a shortened link from the Share dialog box or the
full URL copied from the web browser when viewing the app.
Course instructors will recognize especially creative or high-quality student work, whether a
geo app or anything else that shows you've learned a lot in this class, at the end of the course.
So, be sure to share it with us in the forum. Only properly tagged posts will be eligible for
recognition. See above for the hashtag to use in your post for this section.

Finding the work of other students

Now that you have shared your work from this DIY part of the exercise in the forum, go find
and review the work of others to give some feedback from the MOOC community.
1. In the forums, search by the hashtag #DIYSection3.

2. Read other student posts, and look at their geo app if they made one. If it is a
crowdsourcing app, complete the survey so that the student gets some results to display.
3. Give any helpful feedback or ask questions by replying to the forum post.
The Esri recognition for the best student work at the end of the course will be based on the
quality of the app or other work, as well as the quality reflected in the comments in the forum
post.
Learning Resources
We hope that with the app-building skills you have developed here, you can collect and share
information with your communities to make them smarter!
Here are some more resources to continue learning:
Field mobility apps, including Survey123, Operations Dashboard, and more (https://bit.ly/
2L1oNzk)
Survey123 page on GitHub (https://bit.ly/2vRi463)
Collector for ArcGIS (https://bit.ly/21FqlAi)
More Esri training:
Training seminar: Survey123 for ArcGIS: Collect Data in the Field with Smart Forms (https://
bit.ly/2BlDAoS)
Webinar: Working With the New Operations Dashboard for ArcGIS (https://bit.ly/2wf1r3E)
Instructor-led course: Field Data Collection and Management using ArcGIS (https://bit.ly/
2EJfmFB)

Section3Exercise1 CreateCollectionAndDashboardApps

Încărcat de

Informații document

Titlu original

Drepturi de autor

Formate disponibile

Partajați acest document

Partajați sau inserați document

Opțiuni de partajare

Vi se pare util acest document?

Este necorespunzător acest conținut?

Drepturi de autor:

Formate disponibile

Section3Exercise1 CreateCollectionAndDashboardApps

Încărcat de

Drepturi de autor:

Formate disponibile

Do-It-Yourself Geo Apps MOOC

Create Collection and Dashboard Apps

1. A web data collection form, using Survey123 for ArcGIS

Copyright © 2018 Esri. All rights reserved. 1

Step 1: Explore a crowdsourcing geo app

a Open a new private (or incognito) web browser tab or window.

b Browse to https://arcg.is/14L5uX to view the example survey.

Copyright © 2018 Esri. All rights reserved. 2

Copyright © 2018 Esri. All rights reserved. 3

c Fill out the survey about your community.

d At the bottom, click Submit.

Step 2: Create a Survey123 app to collect data

Copyright © 2018 Esri. All rights reserved. 4

c If necessary, at the top, click My Surveys.

d Click Create A New Survey.

f Fill in the survey fields as follows:

• Name: How Smart is Your Community?_<your name>

Copyright © 2018 Esri. All rights reserved. 5

h On the right, verify that the Add tab is selected.

k Fill in the survey fields as follows:

• Label: Set your community location

Copyright © 2018 Esri. All rights reserved. 6

l At the bottom, click Save.

m Next, click the Add tab to add another question.

o Click Untitled Question 2 to edit its settings.

p Fill in the survey fields as follows:

• Label: Would you describe your community as smart?

Copyright © 2018 Esri. All rights reserved. 7

r Fill in the survey fields as follows:

• Label: Do you feel well-informed by your community?

t Fill in the survey fields as follows:

Copyright © 2018 Esri. All rights reserved. 8

u At the bottom, click Save, and then click Preview.

Step 3: Publish and view your survey data collection app

b When it asks if you are sure, click Publish again.

c When publishing is complete, at the top, click the Collaborate tab.

Copyright © 2018 Esri. All rights reserved. 9

f Complete your survey, and then submit your results.

g Close the browser tab to return to the survey settings.

h At the top, click the Analyze tab.

Step 4: Edit and save a web map

Copyright © 2018 Esri. All rights reserved. 10

b Click ArcGIS Online.

c If necessary, sign in using your course credentials.

d At the top, click Map.

e Click Add, and then click Add Layer From Web.

f In the URL text box, copy and paste in this address:

g Click Add Layer.

i At the top, click Save, and then click Save As.

Copyright © 2018 Esri. All rights reserved. 11

j Fill in the fields as follows:

• Title: Smart Community Survey Map_<your name>

k Click Save Map.

Step 5: Create an Operations Dashboard app

a At the top of Map Viewer, click Share.

b Check the box to share with Everyone (Public).

Copyright © 2018 Esri. All rights reserved. 12

c Click Create A Web App.

d Click the Operations Dashboard tab.

Copyright © 2018 Esri. All rights reserved. 13

e Update the fields as follows:

• Title: Smart Community Survey Dashboard_<your name>

Step 6: Add elements to the dashboard