Collapsible Tabbed Interface Ribbon Scrolling

Resolve Bottlenecks,
Find Innovative SolutionsGenerate Solutions

Solution Overview

Problem

It is challenging to port software applications from traditional desktop applications to Web-based applications due to limited space in Web browser windows, which are occupied by navigation controls and toolbars, making direct conversion of user interfaces difficult.

Innovation Solution

A collapsible tabbed user interface is implemented, allowing for the efficient use of space in Web browser windows by collapsing user interface controls when not needed, with a ribbon area and editing surface that can be scrolled out of view, while maintaining essential controls visible.

Engineering Contradictions & Design Principles

VSEngineering Contradiction Analysis

1Ease of operation

If user interface controls and toolbars are displayed in a Web browser window, then commands and information are accessible, but the usable display space is reduced

Engineering Contradiction:

Improveaccessibility of commandsVSAvoidusable display space

Core Design Contradiction:

Ease of operationVSArea of stationary object

Solution Approach 1:

The ribbon area is implemented as a dynamic, scrollable component that can be moved vertically within the browser window. When the editing surface requires more space, users can scroll the ribbon area out of view, effectively collapsing it to maximize editing space. This dynamic behavior allows the interface to adapt between showing comprehensive controls and maximizing display area.

Inventive Principle:

Principle #15Dynamics

Solution Approach 2:

The patent introduces vertical scrolling capability to the ribbon area, adding a dimensional solution to the space problem. Instead of horizontally expanding controls (which would further reduce space), the ribbon area utilizes the vertical dimension through scrolling, allowing controls to remain accessible while freeing horizontal and visible vertical space for the editing surface.

Inventive Principle:

Principle #17Another dimension (Dimensionality change)

2Area of stationary object

If the ribbon area is scrolled out of view to maximize editing space, then usable display space increases, but access to user interface controls becomes difficult

Engineering Contradiction:

Improveusable display spaceVSAvoidaccessibility of controls

Core Design Contradiction:

Area of stationary objectVSEase of operation

Solution Approach 1:

The ribbon area maintains scrollability even when positioned at the top of the editing surface. Users can scroll the ribbon area vertically to bring controls into view when needed, and scroll them out of view when maximum editing space is required. This dynamic scrolling capability ensures controls remain accessible without permanently occupying display space.

Inventive Principle:

Principle #15Dynamics

Solution Approach 2:

The scroll bar acts as an intermediary mechanism between the ribbon area controls and the editing surface. It enables users to navigate between viewing controls and maximizing editing space without losing access to either, mediating the conflict between control accessibility and display space utilization.

Inventive Principle:

Principle #24Intermediary (Mediator)

3Adaptability or versatility

If navigation controls and toolbars are included in a Web browser window, then the application is fully functional, but the window space available for application display is limited

Engineering Contradiction:

Improveapplication functionalityVSAvoidwindow space for application

Core Design Contradiction:

Adaptability or versatilityVSArea of stationary object

Solution Approach 1:

The patent merges the navigation controls and toolbars into a single integrated ribbon area that sits above the editing surface. This consolidation reduces the overall space required for controls compared to having separate navigation and toolbar elements, while maintaining full functionality. The merged ribbon area can then be scrolled as a unified component.

Inventive Principle:

Principle #5Merging (Combining)

Solution Approach 2:

The ribbon area is implemented as a dynamic, scrollable container that adjusts its visible presence based on user needs. When maximum editing space is required, the ribbon area can be scrolled completely out of view. When controls are needed, they can be scrolled back into position. This dynamic behavior allows the interface to be fully functional while minimizing permanent occupation of window space.

Inventive Principle:

Principle #15Dynamics

Data Source

PatentUS8296673B2Collapsible tabbed user interface

Publication Date: 2012.10.23 MICROSOFT TECHNOLOGY LICENSING LLC

AI summary

A tab-based collapsible user interface includes selectable user interface tabs, a ribbon area, and an editing surface. When a browse tab is selected, the ribbon area displays information and does not include any user interface controls for performing commands. When the browse tab is selected, a vertical scroll bar is displayed adjacent to the ribbon area and the editing surface. When the vertical scroll bar is used, the ribbon area and the editing surface are both scrolled. When a page tab or a contextual tab is selected, the ribbon area displays user interface controls for performing commands. When a page tab or a contextual tab is selected, a vertical scroll bar is displayed adjacent to the editing surface but not adjacent to the ribbon area. When the vertical scroll bar is used, the contents of the editing surface are scrolled but the ribbon area is not scrolled.