Vertical Timeline Product Page Layout for E-Commerce
Find Innovative SolutionsGenerate Solutions
Solution Overview
Problem
E-commerce web pages often present product information in a way that discourages users from scrolling down, leading to missed information such as product tiles and reviews, which are typically located below the initial viewable area of a conventional display monitor.
Innovation Solution
Designing product web pages with a high aspect ratio (at least 4:1) and strategically placing product tile arrays and review sections below the initial scroll position, encouraging users to scroll down and increasing the visibility of relevant information, while incorporating features like rotating carousels and tri-column formats to present topical information and recommendations.
Engineering Contradictions & Design Principles
Engineering Contradiction Analysis
1Loss of information
If product information is placed in the initial viewable area of the web page, then users can quickly access main product details, but important information such as product tiles and reviews are missed because users do not scroll down
Solution Approach 1:
The patent transforms the traditional horizontal scrolling web page layout into a vertical timeline layout where product information is arranged chronologically from top to bottom. This dimensional change in information presentation encourages users to scroll vertically through the timeline to discover complete product information including reviews and comparable products, thereby reducing information loss while maintaining ease of operation through intuitive vertical navigation
Solution Approach 2:
The patent creates a compelling visual timeline structure with clear chronological markers and engaging product imagery that preliminarily captures user attention and motivates them to scroll through the entire page. The timeline design with progressive disclosure of information keeps users engaged throughout the scroll journey, ensuring they view all product information including reviews and comparable products before making purchasing decisions
2Reliability
If the web page contains comprehensive product information including reviews and comparable products, then user decision-making is improved, but the page becomes longer and users are less likely to view content below the fold
Solution Approach 1:
The patent segments comprehensive product information into distinct chronological segments along the timeline, with each segment representing a specific moment or aspect of the product journey. This segmentation allows users to quickly scan through different information types (reviews, specifications, comparable products) at their own pace, improving decision-making quality while maintaining efficient information consumption through the structured temporal organization
Solution Approach 2:
The patent applies local quality by giving different visual emphases to different types of information segments along the timeline. Important decision-making elements such as user reviews and comparable products receive prominent visual treatment at their specific temporal positions, while less critical information has reduced visual weight. This allows comprehensive information to be presented without overwhelming users, as each section has appropriately calibrated visual importance
3Ease of operation
If product tile arrays are placed below the initial scroll position to encourage scrolling, then user engagement with all content increases, but users may miss important product comparisons if they do not scroll
Solution Approach 1:
The patent places comparable products and product tile arrays at specific chronological positions along the vertical timeline rather than confining them to the bottom of the page. This dimensional repositioning allows these important comparison elements to appear at multiple strategic points throughout the scroll journey, ensuring they are visible to engaged users while still encouraging scrolling through the timeline structure. The temporal dimension of the timeline ensures comparable products are encountered naturally during the user's information-gathering process
Data Source
AI summary
In some implementations, a product category web page includes a middle region with recommend products and topical information. The middle region optionally includes three columns with recommend products in the center column and topical information in the outer columns. In some implementations, the topical information is associated with the product category. The topical information in certain embodiments helps a search engine determine product results for a natural language query and the product results are presented in the product tile array. In one implementation, the product web page is a product specific web page. The product specific web page may include an upper region with a horizontal rotating product carousel. The product carousel optionally permits a user to select and view information relating to products in a product category or products that are related to each other.