Overview “vs” Detail on mobile devices: a struggle for screen space

Overview & Detail is a visualization technique suitable for finding points of interest (POIs) located outside the detailed view. In this study we aim to analyze the effects of the size of the overview on the users’ performance on mobile devices. For that purpose we compared three different interfaces, a traditional one, with smaller dimensions overlaying the detailed view; a larger overview, yet not overlaying the detailed view; and one with a resizable overview. Our results show the users’ preference for a resizable overview and for a larger, non-overlapping overview.


INTRODUCTION
With the constant evolution of technology, handheld devices have conquered an important position on most users' daily activities.Nowadays, mobile devices are powerful enough to display and allow the interaction with large amounts of information in several visualization contexts, such as the search for POIs (Points of Interest) in thematic maps.However, mobile devices still have several restrictions; some of them likely to persist, namely the small dimensions of their screens.Consequently, the available viewing area is, sometimes, not large enough to accommodate all the information required and, therefore, some tends to be placed off-screen.In these situations, it is crucial to provide clues about the existence of that hidden information.
The literature proposes some approaches to mitigate this problem, namely, Pan & Zoom actions (Cockburn et al. 2003), Contextual Clues, Focus & Context techniques (Gustafson et al., 2008) and Overview & Detail (Burigat et al., 2011a).This paper is focused on the Overview & Detail technique.Despite being a well known technique in desktop applications, their adoption in mobile applications is scarce.This technique, commonly used in desktop applications for the visualization of geographic information and video-games, consists in the simultaneous use of one or multiple overviews of the information space, frequently, as a small-scale thumbnail, overlapping a detailed view, usually highlighted on the overview, as the viewfinder (Figure 1).Typically, there is a tight coupling between the two views, i.e. when changing the detailed view's position, usually with panning or zooming operations, the viewfinder on the overview changes accordingly.Similarly, if the position of the viewfinder is changed, the visualization on the detailed view is also changed.

Figure 1: Overview & Detail technique
Overview & Detail interfaces usually offer the following benefits: more efficient navigation through the use of the viewfinder instead of the detailed view; aiding users keeping track of their current position, through the use of the viewfinder's position; providing relevant information for the user's current task; giving the user a greater feeling of control of the navigation process (Hornbaek et al., 2002).However, it also presents some disadvantages, namely: the simultaneous use of two views may require a greater physical and mental effort, since it is necessary to indirectly link information from two differently scaled views; the use of an overview reduces the available space and it may be intrusive as some information on the detailed view might be hidden behind the overview; Overview "vs" Detail on mobile devices: a struggle for screen space Gonçalves, Afonso, Carmo, Pombinho the small size of the overview, and therefore its small level of detail may inhibit a good visualization and its understanding (Burigat et al., 2008, Chittaro, 2006).
Our study focuses on the two last mentioned problems, aiming to understand if the size of the overview has any significant effect on the user's efficiency (how fast does the user complete a task?) and effectiveness (how many errors does the user commit during the task?).Indeed, this problem received little attention by the mobile community, despite the existence of several comparative studies with Overview & Detail interfaces (Burigat et al., 2011b).Therefore, this study points out open issues and it aims to help mobile designers to decide upon a proper Overview & Detail interface.For this purpose, we have analysed three different approaches for this technique and performed a user study with 30 volunteers.In the following, we describe in detail the interfaces considered for the experiment.Then, we explain the details of the user study, followed by the analysis and discussion of the results.Finally, we point out our main conclusions and future work.

