Next Article in Journal
Does Culture Shape Our Spatial Ability? An Investigation Based on Eye Tracking
Next Article in Special Issue
Parametric Modeling Method for 3D Symbols of Fold Structures
Previous Article in Journal
Spatial Pattern and Influencing Factors of Basic Education Resources in Rural Areas around Metropolises—A Case Study of Wuhan City’s New Urban Districts
Previous Article in Special Issue
Geomedia Attributes for Perspective Visualization of Relief for Historical Non-Cartometric Water-Colored Topographic Maps
Font Type:
Arial Georgia Verdana
Font Size:
Aa Aa Aa
Line Spacing:
Column Width:

Map Design and Usability of a Simplified Topographic 2D Map on the Smartphone in Landscape and Portrait Orientations

Adam Mickiewicz University, Poznań, Poland; Department of Cartography and Geomatics, 61-712 Poznań, Poland
Collegium Da Vinci Poznań, 61-719 Poznań, Poland
Author to whom correspondence should be addressed.
ISPRS Int. J. Geo-Inf. 2022, 11(11), 577;
Original submission received: 27 August 2022 / Resubmission received: 13 October 2022 / Revised: 12 November 2022 / Accepted: 18 November 2022 / Published: 20 November 2022
(This article belongs to the Special Issue Cartography and Geomedia)


Map design and usability issues are crucial when considering different device orientations. It is visible, especially in exploring the topographical space in landscape or portrait orientation on the mobile phone. In this study, we aim to reveal the main differences and similarities among participants’ performance in a map-based task. The study presents an original research scheme, including establishing conceptual assumptions, developing map applications with gaming elements, user testing, and visualizing results. It appears that the different phone orientation triggers different visual strategy. This transfers into decision-making about the path selection. It turned out that in landscape orientation, participants preferred paths oriented east–west. On the other hand, portrait orientation supported north–south path selection. However, considering the given task accomplishment, both mobile phones’ orientations are adequate for the exploration of topographical space.

1. Introduction

The most popular maps on websites tend to have highly simplified graphics and symbols that create cartographic content that does not require map legends as they are interpreted intuitively [1]. Using basic map design principles enables easy map use, particularly on small display screens. These principles are: limit color choice and have perceptually clear differences [2], use conventional colors [3], ensure high contrast of point symbols [4], and low density of graphic elements [5]. Traditional topographic map design focuses on the graphical representation that can be read as a whole or separately and presented in a large format [6], whereas map design for smartphones’ size of the view is limited, and the two orientations, landscape and portrait, become significant. The user’s classic way of moving around the large printed cartographic image is to move one’s finger on it. However, the user’s way of moving around the map on a small smartphone display will necessarily be quite different. Indeed, traditional map design principles may still be employed, e.g., the focus of attention [7,8]. For centuries, map design has adapted to the methods of publication and the medium [9]; therefore, how maps are implemented on mobile devices and how users interact with them requires investigation.
Video games are one of the more interesting and littler explored mediums for presenting and researching cartographic products for smartphones [10]. The main concept that appears in such research is ‘Gamification’, which is the use of technology to design characteristic elements for video games in contexts not related to the game [11]. Gamification is a popular technique in many mobile applications that are content driven that require rich interaction between the user and the application [12].
To develop apps with interactive map viewing for mobile devices, one option is to use game engines such as Unity, Unreal, and Godot. These allow one to implement moving in 2D space and displaying appropriate maps in this space [13,14]. Unity, combined with the C# programming language, is an appropriate environment for creating cartographic apps. During the process of mobile map app design, it is important to minimize the interface but exploit the intuitiveness of touching the screen [1,15].
In this study, we analyze responsive map design in two contexts [16]. The first is related to the adaptation of cartographic content displayed on-screen, the so-called adaptation to the size and resolution of the device, while the other one is linked to the change in the device’s orientation [17]. The small size of the display also limits the space that can be allocated to buttons and other functions [18]. In the literature, there is a gap in research on using the same content of spatial information in landscape and portrait orientations of smartphones. There is very little evidence of the differences resulting from the interaction with the geographical space in the landscape or portrait orientation on small displays.
The methods of studying map usability are often based on the experiment in which map users do the same task but using different map versions [19,20]. A homogenous group usually consists of 20–30 respondents for public users and 10–20 respondents for experts [21]. Tasks to be performed by each individual respondent become the basis for obtaining objective data on the time of completing the task and the way of moving around the geographical space [22]. Tasks should be comprehensible for the user and possible to complete in a few minutes.
Nowadays, what is gaining popularity is eye-tracking applied in empirical studies on the efficiency of maps, e.g., animated maps [23], recognizability of map symbols in video games [24], user preferences and behavior in a topographic immersive virtual environment [19,25], walking and teleporting in a virtual stronghold [26]. However, the eye-tracking technique has only been employed in a few studies using mobile cartography [27] and focused more on many kinds of human–phone interfaces and the efficiency of apps on smartphones [28,29]. Therefore, eye tracking could show the differences in the visual strategy among users who perform a map-based task in different device orientations. If landscape orientation could lead to more frequent users’ activity on the east–west parts of the map, then eye tracking would help understand the visual attention distribution related to the device orientation.
Data obtained from any experimental research are saved in tables, print screens, text files, etc., which are then subject to statistical analyses and cartographic visualization. The use of graphical methods and mapping techniques for presenting results allows one to interpret the results more fully [22,30]. Appropriate statistical analyses [31,32] and data mapping techniques [33] are employed to form partial and full conclusions (cartographic research method).

