short-paper

Design space for focus+context navigation in web forms

Authors:

Johannes Harms,

Christoph Wimmer,

Thomas GrechenigAuthors Info & Claims

EICS '14: Proceedings of the 2014 ACM SIGCHI symposium on Engineering interactive computing systems

Pages 39 - 44

https://doi.org/10.1145/2607023.2610272

Published: 17 June 2014 Publication History

Abstract

Navigation in long forms commonly employs user interface design patterns such as scrolling, tabs, and wizard steps. Since these patterns hide contextual form fields outside the viewport or behind other tabs or pages, we propose to apply the focus+context principle from information visualization to form design. This work presents a design space analysis to support usability engineering of focus+context form navigation. We evaluated the design space's usefulness and applicability in a case study and found the design space has fostered creativity and helped to clearly document design decisions, indicating it can be a valuable support for engineering intelligent, form-based user interfaces.

References

[1]

Alexander, J., and Cockburn, A. An empirical characterisation of electronic document navigation. In Proc. Graphics Interface '08, Canadian Information Processing Society (2008), 123--130.

Digital Library

[2]

Anderson, C. R., Domingos, P., and Weld, D. S. Relational markov models and their application to adaptive web navigation. In Proc. Knowledge Discovery and Data Mining '02, ACM (2002), 143--152.

Digital Library

[3]

Bargas-Avila, J., Brenzikofer, O., Roth, S., Tuch, A., Orsini, S., and Opwis, K. Simple but crucial user interfaces in the world wide web: Introducing 20 guidelines for usable web form design. In User Interfaces, InTech, 2010, ch. 1.

[4]

Björk, S., and Redström, J. Redefining the focus and context of focus+context visualizations. In Proc. Information Vizualization '00, IEEE (2000), 85--89.

Digital Library

[5]

Blumendorf, M., Lehmann, G., and Albayrak, S. Bridging models and systems at runtime to build adaptive user interfaces. In Proc. EICS '10, ACM (2010), 9--18.

Digital Library

[6]

Brooke, J. SUS -- a quick and dirty usability scale. Usability evaluation in industry 189 (1996), 194.

[7]

Card, S., Mackinlay, J., and Shneiderman, B. Using Vision to Think. Morgan Kaufmann, 1999.

Digital Library

[8]

Card, S. K., and Nation, D. Degree-of-interest trees: a component of an attention-reactive user interface. In Proc. Advanced Visual Interfaces '02, ACM (2002), 231--245.

Digital Library

[9]

Chang, B.-W., Mackinlay, J. D., Zellweger, P. T., and Igarashi, T. A negotiation architecture for fluid documents. In Proc. UIST '98, ACM (1998), 123--132.

Digital Library

[10]

Chen, C., and Rada, R. Interacting with hypertext: a meta-analysis of experimental studies. Hum.-Comput. Interact. 11, 2 (June 1996), 125--156.

Digital Library

[11]

Cockburn, A., Karlson, A., and Bederson, B. B. A review of overview+detail, zooming, and focus+context interfaces. ACM Comput. Surv. 41, 1 (Jan. 2009), 2:1--2:31.

Digital Library

[12]

Cockburn, A., Quinn, P., Gutwin, C., and Fitchett, S. Improving scrolling devices with document length dependent gain. In Proc. CHI '12, ACM (2012), 267--276.

Digital Library

[13]

Couper, M. P., Baker, R., and Mechling, J. Placement and design of navigation buttons in web surveys. Survey Practice 4, 1 (2013).

[14]

Dillon, A., McKnight, C., and Richardson, J. Navigation in hypertext: A critical review of the concept. In Proc. INTERACT '90, North-Holland (1990), 587--592.

Digital Library

[15]

Dork, M., Lam, H., and Benjelloun, O. Accentuating visualization parameters to guide exploration. In CHI'13 Extended Abstracts, ACM (2013), 1755--1760.

Digital Library

[16]

Dørum, K., and Garland, K. Efficient electronic navigation: A metaphorical question? Interacting with Computers 23, 2 (2011), 129--136.

Digital Library

[17]

Findlater, L., Moffatt, K., McGrenere, J., and Dawson, J. Ephemeral adaptation: The use of gradual onset to improve menu selection performance. In Proc. CHI '09, ACM (2009), 1655--1664.

