Affordance and Signifier

In this UI design we are using several signifiers that will allow the user different affordances both in the interaction  the user has with the app but also in what they take away from what we are communicating in the app specifically with the use of color in the map.

We are using signifiers as icons to portray meaning faster for the users that are ending the run do not want to loose time reading the signifiers that we also have as labels. So I decided to have the labels more discrete and to add the icons as signifiers so the user can understand in a split second the distance she has run, the average velocity and the pace. But I also wanted to add another a layer of signifiers using color. On the map as we see the polyline added to the mad signifying the route the user has ran we can see 4 colors. Those colors will be signifying the pace the user has ran or walked during the course. From the red signifier meaning the pace was fast to the green meaning they walked it in a slow pace.

In terms of affordance the user can interact clearly by clicking the button to share the results and route of the course ran. But they can also click the spotify and apple music icons on the top bar that will connect to music. Th interaction I went for was simply the click being the type of affordance the users are more used to see in this type of app.