An application map is a diagram of blobs and arrows which defines the paths a user can take through an application. Each blob is a point at which the user needs to make a choice; each arrow out of a blob is a choice the user can take.

This map is for a simple media browser. The user starts at the blob with the big arrow pointing to it, and makes their first choice. They can only choose an album (types of things are put in curly brackets). When they've made that choice, they can only choose a song. Where the list of albums and songs come from doesn't matter to the map; all it cares about is that that is what sort of thing they are.

Some choices that a user makes are one-offs: instead of being "an album" or "a song", they are things like "the play button", or "the share button", or "Twitter". These things are put in double quotes.

This media player adds a "play" choice; in this case, it is a verb that will presumably correspond to a "play" button. But not all such one-offs have to be verbs:

This media player adds a "share" choice and two social media destinations to send content to.

To help the AppMaps system work out how to move the application between different form factors, you need to tell it what role each edge plays from a small set of predefined roles. In this application, for example, an album is a category of songs, so we can put it into one of the roles called gen (which deals with categories):

Note that the role is put after the kind of Likewise, the "twitter" and "facebook" choices represent destinations; so we can put those into the role dat (which deals with destinations):

The last thing that needs to be done is giving each edge a name, so that the selections the users make can be queried by the rest of the application. Names are put before the type with a colon:

The map is now ready!