Digital Library

[18]

Furnas, G. A fisheye follow-up: further reflections on focus + context. In Proc. CHI '06, ACM (2006), 999--1008.

Digital Library

[19]

Furnas, G. W. Effective view navigation. In Proc. CHI '97, ACM (1997), 367--374.

Digital Library

[20]

Guiard, Y., Du, Y., and Chapuis, O. Quantifying degree of goal directedness in document navigation: application to the evaluation of the perspective-drag technique. In Proc. CHI '07, ACM (2007), 327--336.

Digital Library

[21]

Harms, J. Research goals for evolving the "form" user interface metaphor towards more interactivity. In Human Factors in Computing and Informatics, vol. 7946 of LNCS. Springer, 2013, 819--822.

[22]

Hook, K., and Svensson, M. Evaluating adaptive navigation support. In Social Navigation of Information Space, Computer Supported Cooperative Work. Springer, 1999, 237--249.

[23]

Jarrett, C., and Gaffney, G. Forms that work: designing web forms for usability. Morgan Kaufmann, 2008.

Digital Library

[24]

MacLean, A., Young, R. M., and Moran, T. P. Design rationale: the argument behind the artifact. SIGCHI Bull. 20, SI (Mar. 1989), 247--252.

Digital Library

[25]

Malinowski, U. Adjusting the presentation of forms to users' behavior. In Proc. IUI '93, ACM (1993), 247--249.

Digital Library

[26]

Malinowski, U., Kühme, T., Dieterich, H., and Schneider-Hufschmidt, M. A taxonomy of adaptive user interfaces. In Proc. HCI '92, Cambridge University Press (1993), 391--414.

Digital Library

[27]

Mayhew, D. J. The Usability engineering lifecycle: A practitioner's handbook for user interface design. Morgan Kaufmann, 1999.

Digital Library

[28]

Mizoguchi, K., Sakamoto, D., and Igarashi, T. Overview scrollbar: A scrollbar showing an entire document as an overview. In Human-Computer Interaction -- INTERACT 2013, vol. 8120 of LNCS. Springer, 2013, 603--610.

[29]

Nielsen, J. The matters that really matter for hypertext usability. In Proc. HYPERTEXT '89, ACM (1989), 239--248.

Digital Library

[30]

Pilgrim, C. J. Website navigation tools -- a decade of design trends 2002 to 2011. In Australasian User Interface Conference (AUIC 2012), vol. 126 of CRPIT, ACS (2012), 3--10.

Digital Library

[31]

Rummel, B. System usability scale (translated into german). www.sapdesignguild.org/resources/sus.asp, last retrieved March 12th, 2014.

[32]

Spence, R. A framework for navigation. Int. J. Human-Computer Studies 51, 5 (1999), 919--945.

Digital Library

[33]

Tomasic, A., Cohen, W., Fussell, S., Zimmerman, J., Kobayashi, M., Minkov, E., Halstead, N., Mosur, R., and Hum, J. Learning to Navigate Web Forms. In Workshop on Information Integration on the Web (2004).

[34]

Vainio, T. A review of the navigation HCI research during the 2000's. Int. J. Interactive Mobile Technologies 4, 3 (2010), 36--42.

[35]

Woods, D. D. The price of flexibility. In Proc. IUI '93, ACM (1993), 19--25.

Digital Library

[36]

Wroblewski, L. Web Form Design. Filling the Blanks. Louis Rosenfeld, 2008.

Digital Library

Cited By

Chiou PAlotaibi AHalfond W(2023)BAGEL: An Approach to Automatically Detect Navigation-Based Web Accessibility Barriers for Keyboard UsersProceedings of the 2023 CHI Conference on Human Factors in Computing Systems10.1145/3544548.3580749(1-17)Online publication date: 19-Apr-2023
https://dl.acm.org/doi/10.1145/3544548.3580749
Ferner BGåsøy ANicolaysen MSandnes F(2023)A Comparison of Form Navigation with Tabbing and PointingUniversal Access in Human-Computer Interaction10.1007/978-3-031-35681-0_20(311-318)Online publication date: 9-Jul-2023
https://doi.org/10.1007/978-3-031-35681-0_20

Index Terms