CONSIDERED INTERFACES
Figure 2 shows the three considered interfaces in our study.The first interface (Figure 2a), "Classic Overview", follows the most usual approach to the Overview & Detail technique.In this interface, the detailed view is overlaid by an overview that consists of a small-scaled thumbnail that highlights the detailed view's position by the use of the viewfinder.Also, like in the detailed view, the overview contains a thematic layer with the distribution of all POIs contained on the information space (Burigat et al., 2011b).The POIs displayed on both layers are adapted according with their relevance (Reichenbacher, 2007), by the use of a colour and transparency code (Gonçalves et al., 2011).Besides, we have considered that the context of visualization is limited to that of the information space, i.e. the geographical area where the queried POI can be found.Additionally, as suggested in previous studies (Burigat et al., 2011b), to improve the user's efficiency, the viewfinder is customizable, allowing the user to drag and select its relative position inside the overview and, therefore, the geographical position of the detailed view.Finally, unlike most approaches, we placed the overview on the upper left corner, rather than one of the lower corners of the screen.This was done to prevent interaction errors and optimize the visualization of the overview, since the lower borders of current touchscreen mobile devices tend to be the most used areas.In the second interface (Figure 2b), "Split-Screen", the screen area is divided into two non-overlapping views.Consequently, although this means that less space is used for the detailed view, the overview's larger size provides a visualization with more detailed context and, since there are no overlapping views, it is assured that all POIs visible on the viewfinder are never located behind the overview.Finally, it is expected that the size of the overview and the detailed view is task dependent (Plaisant et al., 1995).Therefore, the third interface (Figures 2c and 2d), "Resizable", allows resizing the overview and, consequently, the detailed view, by holding and dragging the square at the lower right corner of the overview.According with the size, the overview will adapt its visualization in order to always present the highest possible level of detail and scale.When the overview's width matches the screen's width, the interface will adapt itself to prevent the overlapping of views, similarly to the Split-Screen interface.The main benefit of this interface consists on the freedom given to the user, since it allows using any of the previously mentioned approaches, including hiding the overview (Figure 2c), nearly on-the-fly.Nevertheless, by giving too many choices, the users may end up choosing an interface that is not as helpful as desired, or get distracted by focusing their attention on resizing the overview, rather than on their current task.

USER STUDY
We conducted a comparative user study to evaluate the potential differences on users' efficiency and effectiveness using the three described interfaces.Based on each interface's features, our hypotheses are the following: Due to the freedom provided, by the resizing of the overview, it is expected that the users prefer the Resizable interface; moreover, it is also expected that the Split-Screen interface is preferred over the Classic Overview, because its overview does not overlap the detailed view; (ii) For the same reason, it is expected that, in tasks with the Resizable interface, the users choose a non-overlaid interface, by resizing the overview to a similar size of the one on the Split-Screen interface; (iii) It is expected that the users are less accurate with the Classic interface than with the Split-Screen, since the overview of the first presents the information with lesser detail than the second; (iv) It is expected that, with the Resizable interface, the users take more time to finish the tasks, yet committing less errors, due to the possibility of customizing the overview; (v) Since the Split-Screen interface provides a larger area to drag the viewfinder, it is expected that the users interact more with the overview of the Split-Screen interface, rather than the one on the Classic interface.

Participants and Materials
The study had the participation of 30 volunteers (20 male, 10 female), with ages ranging from 18 to 53, averaging 28.27 had some previous experience with geographic visualization applications; 22 had some experience with mobile applications, four of them using them frequently, while the others just occasionally.The study was carried out on a touchscreen HTC Desire, running the Android OS 2.2, featuring a 1GHz processor and a 3.7-in touch screen with a 480x800 resolution.

Tasks
To test our hypotheses, the users were asked to perform three tasks with the three described interfaces.The first task was an Order task, where each user was asked to select, on the detailed view, all the highly relevant POIs (10 POIs out of 40) from the one closest to the user's represented location, to the furthest.The users had to tap on the POI's graphical representation.This task combines a simple, yet common, action done by any user, i.e. to find the closest POI to their location, with a complex spatial task that requires the comparison of the distance to the off-screen POIs while keeping the context of visualization.The second and third tasks concerned the exploration and memorization of the POIs' locations.In the second task (Explore), the users were asked to select all highly relevant POIs on the map and to memorize their approximated location (2 POIs out of 10).In the third task (Recall), the users had to select, on the detailed view, the location of the POIs selected on the previous task.Although this task does not require the comparison of distances, nor other characteristics from the POIs, but their relevance, it requires that the users create a "mental map" of the information space.

