Editing processing device and program

Abstract

To provide an editing processing device and a program that can set an interface whose usability is similar to a filling sheet.SOLUTION: An editing processing device 1 processes information defining input fields to be placed on a web page, generates and stores information defining the input fields according to instructions input by a user, generates a preview image of a web page in which the input fields are arranged based on the generated information each time information defining the input fields is generated, and presents the generated preview image to the user. The editing processing device 1 also determines whether the preview image satisfies a predetermined restriction, and the determination result is subjected to predetermined processing.SELECTED DRAWING: Figure 1

Description

Technical Field

[0001] The present invention relates to a web page editing processing apparatus and a program.

Background Art

[0002] In recent years, the digitization of documents has been promoted, and for questionnaires used in medical care and sheets for filling in examination results (hereinafter referred to as filling-in sheets), input is performed with an interface similar to that of a web page.

Prior Art Documents

Patent Documents

[0003]

Patent Document 1

Summary of the Invention

Problems to be Solved by the Invention

[0004] However, unlike the filling-in sheets previously prepared in paper media, in an electronically digitized document, items to be filled in (input) in a certain area are not gathered. Specifically, it may include input fields that are not displayed until the user scrolls.

[0005] For this reason, the interface obtained by digitizing the filling-in sheet by a conventional general method has a different usability from that of the filling-in sheet, and there has been a problem that it is difficult for unfamiliar users (such as patients and doctors) to use.

[0006] One of the objects of the present invention is to provide an editing processing apparatus and a program that can set an interface with a usability similar to that of a filling-in sheet in view of the above circumstances.

Means for Solving the Problems

[0007] One aspect of the present invention for solving the problems of the above-described conventional example is an editing processing device that processes information defining an input field to be arranged on a web page, including: a preview generation unit that generates a preview image of a web page in which the input fields are arranged; an input field information processing unit that generates and holds information defining an input field in accordance with an instruction input by a user; a presentation unit that, each time the input field information processing unit generates information defining an input field, causes the preview generation unit to generate a preview image of a web page in which the input fields are arranged based on the generated information, and presents the generated preview image to the user; and a determination unit that determines whether the preview image satisfies a predetermined limitation, wherein the result of the determination by the determination unit is used for a predetermined process.

Advantages of the Invention

[0008] According to the present invention, by setting a predetermined limitation for the preview image, it becomes possible to set an interface with a feel similar to that of a filling sheet.

Brief Description of the Drawings

[0009]

Figure 1

Figure 2

Figure 3

Figure 4

Figure 5

Figure 6

Embodiments for Carrying Out the Invention

[0010] Embodiments of the present invention will be described with reference to the drawings. The editing processing apparatus 1 according to the embodiments of the present invention can be realized by a general computer including a control unit 11, a storage unit 12, an operation unit 13, a display unit 14, and a communication unit 15, as illustrated in FIG. 1.

[0011] Here, the control unit 11 is a program control device such as a CPU, and in the example of the present embodiment, executes a program for processing information that defines an input field to be arranged on a web page.

[0012] By following this program, the control unit 11 accepts an instruction input from the user. This instruction input may be accompanied by, for example, an input of information for setting an input field that can be described in HTML (Hyper Text Markup Language). The control unit 11 generates information (for example, form data in HTML) that defines the input field to be arranged on the web page according to the input instruction. Further, when the control unit 11 generates the information that defines the input field, it generates a preview image of the web page in which the input fields are arranged based on the generated information, and presents it to the user by displaying the generated preview image on the display unit 14.

[0013] One of the characteristics of the control unit 11 in the present embodiment is that, in the process of these processes, when the preview image does not satisfy a predetermined limit, a notification to that effect is made, and control is performed so that the information that defines the input field is not saved.

[0014] Also, the predetermined limit here may be a limit such that when the entire preview image is output in a predetermined size, the minimum size of the character image included in the preview image (for example, the area of the rectangle circumscribing the character image) exceeds a predetermined threshold value, or a limit such that the width or height of the grid container (the entire layout) when using a grid layout, or the ratio thereof (such as the ratio of width to height) exceeds a predetermined threshold value. The operation of this control unit 11 will be described in detail later.

[0015] The storage unit 12 is a memory device or a disk device, and holds programs executed by the control unit 11. For example, these programs are stored and provided in a computer-readable and non-transitory recording medium, and then stored in this storage unit 12. Also, this storage unit 12 operates as a work memory of the control unit 11.

[0016] The operation unit 13 is a general input device such as a keyboard or a mouse. It accepts instruction operations from the user and outputs the content of the instruction operation to the control unit 11. The display unit 14 is a display or the like, and displays and outputs information according to an instruction input from the control unit 11. The communication unit 15 is a network interface or the like, and exchanges information via a network according to an instruction input from the control unit 11.

