Eureka AIR delivers breakthrough ideas for toughest innovation challenges, trusted by R&D personnel around the world.

Three-dimensional webpage design method and device

A web design, three-dimensional technology, applied in computing, website content management, network data retrieval and other directions, can solve the problems of large browser kernel changes, browser kernel changes, low experience, etc., to reduce redundant computing, improve Experience, Ease of Use

Active Publication Date: 2015-09-16
PEKING UNIV SHENZHEN GRADUATE SCHOOL
View PDF8 Cites 8 Cited by
  • Summary
  • Abstract
  • Description
  • Claims
  • Application Information

AI Technical Summary

Problems solved by technology

After opening, the user needs to operate to generate a 3D image. The process is cumbersome and the experience is not high.
[0006] 3. The method based on HTML, CSS, and JavaScript standard extensions conforms to the traditional web interface design habits, but the extension of this method leads to major changes in the browser kernel
[0007] Therefore, the design method of the three-dimensional webpage in the prior art requires relatively large changes to the browser kernel, and most of them require the user to perform operations such as follow-up startup during use, which brings inconvenience in use.

Method used

the structure of the environmentally friendly knitted fabric provided by the present invention; figure 2 Flow chart of the yarn wrapping machine for environmentally friendly knitted fabrics and storage devices; image 3 Is the parameter map of the yarn covering machine
View more

Image

Smart Image Click on the blue labels to locate them in the text.
Viewing Examples
Smart Image
  • Three-dimensional webpage design method and device
  • Three-dimensional webpage design method and device
  • Three-dimensional webpage design method and device

Examples

Experimental program
Comparison scheme
Effect test

Embodiment 1

[0033] Please refer to figure 1 , figure 1 It is a flow chart of the method in Embodiment 1 of the present invention. Such as figure 1 As shown, a three-dimensional web page design method may include the following steps:

[0034] 101. Receive an externally input corresponding anchor point set for a webpage element in a preset global three-dimensional container.

[0035] One anchor point may correspond to one web page element, or one anchor point may correspond to multiple web page elements. The number and location of anchor points can be set by developers according to actual needs, which is not limited in this embodiment of the present invention.

[0036] 102. According to the coordinates of the corresponding anchor points in the global three-dimensional container, locate the webpage element in the global three-dimensional container, and obtain the positioning coordinates and the depth value of the webpage element.

[0037] It can be understood that images with stereoscop...

Embodiment 2

[0052] Please refer to figure 2 , figure 2 It is a flow chart of the method in Embodiment 2 of the present invention. Such as figure 2 As shown, a three-dimensional web design method may include the following steps:

[0053] 201. Designate a global three-dimensional container.

[0054] Each element in the HTML (application hypertext markup language) is positioned relative to the parent container. In this embodiment, at first specify a webpage element, and use this element as the parent container of all webpage elements, that is, specify a global three-dimensional container , all web page elements exist within the element's coordinate space.

[0055] 202. Set three-dimensional scene parameters.

[0056] The three-dimensional scene parameters at least include: the interpupillary distance between the viewer's eyes and the distance between the viewer and the screen.

[0057] It can be understood that the 3D scene parameters may also include: the coordinate space of the gl...

Embodiment 3

[0074] Correspondingly, this application also provides a three-dimensional Web design device, please refer to Figure 5, Figure 5 is a schematic structural diagram of the device implemented in the present invention. As shown in Figure 5, the three-dimensional web design device can include :

[0075] The receiving unit 30 is configured to receive the corresponding anchor point set for the webpage element in the preset global three-dimensional container input from the outside.

[0076] The positioning unit 31 is configured to place the webpage element in the global three-dimensional container according to the coordinates of the corresponding anchor point in the global three-dimensional container Positioning is performed in the three-dimensional container to obtain the positioning coordinates and depth values ​​of the webpage elements.

[0077] The drawing unit 32 is configured to draw the webpage elements in the left-eye view and the right-eye view respectively according to the positio...

the structure of the environmentally friendly knitted fabric provided by the present invention; figure 2 Flow chart of the yarn wrapping machine for environmentally friendly knitted fabrics and storage devices; image 3 Is the parameter map of the yarn covering machine
Login to View More

PUM

No PUM Login to View More

Abstract

The invention provides a three-dimensional webpage design method and device. Corresponding anchor points are arranged for webpage elements in a preset global three-dimensional container, and according to coordinates of the corresponding anchor points, the webpage elements are positioned in the global three-dimensional container to obtain positioning coordinates and depth values of the webpage elements; according to the positioning coordinates, the webpage elements are drawn in a left eye view and a right eye view and can be designed to have the three-dimensional effect, therefore, when an observer or a webpage user browses a webpage, the three-dimensional webpage content can be seen, and the user experience degree is improved. Meanwhile, the elements on a webpage image needs to change the positions, the existing anchor points can be reused, therefore, the redundant computation is reduced, and the three-dimensional effect only needs a small quantity of rendering engine variation. The three-dimensional webpage design method and device are suitable for any webpages, the application range is large, a three-dimensional interface formed by the method and device does not need the user to start, the three-dimensional effect can be seen when the webpage is opened after design, and use is easy and convenient.

Description

technical field [0001] The application relates to a method and device for designing a three-dimensional web page. Background technique [0002] When human beings look at objects in space, due to the different positions of the two eyes in the horizontal direction, the two views seen by the left and right eyes are slightly different, and the human brain can perceive a scene with depth and layers through the parallax of these two views. three-dimensional scene. Existing stereoscopic 3D browsers are based on this principle. By rendering left and right eye views with parallax for stereoscopic webpages, browser users perceive a 3D webpage interface with a real stereoscopic effect. [0003] In the production of existing three-dimensional three-dimensional web pages, there are generally the following types: [0004] 1. Graphic drawing method based on HTML5Canvas. Since the traditional web interface design adopts the method of describing the appearance of DOM nodes around HTML DOM...

Claims

the structure of the environmentally friendly knitted fabric provided by the present invention; figure 2 Flow chart of the yarn wrapping machine for environmentally friendly knitted fabrics and storage devices; image 3 Is the parameter map of the yarn covering machine
Login to View More

Application Information

Patent Timeline
no application Login to View More
Patent Type & Authority Applications(China)
IPC IPC(8): G06F17/30
CPCG06F16/986
Inventor 王文敏陈钦水王荣刚李革董胜富王振宇李英高文
Owner PEKING UNIV SHENZHEN GRADUATE SCHOOL
Who we serve
  • R&D Engineer
  • R&D Manager
  • IP Professional
Why Eureka
  • Industry Leading Data Capabilities
  • Powerful AI technology
  • Patent DNA Extraction
Social media
Eureka Blog
Learn More
PatSnap group products

Browse by: Latest US Patents, China's latest patents, Technical Efficacy Thesaurus, Application Domain, Technology Topic, Popular Technical Reports.

© 2024 PatSnap. All rights reserved.Legal|Privacy policy|Modern Slavery Act Transparency Statement|Sitemap|About US| Contact US: help@patsnap.com