2. Aim and Questions

The main objective of the research is to demonstrate the similarities and differences in moving around on the 2D map on the smartphone in the landscape and portrait orientations with attitude to map design and cartographical methods for representation of usability.
The objective of the research raises the following questions:
  • How to design a simplified 2D topographic map for gameplay with the opportunity to move on the roads/paths for smartphones?
  • How can one obtain data on the player’s movement on the smartphone display with landscape and portrait orientations?
  • What statistical analyses and mapping techniques can be applied to present the properties of moving around on the 2D map in landscape and portrait orientation?

3. Materials and Methods

To meet the objective and answer the above questions, we have adopted six main research stages (Figure 1):

3.1. Concept

Considering the cartographico-geomedial attitude (design of topographic map, map orientation, mapping techniques, geomedia efficiency, eye-tracking for cartographic content) and IT aspects (Information Technology: game engines software, programming scripts, data collection scripts, numerical data of path occupation), we adopted a concept embracing the following assumptions (Figure 1):
  • Map design: the whole map area is closed in the square, centralization of the two 16:9 ratio viewing with landscape and portrait orientation, simplified content of the topographic map, eight stone numbered monuments (see Figure 2);
  • App programming: moving around the roads, a user-symbol in the center of the display, minimalistic interface (no buttons, no joysticks), scrolling around the map by touch, eight consecutively seized stone monuments, summarizing data after each walk in the form of an image with a path and sometimes for each segment of the path;
  • Respondents: 60 users, aged 19–24, from a homogenous group of Adam Mickiewicz University Poznan students, participating in the game voluntarily, without any financial gratification;
  • Survey: each participant receives the same task instructions, which are to move on the map using roads only to reach each of the eight stone monuments as quickly as possible; 30 participants do the task on the smartphone in the landscape orientation, and 30 participants in the portrait orientation;
  • Software and equipment: graphic and cartographic software (Inkscape, Photoshop, QGIS); game engine (Unity), programming language (C#); survey (smartphone 16 × 9; eye-tracker Gazepoint GP3 HD, Gazepoint Control, laptop MSI);
  • Statistical analysis: total time of gameplay, median, statistical significance;
  • Cartographic visualization: visual strategy: heat map and proportional point symbol map; road load intensity: flow map (band cartodiagram);
  • Expected research results: List of general and particular similarities and differences for landscape and portrait orientation.

3.2. Creating a 2D Map for Smartphone

Simplified content of the topographic map was created in six perceptual colors (gray roads, red—buildings, blue—lakes/rivers, green—forests/parks, black—stone monuments, and yellow—location of the user. A yellow circle is used to symbolize the location of the user; initially is located in the center of map. For designing the map, the landscape and portrait frames (which would provide the initial views) were placed in the center of the area (Figure 2). The location of the eight stone monuments is significant. The first three locations were also placed beside roads but outside the initial view. They had a similar distance from the center of the map and kept well inside the frame of the map extent.
New cartographic elements were created in a vector graphical program, Inkscape, as an SVG file. The basic cartographic symbols are easily distinguishable, both perceptively and intuitively, by using conventional colors and styles. The fundamental content (roads, rivers, lakes, forests-parks, buildings) was then supplemented with the monument point symbols of high contrast (Figure 2). The symbol of the user’s location, always located on the road exactly in the middle of the map displayed, was the focus of visual attention [10]. To increase the contrast, the yellow circle has a black outline [7]. Following the rules of map design, the background of the map was made very light yellow. Stone monuments are characterized by the shape from topographic maps [34], although each of them received a unique white number (1–8). The finished graphics of the map was saved as a PNG file at a high resolution.
Figure 1. Graphical scheme with six research stages.
Figure 1. Graphical scheme with six research stages.
Ijgi 11 00577 g001
Figure 2. Simplified content of the designed topographic map with initial view frames in landscape and portrait orientations.
Figure 2. Simplified content of the designed topographic map with initial view frames in landscape and portrait orientations.
Ijgi 11 00577 g002

3.3. Creating an Application for Smartphone

App development began with preparing a scene in which the map, the player, monuments, the camera, and a summary screen were located. Then, the behavior of these elements, their interactions, and reactions to user input were implemented. The graphic of the map was directly placed on the scene and included roads that had been reflected in the physics system by roads made of Edge Colliders. The player was represented in physics as Circle Collider but also had a component of Rigidbody component that is necessary for moving objects. The player moves in the direction indicated by the finger that touches the screen. While the player is moving, contact with the nearest road is constantly checked (the collision of Colliders of the player and roads), and the player is required to be in the middle of the road to prevent them from leaving the path.
Monuments had their own Circle Colliders, which were placed on the adjacent road. Only the Collider for the monument being searched for is active. When the player Collider meets the Collider for active monument information about successfully seizing that control point. The action of saving this data changes the active monument to the next one in the sequence. In the beginning, only monument 1 is active, and after monument 8 is seized, the results are summed up. The order of collecting stones was not voluntary. After stone no. 1 is captured, stone no. 2 would activate in black. After stone no. 2 was reached, stone no. 3 would activate, etc.
The camera on the scene is constantly following the player, which means that the player remains in the center of the view throughout the activity. Initially, the script adjusts the size of the camera view to the selected portrait/landscape mode. The summary screen includes a list of times when individual stones were seized and the tracks that the player completed. The data on tracks are collected, starting with the moment the app is started, and LineRenderer is used for displaying them on screen.
Figure 3 presents the code to implement moving toward the touch by the user’s finger. The Update method is activated approximately 60 times per second and serves to interpret the user’s touch. The FixedUpdate method is activated exactly 50 times per second and is used for moving the symbol of the player. Placing the player on the road is crucial for moving on the roads on the map. Out of all roads located nearby the touch point, the nearest road is picked, and the new position of the player becomes the contact point with this road. Furthermore, obtaining the number of walks that users took down individual stretches of the roads was implemented (stretches marked with two letters are presented in a flow map. The load of the road stretch is measured by the number of walks taken down the specific stretch by 30 respondents.
Figure 3. The implementation of moving toward the touch by the user’s finger.
Figure 3. The implementation of moving toward the touch by the user’s finger.
Ijgi 11 00577 g003

3.4. Surveys among Map Users

The researcher would invite a participant into the room, and the respondent would sit down at the table in front of a smartphone mounted on a handle. Then, the researcher explained the research objective in general terms and presented the way the smartphone worked with an eye-tracker. The participant selected the required orientation of the smartphone and then the eye-tracker calibrated eyesight (Figure 4). After the player entered the game, the researcher informed the participant about his/her location with a yellow circle in the middle of the map. Next, the participant would receive a task to reach all black stone moments, starting with 1 to the last one, as quickly as possible. The authors of this study decided that the time between the game entering and taking monument no. 1 will be time for the user to familiarize themselves with the application and its gameplay. After collecting monument no. 1, the game time was officially counted, which was later analyzed in the study. When the participant reached stone monument no. 8, the researcher thanked the participant for completing the task and recorded the data of that completed walk.
In the research, all the respondents held the smartphone in two hands and used their thumbs to interact with the screen, which is in keeping with how mobile devices are typically held [35,36,37]. Such use of smartphones also resulted from the ability of the user’s marker to move down the roads, i.e., from smooth scrolling down the map. The settings resulting from the eye-tracking technology supported this solution too. The data were recorded on the smartphone after each completed gameplay. Figure 5 presents an example of data collected from participant no. 18 (see Figure 6B).

4. Results

4.1. Statistical Analysis

The time data of the 60 research participants were divided into two main categories: the total time of the walk and the time of individual paths (Figure 6). The shortest time in portrait orientation was achieved by user P12 (83.96 s) and the longest time—by P29 (185.42 s) (Figure 6B). The median value of the total game time for the entire portrait group was 116.70 s, and the standard deviation was 22.37, which confirms the temporal discrepancies between players. The shortest time of going through the entire application in landscape orientation (Figure 6A) was achieved by user L29 (70.20 s), and the longest time was by user L25 (182.70 s). The median of the total game time for the entire landscape group was 118.09 s, and the standard deviation was 25.45, which also confirms time intervals between users. The non-parametric Mann–Whitney U test for independent samples was carried out in PQStat (v 1.8.). This is an appropriate test to compare two groups when the data distribution does not fit the criteria of a normal distribution [31,32]. To evaluate differences for portrait and landscape orientation groups, the medians for individual categories are compared (Figure 7). Users that went through the application in portrait orientation would complete the search faster by 1.39 s than those in landscape orientation. The statistical test results did not confirm the significance of this difference.
The Mann–Whitney U test on these median times is shown in Figure 8. For moving between monuments 4–5 (p-value = 0.04) and for 5–6 (p-value = 0.009), the test demonstrated the differences in parameters between the two orientations. For paths 4–5, users in landscape orientation would find the point faster than in portrait orientation. The difference may result from the fact that points 4 and 5 were more visible for users in horizontal orientation, which allowed users to find the right route to the destination faster. The difference may be corroborated by eye-tracking analyses and route traffic loads. For paths 5–6, users in portrait orientation would find the point faster than in landscape orientation. Although while seizing point 3, the landscape players would see the location of monument 6 (considering the width of the field of vision), this knowledge failed to translate into moving from 5–6 faster than portrait users.
Figure 4. Researcher and participant with a smartphone in landscape and portrait orientation.
Figure 4. Researcher and participant with a smartphone in landscape and portrait orientation.
Ijgi 11 00577 g004
Figure 5. Path data of participant no. P18 (see Figure 6).
Figure 5. Path data of participant no. P18 (see Figure 6).
Ijgi 11 00577 g005
Figure 6. (A): Time data of 30 participants with landscape orientation; (B): Time data of 30 participants with portrait orientation (red is the longest time, and blue is the shortest time in each column).
Figure 6. (A): Time data of 30 participants with landscape orientation; (B): Time data of 30 participants with portrait orientation (red is the longest time, and blue is the shortest time in each column).
Ijgi 11 00577 g006
Figure 7. Comparison of the median time for landscape and portrait orientation.
Figure 7. Comparison of the median time for landscape and portrait orientation.
Ijgi 11 00577 g007
Figure 8. Box plots of statistical significance for paths 4–5 and 5–6 in portrait (P) and landscape (L) orientation.
Figure 8. Box plots of statistical significance for paths 4–5 and 5–6 in portrait (P) and landscape (L) orientation.
Ijgi 11 00577 g008

4.2. Cartographic Visualization

A cartographic visualization of the research results included three quantitative mapping techniques: a heat map, a comparative flow map (band cartodiagram), and a proportional point symbol map [38] (Figure 1).
The first visualization in the form of six heat maps was based on fixation distribution (Figure 9). This cartographic image presents a visual strategy for completing tasks in portrait and landscape orientation. The results presented are related to the entire task, i.e., the user’s moving from monument 1 toward monument 8. In the portrait version, the users’ gaze was focused on the central part of the smartphone screen, slightly below the geometric center (Figure 9A). Fixations are distributed significantly more along the longer vertical axis of the screen. Therefore, the point of the highest density of fixations (app. 600,000) had an ellipsoidal shape. The further away from the center, the lower the number of fixations. The place located above the main concentration of fixations was the only exception, as an area that was smaller but with a high number of fixations. In the landscape version, the users’ gaze also focused on the central part of the screen and slightly below the geometric center of the display. Even though the distribution of the red area with the highest number of fixations has a semi-circular shape, one can still observe a slight elongation towards the ellipse (Figure 9B).
Due to significant differences in the time of completing paths 4–5 (Figure 7), we have analyzed the differences in visual strategy during moving between those two stone monuments (Figure 9C,D). The concentration of fixations on the choropleth map C is close to the total gameplay visible in visualization 9A. The deviation of the significant part of fixations toward the right side of the screen, both in portrait and in landscape orientation, constitutes the main difference, the reason for it being surely the fact that the user was moving from monument 4 (located in the most left part of the map, in the west) to monument 5 (located in the most right part of the map, in the east) (Figure 2). The places where concentration was the greatest oscillated at around 110,000 fixations, which constituted around 18% of fixations from the entire task.
The differences were also outlined in the analysis of the visual strategy research participants adopted for moving from monument 5 to monument 6 (Figure 7). For portrait orientation, fixations are concentrated slightly below the center of the screen along the vertical axis, forming the ellipsoidal shape (Figure 9E). There are extra hot spots of visual activity closer to the upper part of the screen, which may be related to moving toward monument 6 at the top (the north) of the map. On the other hand, in landscape orientation, extra hot spots are located closer to the bottom and the right part of the screen (Figure 9F).
The proportional point symbols map in Figure 10 represents the number of fixations on individual stone monuments while they were active in black, and the participant was moving toward that point. No. 2 was the most frequently observed point in portrait orientation (4.4 fixations on average) and point 3 in landscape orientation (4.9 fixations on average). In this aspect, the greatest difference between orientations occurs for monument 2. In portrait, while point 2 was active, it had 4.4 fixations on average, whereas in landscape, it had 3.1 fixations. Interestingly, monuments 1–4 had more than three fixations on average in both orientations, whereas other points had less than three fixations of the value of 2–3.
A comparative flow map (band cartodiagram) is the last statistical map, presenting the numerical load of individual road stretches (Figure 11). The number of walks down a specific stretch taken by 30 research participants in landscape orientation and by 30 participants in portrait orientation was presented from monument 1 to monument 8 in six classes. The maximum load for a single road stretch for one user is 7 and for 30 users is 210. To obtain the number of walks that participants took, stretches were labeled with two letters, e.g., AA. Each two-letter description is placed in the middle of the distance between nodes. We adapted this method of placing the description for sections from the description of the kilometers value in road maps. The roads have been divided into small sections according to road crossings, section length, and the location of the monument.
Based on the comparative flow map, a significant load of roads is visible in both orientations in the center of the area, between monuments 1-2-3 (Figure 11). Moreover, a similar load of road stretches between monuments 5–7 in the north and east of the area is visible in both versions. In landscape orientation stretches, BB, BC, BD, and BV report a greater load. Whereas, when it comes to portrait, it is typical to have a greater load on BU, BW, and BX. In the western part, in landscape orientation, the AP stretch has a significantly greater load than in portrait orientation. CI and CF stretches have a greater load in portrait orientation.

5. Discussion

The visual strategy of research participants that were doing a topographic task on the smartphone with portrait orientation is highly similar to the one applied in task-oriented monster elimination during the experience with mobile games [39]. Supposedly, it is also a strategy similar to observing one’s position and the elements that occur in a mobile car navigation. On the other hand, tasks related to navigation in topographic space in landscape orientation demonstrate a visual strategy focused on the central part of the screen. Certain similarities may also be observed in the research by Hejtmánek et al. [40], in which during navigation in a virtual city, the central part of the monitor in landscape orientation was the spot that the gaze was most focused on.
The difference in fixation distribution between tasks 1–8 and 4–5 may be explained by the fact that point 5 was located in the right part of the map. Hence, the greater the density of fixations on the right side of the smartphone screen. The situation is similar for the track between points 5 and 6 but only for landscape orientation. When it comes to the average number of fixations on individual points of the map, the smaller number of fixations on points 5 to 8 may result from having familiarized oneself with topographic space participants to a satisfactory degree. Time results seem to corroborate this, not showing any drop in the amount of time necessary to complete the task, whereas participants do not need to look at sequentially activating monuments that often anymore.
Figure 9. Heat map with participant fixation locations on smartphone: (A)—portrait orientation for the movement from monuments 1 to 8; (B)—landscape orientation for the movement from monuments 1 to 8; (C)—portrait orientation for the movement from monuments 4 to 5; (D)—landscape orientation for the movement from monuments 4 to 5; (E)—portrait orientation for the movement from monuments 5 to 6; (F)—landscape orientation for the movement from monuments 5 to 6.).
Figure 9. Heat map with participant fixation locations on smartphone: (A)—portrait orientation for the movement from monuments 1 to 8; (B)—landscape orientation for the movement from monuments 1 to 8; (C)—portrait orientation for the movement from monuments 4 to 5; (D)—landscape orientation for the movement from monuments 4 to 5; (E)—portrait orientation for the movement from monuments 5 to 6; (F)—landscape orientation for the movement from monuments 5 to 6.).
Ijgi 11 00577 g009
Figure 10. Proportional point symbols map with the presentation of the fixation on specific stone monuments.
Figure 10. Proportional point symbols map with the presentation of the fixation on specific stone monuments.
Ijgi 11 00577 g010
Figure 11. Comparative flow map with the presentation of the moving number along individual road sections (two-letter description of sections from AA to CR).
Figure 11. Comparative flow map with the presentation of the moving number along individual road sections (two-letter description of sections from AA to CR).
Ijgi 11 00577 g011
Each form of result analysis presents different similarities and differences but what is important is to use them in a complementary way [19]. In analyzing the fixation field deviation to the right from the center of the display in moving from monument 4 to 5, the heat map is not enough because it is only the comparison with the basic topographic map and the flow map that reveals the cause of the deviation. Hence, we can conclude that the area of high fixations is located slightly below the geometric center of the smartphone in the shape of the ellipse, significantly elongated vertically for portrait orientation, whereas for landscape orientation, there is little elongation. However, the direction of moving around on the map has a great impact on the deviation of the high fixations field. The effect of perceiving the symbol exactly in the optical center of the graphical image is one of the rules of map design that recommends placing the symbol in the optical center of the image, i.e., slightly above the geometric center. Therefore, it is worth considering whether one may apply this rule to influence the distribution of fixations.
The analysis of the load of individual stretches of the road made by means of a flow map proves that there are differences in the choice of the road between landscape and portrait orientation in the eastern part of the map. The track that is chosen more often in portrait orientation from monument 5 to monument 6 is a consequence of the screen orientation. The change of the screen orientation would lead to east–west road stretches being chosen more often than north–south stretches, which translated into slower times. In the western part of the field, a similar tendency occurs. In portrait orientation, the north–south stretches (CI and CF) have a definitely higher traffic load, whereas in landscape orientation, east–west stretches (AP and AF) were used more frequently. It has also been observed that individual research participants were wandering around vertically in landscape orientation because they reached CC, CA, BN, and BO stretches. It may result from the smartphone’s orientation. On the other hand, in portrait orientation, individual participants were wandering around horizontally, reaching CE, CH, and CM stretches in the west. In both orientations, research participants would wander around CR and CP stretch. Interestingly, in landscape orientation, no participant would enter stretches that were directed leftwards, i.e., CE, CH, or CM. What is convincing is the fact that, when moving around on frequented roads AV-CF-CI-CN, the participant would already see the edge of the frame enclosing the content of the map. The users of portrait orientation had an easier situation when it came to noticing the edge of the map at the top and at the bottom of the screen.
The implementation of the minimized touch interface that follows current tendencies in app design turned out to be a practical solution because no research participant would report any problems with moving around on the map by means of touch [41]. The elimination of joysticks and other buttons resulted in the participant’s focus solely on cartographic content. However, in some cases, it was necessary to remind participants that they were allowed to move around only on roads, which was not obvious to players. Probably a car or walker symbol would be more obvious to the player, but we assumed that we would use very simplified graphics.
The number of cartographic visualizations of results and their graphic complexity of form remains a topic to be discussed [38]. The opportunities of complementary partial analysis and full synthetic presentation of map use features have both effective and impressive aspects [42]. From the example of six heat maps, which can be analyzed separately but without being interpreted as a whole, it is not possible to draw more general conclusions, proving that fact. Comparative cartodiagrams have great advantages, but it is necessary to use a maximum of six ranges of the range scaling. The use of absolute scaling for the map of proportional point symbols may complicate the adjustment of the symbol’s size to the factual numerical value. The authors used uncomplicated graphic result mapping techniques because methods that are graphically attractive often fail to be effective enough for the proper interpretation of phenomena in geographical space.

6. Conclusions

To sum up the research, we can say that the concept of research suggested resulted in the demonstration of similarities and differences in usability on a simplified topographical 2D map on the smartphone in the landscape and portrait orientation:
Main similarity:
  • regardless of the orientation of the smartphone, participants completed the whole task at a similar time (this is the recommendation that both device orientations are adequate for presenting topographical space on a mobile phone);
Main differences:
  • both orientations implied different path selections (the recommendation is that the orientation of the smartphone has great importance to the better orientation on the north–south and the west–east axis);
  • both orientations implied different participants’ visual strategies (the recommendation is that the smartphone orientation should support the visibility of crucial information on the map).
Answering the questions raised at the beginning, we can conclude that interactive map design for smartphones should take place according to the rules of cartographic design and current IT trends to create a map application with gameplay elements. Such an approach applies both to designing the movement on the topographic graphics and obtaining data on movement in two smartphone orientations.
The presentation of data on how users move requires the employment of complementary cartographic methods. The application of a single representation method shows only one aspect of the issue, whereas using a few methods allows us to link the results together and demonstrate the broader spectrum of the problem of moving around on the map on the smartphone. The flow map, the proportional point symbols, and the heat map method turned out to be particularly useful.
In our study, we were attempting to solve a few problems related to the use of a traditional cartographic medium in the form of a 2D map in its geomedia extension on smartphones. We understand such a geomedia extension of the map’s functionality as the user’s opportunity to interactively move around the map’s content on the smartphone screen. ‘The voyage of a finger across the map’ has a new geomedia dimension nowadays. On a printed static map, a finger moves around on the roads, whereas in the research, the user’s fingers move around on the roads as the user is ‘anchored’ to the road in the middle of the smartphone display.
While users feel more comfortable in a portrait orientation of a smartphone, most vehicles have their screens in landscape format. This fact makes the development of research in the context of the usability of applications or cartographic products inevitable. The authors of this article hope that the obtained results may contribute to the development of research in this area and, consequently, lead to improvements in maps on various devices, not only smartphones. Future studies should consider conducting an experiment with both device orientations for both groups so that there would be feedback if the different orientation improves previous user experience.

Author Contributions

Conceptualization, Beata Medyńska-Gulij; data curation, Paweł Cybulski, Krzysztof Zagata, Jakub Zawadzki and Tymoteusz Horbiński; formal analysis, Beata Medyńska-Gulij, Paweł Cybulski, Krzysztof Zagata and Jakub Zawadzki; investigation, Paweł Cybulski, Krzysztof Zagata and Jakub Zawadzki; methodology, Beata Medyńska-Gulij, Jacek Gulij, Paweł Cybulski, Krzysztof Zagata and Tymoteusz Horbiński; project administration, Beata Medyńska-Gulij; resources, Beata Medyńska-Gulij, Jacek Gulij, Paweł Cybulski, Krzysztof Zagata, Jakub Zawadzki and Tymoteusz Horbiński; software, Beata Medyńska-Gulij, Jacek Gulij, Paweł Cybulski, Krzysztof Zagata, Jakub Zawadzki and Tymoteusz Horbiński; validation, Beata Medyńska-Gulij, Paweł Cybulski, Krzysztof Zagata and Tymoteusz Horbiński; visualization, Beata Medyńska-Gulij and Krzysztof Zagata; writing—original draft, Beata Medyńska-Gulij, Jacek Gulij, Paweł Cybulski, Krzysztof Zagata and Tymoteusz Horbiński; writing—review and editing, Beata Medyńska-Gulij. All authors have read and agreed to the published version of the manuscript.


This research received no external funding.

Data Availability Statement

Not applicable.

Conflicts of Interest

The authors declare no conflict of interest.


  1. Muehlenhaus, I. Internet mapping. In The Routledge Handbook of Mapping and Cartography; Kent, A.J., Vujakovic, P., Eds.; Routledge: London, UK, 2018; pp. 375–387. ISBN 9780367581046. [Google Scholar]
  2. Robinson, A.H.; Morrison, J.L.; Muehrecke, P.C.; Kimerling, A.J.; Guptil, S.C. Elements of Cartography, 6th ed.; Wiley: New York, NY, USA, 1995; ISBN 9788126524549. [Google Scholar]
  3. Kent, A.; Vujakovic, P. Cartographic Language: Towards a New Paradigm for Understanding Stylistic Diversity in Topographic Maps. Cartogr. J. 2011, 48, 21–40. [Google Scholar] [CrossRef]
  4. Medyńska-Gulij, B. Point Symbols: Investigating Principles and Originality in Cartographic Design. Cartogr. J. 2008, 45, 62–67. [Google Scholar] [CrossRef]
  5. Wood, C.H.; Keller, C.P. Cartographic Design: Theoretical and Practical Perspectives; Wiley: Chicherster, UK, 1996; pp. 1–10. ISBN 9780471965879. [Google Scholar]
  6. Spiess, E. Map compilation. In Basic Cartography: Volume Two. For Students and Technicians, 2nd ed.; Anson, R.W., Ormeling, F.J., Eds.; Butterworth-Heinemann: Oxford, UK, 2002; pp. 25–84. ISBN 9781851662326. [Google Scholar]
  7. Dent, B.D. Cartography: Thematic Map Design, 5th ed.; McGraw-Hill: Boston, CA, USA, 1999; ISBN 9780697384959. [Google Scholar]
  8. Lloyd, R. Attention on Maps. Cartogr. Perspect. 2005, 52, 28–57. [Google Scholar] [CrossRef]
  9. Medyńska-Gulij, B. How the Black Line, Dash and Dot Created the Rules of Cartographic Design 400 Years Ago. Cart. Graph. J. 2013, 50, 356–368. [Google Scholar] [CrossRef]
  10. Horbiński, T.; Zagata, K. View of Cartography in Video Games: Literature Review and Examples of Specific Solutions. KN J. Cartogr. Geogr. Inf. 2022, 72, 117–128. [Google Scholar] [CrossRef]
  11. Kapenekakis, I.; Chorianopoulos, K. Citizen science for pedestrian cartography: Collection and moderation of walkable routes in cities through mobile gamification. Hum. Cent. Comput. Inf. Sci. 2017, 7, 10. [Google Scholar] [CrossRef][Green Version]
  12. Lammes, S.; Wilmott, C. The map as playground: Location-based games as cartographical practices. Convergence 2018, 24, 648–665. [Google Scholar] [CrossRef][Green Version]
  13. Koulaxidis, G.; Xinogalos, S. Improving Mobile Game Performance with Basic Optimization Techniques in Unity. Modelling 2022, 3, 201–223. [Google Scholar] [CrossRef]
  14. Edler, D.; Keil, J.; Dickmann, F. From Na Pali to Earth—An ‘Unreal’ Engine for Modern Geodata? In Modern Approaches to the Visualization of Landscapes; Edler, D., Jenal, C., Kühne, O., Eds.; Springer: Wiesbaden, Germany, 2020; ISBN 9783658309558. [Google Scholar]
  15. Zaina, L.A.M.; de Mattos Fortes, R.P.; Casadei, V.; Nozaki, L.S.; Paiva, D.M.B. Preventing accessibility barriers: Guidelines for using user interface design patterns in mobile applications. J. Syst. Softw. 2022, 186, 111213. [Google Scholar] [CrossRef]
  16. Giurgiu, L.; Gligorea, I. Responsive Web Design Techniques. Int. Conf. Knowl. -Based Organ. 2017, 23, 37–42. [Google Scholar] [CrossRef]
  17. Horbiński, T.; Cybulski, P.; Medyńska-Gulij, B. Web Map Effectiveness in the Responsive Context of the Graphical User Interface. ISPRS Int. J. Geo-Inf. 2021, 10, 134. [Google Scholar] [CrossRef]
  18. Horbiński, T.; Cybulski, P. Similarities of global web mapping services functionality in the context of responsive web design. Geod. Cartogr. 2018, 67, 159–177. [Google Scholar] [CrossRef][Green Version]
  19. Halik, Ł.; Kent, A.J. Measuring user preferences and behaviour in a topographic immersive virtual environment (TopoIVE) of 2D and 3D urban topographic data. Int. J. Digit. Earth 2021, 14, 1835–1867. [Google Scholar] [CrossRef]
  20. Korycka-Skorupa, J.; Gołȩbiowska, I. Multivariate mapping for experienced users: Comparing extrinsic and intrinsic maps with univariate map. Misc. Geogr. 2021, 25, 259–271. [Google Scholar] [CrossRef]
  21. Medyńska-Gulij, B.; Zagata, K. Experts and Gamers on Immersion into Reconstructed Strongholds. ISPRS Int. J. Geo-Inf. 2020, 9, 655. [Google Scholar] [CrossRef]
  22. Wielebski, Ł.; Medyńska-Gulij, B.; Halik, Ł.; Dickmann, F. Time, Spatial, and Descriptive Features of Pedestrian Tracks on Set of Visualizations. ISPRS Int. J. Geo-Inf. 2020, 9, 348. [Google Scholar] [CrossRef]
  23. Cybulski, P. An Empirical Study on the Effects of Temporal Trends in Spatial Patterns on Animated Choropleth Maps. ISPRS Int. J. Geo-Inf. 2022, 11, 273. [Google Scholar] [CrossRef]
  24. Horbiński, T.; Zagata, K. Interpretation of Map Symbols in the Context of Gamers’ Age and Experience. ISPRS Int. J. Geo-Inf. 2022, 11, 150. [Google Scholar] [CrossRef]
  25. Edler, D.; Keil, J.; Tuller, M.-C.; Bestgen, A.-K.; Dickmann, F. Searching for the ‘Right’ Legend: The Impact of Legend Position on Legend Decoding in a Cartographic Memory Task. Cartogr. J. 2020, 57, 6–17. [Google Scholar] [CrossRef]
  26. Zagata, K.; Gulij, J.; Halik, Ł.; Medyńska-Gulij, B. Mini-Map for Gamers Who Walk and Teleport in a Virtual Stronghold. ISPRS Int. J. Geo-Inf. 2021, 10, 96. [Google Scholar] [CrossRef]
  27. Lee, E.C.; Park, M.W. A New Eye Tracking Method as a Smartphone Interface. KSII Trans. Internet Inf. Syst. 2013, 7, 834–848. [Google Scholar] [CrossRef]
  28. Qu, Q.X.; Zhang, L.; Chao, W.Y.; Duffy, V. User Experience Design Based on Eye-Tracking Technology: A Case Study on Smartphone APPs. In Advances in Applied Digital Human Modeling and Simulation; Duffy, V., Ed.; Springer: Cham, Switzerland, 2017; ISBN 9783319416267. [Google Scholar]
  29. Chynał, P.; Szymański, J.M.; Sobecki, J. Using Eyetracking in a Mobile Applications Usability Testing. In Intelligent Information and Database Systems; Pan, J.S., Chen, S.M., Eds.; Springer: Berlin/Heidelberg, Germany, 2012; ISBN 9783642284922. [Google Scholar]
  30. Calka, B.; Nowak Da Costa, J.; Bielecka, E. Fine scale population density data and it’s application in risk assessment. Geomat. Nat. Hazards Risk 2017, 8, 1440–1455. [Google Scholar] [CrossRef][Green Version]
  31. Dong, W.; Wang, S.; Chen, Y.; Meng, L. Using Eye Tracking to Evaluate the Usability of Flow Maps. ISPRS Int. J. Geo-Inf. 2018, 7, 281. [Google Scholar] [CrossRef][Green Version]
  32. Keskin, M.; Ooms, K.; Dogru, A.O.; De Maeyer, P. Exploring the Cognitive Load of Expert and Novice Map Users Using EEG and Eye Tracking. ISPRS Int. J. Geo-Inf. 2020, 9, 429. [Google Scholar] [CrossRef]
  33. Smaczyński, M.; Medyńska-Gulij, B.; Halik, Ł. The Land Use Mapping Techniques (Including the Areas Used by Pedestrians) Based on Low-Level Aerial Imagery. ISPRS Int. J. Geo-Inf. 2020, 9, 754. [Google Scholar] [CrossRef]
  34. Kent, A.J. Topographic Maps: Methodological Approaches for Analyzing Cartographic Style. J. Map Geogr. Libr. 2009, 5, 131–156. [Google Scholar] [CrossRef]
  35. Jelizakov, D. Mobile Usability Made Simple. 2019. Available online: (accessed on 5 July 2022).
  36. Gao, Y.; Li, A.; Zhu, T.; Liu, X.; Liu, X. How smartphone usage correlates with social anxiety and loneliness. PeerJ 2016, 4, e2197. [Google Scholar] [CrossRef][Green Version]
  37. Hoober, S. How Do Users Really Hold Mobile Devices. 2013. Available online: (accessed on 5 July 2022).
  38. Forrest, D. Thematic Maps in Geography. In International Encyclopedia of the Social & Behavioral Sciences, 2nd ed.; Wright, J.D., Ed.; Elsevier: Oxford, UK, 2015; ISBN 9780080970875. [Google Scholar]
  39. Jiang, J.-Y.; Guo, F.; Chen, J.-H.; Tian, X.-H.; Lyu, W. Applying Eye-Tracking Technology to Measure Interactive Experience Towards the Navigation Interface of Mobile Games Considering Different Visual Attention Mechanisms. Appl. Sci. 2019, 9, 242. [Google Scholar] [CrossRef][Green Version]
  40. Hejtmánek, L.; Oravcová, I.; Motýla, J.; Horáček, J.; Fajnerováa, I. Spatial knowledge impairment after GPS guided navigation: Eye-tracking study in a virtual town. Int. J. Hum.-Comput. Stud. 2018, 116, 15–24. [Google Scholar] [CrossRef]
  41. Christopoulou, E.; Xinogalos, S. Overview and Comparative Analysis of Game Engines for Desktop and Mobile Devices. Int. J. Serious Games 2017, 4, 21–36. [Google Scholar] [CrossRef]
  42. Wielebski, Ł.; Medyńska-Gulij, B. Graphically supported evaluation of mapping techniques used in presenting spatial accessibility. Cartogr. Geogr. Inf. Sci. 2019, 46, 311–333. [Google Scholar] [CrossRef]
Publisher’s Note: MDPI stays neutral with regard to jurisdictional claims in published maps and institutional affiliations.

Share and Cite

MDPI and ACS Style

Medyńska-Gulij, B.; Gulij, J.; Cybulski, P.; Zagata, K.; Zawadzki, J.; Horbiński, T. Map Design and Usability of a Simplified Topographic 2D Map on the Smartphone in Landscape and Portrait Orientations. ISPRS Int. J. Geo-Inf. 2022, 11, 577.

AMA Style

Medyńska-Gulij B, Gulij J, Cybulski P, Zagata K, Zawadzki J, Horbiński T. Map Design and Usability of a Simplified Topographic 2D Map on the Smartphone in Landscape and Portrait Orientations. ISPRS International Journal of Geo-Information. 2022; 11(11):577.

Chicago/Turabian Style

Medyńska-Gulij, Beata, Jacek Gulij, Paweł Cybulski, Krzysztof Zagata, Jakub Zawadzki, and Tymoteusz Horbiński. 2022. "Map Design and Usability of a Simplified Topographic 2D Map on the Smartphone in Landscape and Portrait Orientations" ISPRS International Journal of Geo-Information 11, no. 11: 577.

Note that from the first issue of 2016, this journal uses article numbers instead of page numbers. See further details here.

Article Metrics

Back to TopTop