[0017] Next, the specific processing content by the control unit 11 will be described. By executing the program stored in the storage unit 12, the control unit 11 of the editing processing apparatus 1 according to the present embodiment functionally realizes a configuration including an instruction receiving unit 21, an input field information processing unit 22, a preview generation unit 23, a presentation unit 24, a determination unit 25, and a save processing unit 26, as illustrated in FIG. 2.

[0018] In the following example, the control unit 11 generates, according to a user's instruction, form data described in HTML ( <form>Generate setting data for accepting information input defined in the tag).

[0019] The instruction receiving unit 21 receives instruction information for defining an input field from a user (such as an administrator) who sets the input field, including the type of the input field to be set (types such as a text input field, a check box, a radio button, a menu selection type input field... here, those selected from the types specifiable in the HTML <input> tag), verification information (information such as the number of characters, character types, patterns, etc.) representing the conditions related to the information input into the input field, layout information such as the size, vertical and horizontal ratios, and position of the input field, specification of image data for the background of the input field, etc.

[0020] In an example of this embodiment, the instruction receiving unit 21 provides a graphical user interface (hereinafter referred to as an editing screen) that allows the user to select the type of the input field from a menu or the like and display its outer shape, and enables the user to adjust its size and the like on the screen (Fig. 3). Since the display of such an interface and the process of receiving instruction information via such an interface are widely known, detailed description of their content is omitted.

[0021] The input field information processing unit 22 initially generates empty form data. That is, initially...< / form> without setting input fields. Then, when the instruction receiving unit 21 receives instruction information, the input field information processing unit 22 generates information defining an input field according to the received instruction information. Specifically, the input field information processing unit 22 generates <input> data of tags corresponding to the type of the input field indicated by the instruction information, includes it in the form data, and updates the form data. Also at this time, the input field information processing unit 22 sets the size, vertical and horizontal ratio, etc. of the input field.

[0022] Specifically, when the instruction receiving unit 21 receives from the user a type of "string input field" verification information with a minimum number of characters of "2" and a maximum number of characters of "8" Assume that the height and width are H and W respectively. Also, regarding the arrangement, the input screen is divided into a plurality of blocks in advance using the grid layout of HTML5, and which block to place this input field is specified by the instruction information.

[0023] In this example, the input field information processing unit 22 <input name=""text-1”" type=""text”" width="W" hight="H" minlength="2" maxlentgh="8…"> generates tags such as, and updates the description of the HTML form data so as to place this tag in the specified block.

[0024] When the input field information processing unit 22 updates the form data (that is, generates information defining the input field), the preview generation unit 23 renders the HTML including the updated form data, and generates a preview image of the web page including the input fields arranged according to the user's specification. In an example of the present embodiment, this preview generation unit 23 performs rendering while performing enlargement and reduction so that the rendering result of the form data generated by the input field information processing unit 22 fits entirely within a region of a predetermined size (a window of a predetermined size), and generates a preview image.

[0025] The presentation unit 24 presents the preview image generated by the preview generation unit 23 to the user. As illustrated in FIG. 4, this presentation unit 24 may display this preview image (P) adjacent to the editing screen (E) displayed by the instruction reception unit 21.

[0026] The determination unit 25 determines whether the preview image generated by the preview generation unit 23 satisfies a predetermined limit. In an example of the present embodiment, this determination unit 25 examines whether the vertical length (height) of the generated preview image exceeds a preset threshold value.

[0027] When it is determined that the vertical length of the preview image generated by the determination unit 25 exceeds a preset threshold (does not satisfy a predetermined limit), the determination unit 25 may display and output to that effect.

[0028] The storage processing unit 26 stores and outputs, in accordance with an instruction input from the user, the form data generated by the input field information processing unit 22 in the storage unit 12 as information defining the user interface. In an example of the present embodiment, when the determination unit 25 determines that a predetermined limit is not satisfied, if there is an instruction from the user to output the form data, the storage processing unit 26 displays that the predetermined limit is not satisfied, and confirms whether to output it anyway. When it is confirmed that the user still wants to output it, the storage processing unit 26 may store and output the form data generated by the input field information processing unit 22 in the storage unit 12 as information defining the user interface. Alternatively, when the determination unit 25 determines that a predetermined limit is not satisfied, the storage processing unit 26 may control not to store and output the form data generated by the input field information processing unit 22 in the storage unit 12 as information defining the user interface. The processing of the storage processing unit 26 corresponds to an example of the predetermined processing in the present invention.

[0029] [Operation] The editing processing apparatus 1 of the present embodiment basically has the above configuration and operates as follows. In the following example, an example of digitizing an entry form for dental examination as shown in the example of FIG. 5 will be described. In this example, the entry form includes · Date of examination, · Name of examiner, age, etc., · Conditions such as dental arch and occlusion, · Conditions such as gums, · Dental formula (input fields of 16 columns × 2 rows), · Number of teeth and treatment status, · Other entry fields, · Entry fields such as necessity of treatment, shall be included.