Experimental design and procedure
All participants carried out the experiment individually, at a location of their choice.At the beginning of the study they were briefed about the objective of the experiment and provided with an explanation and a demonstration for each interface.
Before carrying out each task, they were presented with a training task to allow them to familiarize with the interface and the device itself and to clarify any doubts concerning the tasks.
After the training phase, the users carried out the tasks with the three interfaces.To mitigate sequence effects, on each task, the order of presentation of the interfaces was counterbalanced using a Latin-square design.Each Explore task was immediately followed by its Recall task counterpart, to prevent users from mistaking the locations of the different configurations.Additionally, in the Recall task, the starting size for the Overview is the same as the last used on the Explore task.At the end of each task, the users were asked to express their opinions, to report their experience with the interfaces and to order them, according with their preferences.
To prevent learning effects, three different map configurations were used, on the Order and Exploration tasks, one per interface.Configurations were kept as similar as possible in terms of POI distribution and distance between them.Additionally, to prevent any indirect influence regarding the size of the overview with the Resizable interface, at the beginning of each task, the overview was hidden at the upper left corner of the screen (Figure 2c).The users were notified about that.
For each user and for all tasks the following parameters were logged: task completion time; number of panning operations, on the detailed view and on the overview; average size used for the overview; number of overview resizes.For the Order task it was also logged the number of POIs incorrectly selected (i.e. points that were not the closest to the user's position); while on the Recall task it was logged the user's accuracy, i.e. the distance of the selected position to the actual POI target.

Task completion times
Figure 3 shows the mean times for the completion for each task.Task completion times were subject to the Shapiro-Wilk test of normality.As the test revealed some deviations from the normal distribution, the data was normalised using a logtransformation.An ANOVA test with repeated measures was then applied to the normalised data.In the Order task, although the users seemed to have taken longer to finish the task with the Split-Screen interface, no significant difference was revealed by the ANOVA test.
In the Explore task, ANOVA revealed a significant difference in the variation (F = 9.895, p < 0.005).Using the Bonferroni test for pairwise comparisons, a significant difference was revealed between the Resizable interface and both the Classic and Split-Screen interfaces (p = 0.046 and p = 0.001, respectively).On the Recall task, however, no significant differences were detected.

Errors and Accuracy
The Shapiro-Wilk test revealed deviations from a normal distribution for the error data of the Order Task (Figure 4a).As no transformation done could normalize the data, we used Friedman's test to analyze the errors committed, which revealed a significant difference between the mean results (p < 0.005).Then, we applied the Wilcoxon Signed Rank test for pairwise comparisons, revealing a significant difference between the Resizable interface and the others (p < 0.005 in both).
Similarly, the same process was used to the mean distance errors on the Recall task (Figure 4b), where an error for each user was measured as the average of the distance (in meters) between the location indicated by the user and the correct location for the two target points.However, no statistical significance was detected.

User actions
We analyzed the differences between the rates of use of the detailed view compared with the ones of the overview, in the three interfaces (Figure 5).As the Shapiro-Wilk test for normality revealed deviations from a normal distribution and no transformation done could normalize the data, Friedman's test was used to investigate the differences between the data.Only the Order task revealed statistically significant results (p = 0.007).The Wilcoxon Signed Rank test for pairwise comparisons revealed significant differences between the Classic and Split-Screen interfaces, and between the Classic and Resizable interfaces (p = 0.041 and p = 0.008, respectively).Then, we analyzed the number of overview resize actions performed with the Resizable interface (Figure 6).As no user performed any resize operation during the Recall task, we used the Wilcoxon Signed Rank test to compare the mean results obtained from the Order task with those of the Explore task which revealed a significant difference (p = 0.016).

Average Overview Size
Table 1 shows the average dimension of the overview used, on each task, with the Resizable interface.The screen's resolution is 480x800 pixels and the overview of the Classic interface has a dimension of 240x240 pixels.For each task, the Shapiro-Wilk test for normality was used on both the average width and height used revealing small deviations from a normal distribution.Therefore, the data was normalized using a logtransformation.Then an ANOVA test with repeated measures was used, only revealing a statistically significant difference on the average height used (F = 5.44, p = 0.005).Using a Bonferroni test for multiple comparisons, a significant difference between the Order and Explore tasks was revealed (p = 0.025) as well as between the Explore and Recall tasks (p < 0.005).Table 2 shows the rate of the use of a non-overlapping overview with the Resizable interface (i.e. an overview with a width as large as the screen).Friedman's test was used to compare the results of the different tasks, not revealing any statistically significant difference.

Users' preferences
To analyze the users' preferences, we ranked the interfaces according with the order they provided at the end of the study (Figure 7).As the Shapiro-Wilk test for normality showed deviations from a normal distribution, we used Friedman's test to compare the data.The test revealed a statistically significance between the groups (p < 0.005).Performing a Wilcoxon test for pairwise comparison revealed a statistically significant difference between all pairs (p = 0.002 for the Classic and Split-Screen interfaces; p < 0.001 for the Classic and Resizable interfaces and p = 0.001 for the Split Screen and the Resizable interfaces).

DISCUSSION
Overall the results of this experiment partially confirm four out of five hypotheses.Globally, users showed positive feedback and preferred the Resizable interface over the others.This result is not surprising, as this interface allows the use of any of the other interfaces.Additionally, comparing the Split-Screen with the Classic interface, the majority of users has shown preference for the Split-Screen.According with their feedback, this difference is based on the fact that, with a Split-Screen interface, the overview does not overlap the detailed view and allows the context to be shown with a larger level of detail, even if taking more screen space.Interestingly, two users commented that the "like centred" overview on the top of the screen helped them to perform better in the tasks.This comment needs further evaluation, though it is still worth mentioning.Overall, these results support our first hypothesis.
Analysing the average size used for the overview and the rate of use of a non-overlapping overview, with the Resizable interface, suggests the users' interest on a non-overlapping overview, and/or with larger dimensions than those of the Classic interface.Therefore, these results support our second hypothesis.
Comparing the task completion times on the various tasks, we observe that, in the Explore task, the users took longer to finish the task with the Resizable overview.It was an expected result, considering the need to resize the overview, at the beginning of the task as well as during the task.On the other hand, comparing the errors committed in the Order task, there is a significantly smaller amount of errors with the Resizable interface.
Judging by the users' comments, the possibility of resizing the overview actively helped them comparing the distance between the POIs.These comments are supported by the significantly larger number of overview resizing operations on this task, rather than the others.These last results support only partially our fourth hypothesis, since these results were not observed in all tasks.
Analysing the users' actions, in terms of panning operations, it reveals, in the Order task, that a larger overview facilitates the interaction with the viewfinder, which has positive effects on users' performance (Burigat et al., 2011b).This is supported by the observation of a significantly larger use of the overview to navigate with the Split-Screen interface than with the Classic interface.These results support our fifth hypothesis.In fact, 10 users specifically commented that, since the overview was smaller in the Classic interface, it was harder for them to manipulate the viewfinder.Additionally, four of them proposed that rather than dragging the viewfinder, the user could just tap on the overview to select the position of the viewfinder.
Finally, contrary to our third hypothesis, there was no significant difference in terms of accuracy, on the Recall task.In fact, only 8 users pointed that the use of a larger overview helped them perform in the task, as they could get more reference points from the overview.Overall, according with the users' feedback, their strategy was similar: use first the overview to know the approximated location of the POI and then, if needed, use some landmark on the detailed view as reference to obtain a more precise location.This can lead us to conclude that for tasks that require the memorization of locations, the detailed view may compensate the overview's size, but this assumption would require further investigation.

CONCLUSIONS
In this study we analysed the effects of the overview size on the users' effectiveness and efficiency and compared three different approaches for the Overview & Detail interface on mobile devices.The results highlight the users' preference for the use of a resizable, as well as a nonoverlapping overview.However, despite these characteristics, no significant difference was detected in terms of efficiency, unless for simple exploration tasks, and in terms of accuracy, on memorization tasks.On the other hand, according with the users' feedback and their actions during the tasks, the use of a resizable overview can be a relevant factor for a better effectiveness, on complex tasks, where the user is required to perform several comparisons between the POIs on the thematic map.Finally, the results also reveal a significantly larger use of the overview to navigate through the information space, in comparison with a smaller one, on complex tasks.Based on these results, an important guideline for mobile interface design that requires this technique is the use of a customizable overview.Nevertheless, the knowledge about this technique on mobile applications is still limited and there are some open questions.In future studies, we want to compare other methods of interaction with the overview, besides dragging the viewfinder; and to study the possible benefits of the use of distance clues on the overview.Also, as in this study we used a limited context of visualization, we would like to study these effects on a non-limited context, like the one used on Google Maps.

Figure 2 :
Figure 2: Considered interfaces for the study.a) Classic Overview & Detail interface b) Split-Screen interface c) Resizable interface hidden d) Resizable interface with custom dimensions

Figure 7 :
Figure 7: Mean preference for each interface

Table 1 :
Mean overview size used on each task with the Resizable interface

Table 2 :
Rate of use of a non-overlapping overview with the Resizable interfaceRate of use (%)Task