Design space for focus+context navigation in web forms
1. Applied computing
  1. Document management and text processing
    1. Document preparation
      1. Multi / mixed media creation
2. Human-centered computing
  1. Human computer interaction (HCI)
    1. Interaction paradigms
      1. Hypertext / hypermedia

Recommendations

EncCon: an approach to constructing interactive visualization of large hierarchical data

This paper describes a new technique called EncCon for visualizing and navigating large hierarchical information. This technique consists of two components: visualization and navigation. Visualization uses a fast enclosure+ connection method to ...
A Focus + Context Technique for Visualizing a Document Collection
HICSS '12: Proceedings of the 2012 45th Hawaii International Conference on System Sciences

Investigative analysts need overviews of large amounts of data, which is a challenge when working with non-numerical data such as document collections. We present Semantic Zoom View (SZV), an interactive document collection visualization implemented as ...
A Focus+Context Visualization Technique Using Semi-Transparency
CIT '04: Proceedings of the The Fourth International Conference on Computer and Information Technology

This paper describes a new 2D focus+context visualization technique for viewing and navigating large hierarchical information. This technique uses a semi-transparency approach to display both the global and the detail views of the hierarchy with an ...

Comments

Please enable JavaScript to view thecomments powered by Disqus.

Information & Contributors

Information

Published In

cover image ACM Conferences

EICS '14: Proceedings of the 2014 ACM SIGCHI symposium on Engineering interactive computing systems

June 2014

312 pages

ISBN:9781450327251

DOI:10.1145/2607023

Conference Chair:
Fabio Paternò
CNR-ISTI, Italy
,
Publications Chairs:
Carmen Santoro
Carmen Santoro (CNR-ISTI, Italy
,
Jürgen Ziegler
University of Duisburg-Essen, Germany

Copyright © 2014 ACM.

Permission to make digital or hard copies of all or part of this work for personal or classroom use is granted without fee provided that copies are not made or distributed for profit or commercial advantage and that copies bear this notice and the full citation on the first page. Copyrights for components of this work owned by others than the author(s) must be honored. Abstracting with credit is permitted. To copy otherwise, or republish, to post on servers or to redistribute to lists, requires prior specific permission and/or a fee. Request permissions from [email protected].

Sponsors

AOSA: Aspect-Oriented Software Association
SIGCHI: ACM Special Interest Group on Computer-Human Interaction

Publisher

Association for Computing Machinery

New York, NY, United States

Publication History

Published: 17 June 2014

Permissions

Request permissions for this article.

Request Permissions

Check for updates

Author Tags

Qualifiers

Short-paper

Conference

EICS'14

Sponsor:

AOSA
SIGCHI

EICS'14: ACM SIGCHI Symposium on Engineering Interactive Computing Systems

June 17 - 20, 2014

Rome, Italy

Acceptance Rates

EICS '14 Paper Acceptance Rate 16 of 88 submissions, 18%;

Overall Acceptance Rate 73 of 299 submissions, 24%

Upcoming Conference

Contributors

Other Metrics

View Article Metrics

Bibliometrics & Citations

Bibliometrics

Article Metrics

2
Total Citations
View Citations
249
Total Downloads

Downloads (Last 12 months)7
Downloads (Last 6 weeks)2

Reflects downloads up to 20 Nov 2024

Other Metrics

View Author Metrics

Citations

Cited By

Chiou PAlotaibi AHalfond W(2023)BAGEL: An Approach to Automatically Detect Navigation-Based Web Accessibility Barriers for Keyboard UsersProceedings of the 2023 CHI Conference on Human Factors in Computing Systems10.1145/3544548.3580749(1-17)Online publication date: 19-Apr-2023
https://dl.acm.org/doi/10.1145/3544548.3580749
Ferner BGåsøy ANicolaysen MSandnes F(2023)A Comparison of Form Navigation with Tabbing and PointingUniversal Access in Human-Computer Interaction10.1007/978-3-031-35681-0_20(311-318)Online publication date: 9-Jul-2023
https://doi.org/10.1007/978-3-031-35681-0_20

View Options

Login options

Check if you have access through your login credentials or your institution to get full access on this article.

Full Access

Get this Publication

View options

PDF

View or Download as a PDF file.

eReader

View online with eReader.

Media

Figures

Other

Tables

View Table of Contents