[0030] The user may initially input the maximum number of input fields arranged in the horizontal direction of the form to be digitized (this input value may be predefined as an initial value and specified without user input). The editing processing device 1 sets a grid based on the maximum number of input fields arranged in the width direction and the number of rows arranged in the vertical direction, and generates a CSS (Cascading Style Sheets) file to be used for the preview image (and the form data to be finally output).

[0031] Specifically, here the editing processing device 1 sets a grid container including 16 columns, which is the number of toothed input fields in the width direction, and a plurality of rows (varying depending on the number of entry fields to be set) of cells in the vertical direction, and generates a CSS file. In the following examples, it is assumed that the width and height of each cell are common (that is, the shape of each cell is the same). Also, the editing processing device 1 generates empty form data in advance.

[0032] Hereinafter, the user sequentially sets input fields corresponding to the entry fields included in the form. Specifically, for the cells in the first row, the user divides them into three fragments, groups the cells from the first column to the sixth column as a block, and inputs an instruction to draw the character string "Name" in this block. Also, the user groups the cells from the seventh column to the tenth column as a block, inputs an instruction to draw the character string "Age" in this block, similarly groups the cells from the eleventh column to the sixteenth column as a block, and inputs instructions to represent the character string "Date of Birth" in this block.

[0033] Also, for the second row, the user, similar to the first row, sets an input field for a character string in the width of the block formed by grouping the cells from the first column to the sixth column, sets an input field that allows only numbers to be input and allows a character string of 1 to 3 characters to be input in the block formed by grouping the cells from the seventh column to the tenth column, and inputs an instruction to set an input field that allows a date to be input in the block from the eleventh column to the sixteenth column.

[0034] In subsequent rows, set a 16-column × 5-row input field as the field for entering the dental formula. In each column of the first and last rows, set menu input fields that allow selection of any one of "diagonal lines" (current teeth, default), "C" (upper teeth), filled circles (untreated), "CO" (to be observed), triangular marks (missing teeth), "X" (primary teeth requiring attention), and blanks, respectively. Enter an instruction to set such menu input fields.

[0035] Also, for the user, in each column of the second and fourth rows out of these 5 rows, arrange the numbers from "8" to "1" from left to right as labels, followed by the numbers from "1" to "8" (representing tooth numbers). And for the third row, enter an instruction to set it so that tooth images are arranged across all 16 columns.

[0036] When instructions for setting such input fields (including labels) are sequentially given, the editing processing device 1 generates HTML data that arranges the instructed input fields (including labels) in the instructed rows and columns (columns), and appends it to the form data in response to each instruction input.

[0037] Also, each time the form data is updated by appending, the editing processing device 1 renders and generates a preview image of the web page based on the generated CSS and form data within a region of a predetermined size (a window of a predetermined size). (For example, FIG. 6)

[0038] In an example of this embodiment, this editing processing device 1 generates a preview image of a predetermined size, for example, 768 pixels wide × 1024 pixels high (here, so-called CSS pixel count, but device pixels, which are the pixel count of the actual display device, may also be used). That is, in this example, when only this preview image is displayed on a display with the above pixel count, the entire preview image can be displayed without a scroll operation and without a reduction operation.

[0039] When the editing processing device 1 generates a preview image, it presents the preview image to the user and determines whether or not it satisfies a predetermined limit. Here, the editing processing device 1 obtains the size (width and height) of each cell or block (a virtual area arranged across a plurality of cells) in which each input field (including a label) is set.

[0040] In the example here, since the width and height of each cell are constant and the size of the preview image is predetermined, the width of each cell is 768 pixels / 16 = 48 pixels, and in the height direction, when N rows of cells are arranged, it is obtained as 1024 / N pixels. For example, if N = 7, the height of each cell is approximately 146.3 pixels, and if N = 10, the height of each cell is approximately 102 pixels.

[0041] Every time the editing processing device 1 generates a preview image, it obtains the width and height of each cell or block and checks whether or not they exceed preset threshold values respectively. For example, assume that the editing processing device 1 sets 32 pixels as the threshold value for the width of a cell or block and 60 pixels as the threshold value for the height. In this case, in the above example, since the width is always at least 48 pixels, which is the width of one cell, it always satisfies the limit. However, for the height, when the 18th row is added, the height of one cell is less than 60 pixels. Therefore, when the 18th row is added and the corresponding preview image is generated, the editing processing device 1 determines that it does not satisfy the predetermined limit.

[0042] When the editing processing device 1 determines that the preview image does not satisfy the predetermined limit, it displays and outputs that fact. The user can refer to this information and select whether to adjust the form data or save it as it is (as an interface that has to be scrolled).

[0043] When an instruction to output form data is input from the user, the editing processing device 1 checks whether it is determined that the last generated preview image does not satisfy a predetermined limit. When it is determined that the limit is satisfied, the generated CSS and form data are stored in the storage unit 12 as information defining the user interface and output.

[0044] Also, here, when the editing processing device 1 determines that the last generated preview image does not satisfy a predetermined limit, it displays that the limit is not satisfied and confirms whether to output it anyway. When the user confirms to output it anyway, the editing processing device 1 stores the generated CSS and form data in the storage unit 12 as information defining the user interface and outputs them.

[0045] By using this CSS and form data, it is possible to generate an interface screen that is the same as the one displayed as a preview image and allows information to be input into each input field within one screen without operations such as scrolling. Since a method of generating an interface screen of an application program using such CSS and form data is widely known, a detailed description thereof will be omitted.

[0046] Needless to say, by using the same form data and varying the CSS, it is possible to generate an interface screen that allows information to be input into the input field while scrolling or switching pages on a smartphone or the like.

[0047] Also, here, it is assumed that the height of the cell is constant. However, when the height of a cell is dynamically set according to the information (such as image data) arranged in the cell for some cells, the height of the cell shall be the dynamically set height, and for cells that are not dynamically set (the remaining size is divided to determine the height), the height of the remaining cells may be obtained by subtracting the height of the dynamically set cells from the height of the preview image (here, 1024 pixels) and dividing by the number of the remaining cells.

[0048] When the height of each cell is determined by a fragment (ratio), divide the ratio set as the height of each cell by the sum of the ratios of all cells to obtain the height of each cell. For example, if the ratios of the heights of the cells from the first to the third rows are 1:2:1, then the height of the cells in the first and third rows is 1 / (1 + 2 + 1) × 1024 = 256 pixels each, and the height of the cells in the second row is 512 pixels.

[0049] According to this embodiment, it is possible to generate a form that can be displayed or printed on a screen (or paper) of a certain size, and an interface with a usage feeling similar to that of an entry sheet can be set, such as eliminating the need for operations such as scrolling.

[0050] [Other examples of restrictions] In the description so far, as an example of restriction, it has been assumed that the editing processing device 1 determines whether the width or height of a cell or block exceeds a predetermined threshold value, but this embodiment is not limited to this example.

[0051] As an example of restriction, it may be whether the size of the characters included in each cell or block exceeds a predetermined character size threshold value. In this example, the editing processing device 1 obtains the width W and height H of each cell or block in the generated preview image, and calculates the area A = W × H of each cell from these. Then, the editing processing device 1 divides the area of the corresponding cell or block by the number of characters N included in each cell or block to obtain the average area α = A / N per character. Then, the editing processing device 1 may estimate and determine whether the size of the characters included in each cell or block exceeds a predetermined character size threshold value based on whether the average area per character is less than a predetermined threshold value.

Explanation of symbols

[0052] 1 Editing processing device, 11 Control unit, 12 Storage unit, 13 Operation unit, 14 Display unit, 15 Communication unit, 21 Instruction reception unit, 22 Input field information processing unit, 23 Preview generation unit, 24 Presentation unit, 25 Judgment unit, 26 Save processing unit.

Claims

1. An editing processing device that processes information defining an input field to be placed on a web page, preview generation means for generating a preview image of a web page in which the input fields are arranged, input field information processing means for generating and holding information defining an input field in accordance with an instruction input from a user, each time the input field information processing means generates information defining an input field, causing the preview generation means to generate a preview image of a web page in which the input fields are arranged based on the generated information, and presenting the generated preview image to the user; presenting means, judgment means for judging whether or not the preview image satisfies a predetermined limitation, and An editing processing device in which the result of the judgment by the judgment means is subjected to a predetermined process.

2. The editing processing device according to claim 1, wherein the preview generation means generates a preview image of a web page having a predetermined size in which the input fields are arranged based on the information generated by the input field information processing means.

3. The editing processing device according to claim 2, wherein the limitation includes a condition that the size of characters included in the generated preview image exceeds a predetermined threshold value.

4. A program for causing a computer to function as an editing processing device that processes information defining an input field to be placed on a web page, the computer being caused to function as preview generation means for generating a preview image of a web page in which the input fields are arranged, input field information processing means for generating and holding information defining an input field in accordance with an instruction input from a user, each time the input field information processing means generates information defining an input field, causing the preview generation means to generate a preview image of a web page in which the input fields are arranged based on the generated information, and presenting the generated preview image to the user; presenting means, judgment means for judging whether or not the preview image satisfies a predetermined limitation, and means for subjecting the result of the judgment by the judgment means to a predetermined process, A program that functions as.

Images