JP2013020406A - Screen design support device, screen design support method, and program - Google Patents

Abstract

PROBLEM TO BE SOLVED: To realize uniformity of GUI between a new screen and an already-designed screen when the screen is designed.SOLUTION: Design information including a screen identifier for identifying an already-designed screen, data items included in the screen, and a component identifier for identifying a component selected relative to the data items is stored in a design information storage unit, the data items included in the screen of a design object is received from a designer terminal for designing the screen of the design object, the component identifier of the component corresponding to the received data items is selected from the design information storage unit, and component candidate information indicating the selected component is outputted to the designer terminal.

Description

  The present invention relates to a screen design support apparatus, a screen design support method, and a program.

  A screen is often used for operations in an information processing apparatus such as a personal computer or a portable terminal. In a system development project, when designing a user interface of such a screen, that is, a GUI (Graphical User Interface), it is required to make the GUI uniform among a plurality of screens. For this reason, it is a common practice to establish guidelines for UI parts to be used on screens and to design screens in accordance with these guidelines. For example, Patent Document 1 discloses a method of registering one UI component in a guideline based on a questionnaire result when a plurality of candidates are considered as UI components having a certain function.

JP 2009-104313 A

  By the way, even if the guidelines are provided as described above, the uniformity of the GUI among a plurality of screens may be impaired depending on the selection result of UI parts by each designer. This is because, when the screen is designed by each designer, the guidelines are referred to, but the uniformity with the screen designed in the past may not be considered.

  The present invention has been made in view of such circumstances, and it is an object of the present invention to provide GUI uniformity with a designed screen when designing a screen.

  A screen design support apparatus according to one aspect of the present invention is a screen identifier for identifying a designed screen, a data item included in the screen, and a component selected for the data item. A design information storage unit that stores design information including a component identifier, a design information reception unit that receives data items included in the design target screen from a designer terminal that designs the design target screen, and received data A component candidate output unit that selects a component identifier of a component corresponding to the item from the design information storage unit and outputs component candidate information indicating the selected component to the designer terminal.

  In the present invention, the “part” does not simply mean a physical means, but includes a case where the function of the “part” is realized by software. Also, even if the functions of one “unit” or device are realized by two or more physical means or devices, the functions of two or more “units” or devices are realized by one physical means or device. May be.

  According to the present invention, when designing a screen, it is possible to provide GUI uniformity with a designed screen.

It is a figure which shows the structure of the screen design system which is one Embodiment of this invention. It is a figure which shows an example of the structure of UI components catalog DB. It is a figure which shows an example of the structure of UI selection guideline template DB. It is a figure which shows an example of the structure of UI selection guideline DB. It is a figure which shows an example of the structure of screen and UI memory DB. It is a figure which shows an example of the screen displayed at the time of screen design. It is a figure which shows an example of the screen displayed at the time of approval of UI components. It is a flowchart which shows an example of the process in UI memory server.

  Hereinafter, an embodiment of the present invention will be described with reference to the drawings. FIG. 1 is a diagram showing a configuration of a screen design system according to an embodiment of the present invention. The screen design system includes clients 10, 12, 14 and a UI memory server 20. The clients 10, 12, and 14 are configured using an information processing apparatus such as a personal computer, for example, and the UI memory server 20 is configured using an information processing apparatus such as a PC server.

  The client 10 is an administrator terminal used by a project administrator in system design, and includes a project registration unit 30 and a communication unit 32. Although only one client 10 is shown in FIG. 1, a plurality of clients 10 may exist.

  The project registration unit 30 provides a function for registering project attributes and application base colors in the UI memory server 20. Here, the project attributes include, for example, a user image of an application developed in the project and a device used. Specifically, the information includes whether the user of the application is a beginner or an advanced user, and whether the input device is a keyboard or a mouse. The basic color of the application is information indicating whether the color scheme of the background color and parts is red or blue. In addition, the project registration unit 30 assigns a plurality of candidate priorities to the UI memory server 20 when there are a plurality of UI part candidates having a certain function among UI parts that can be used for screen design. Provides a function to register. For example, the project registration unit 30 can implement the above-described functions by accessing the UI memory server 20 via a Web browser or by executing a program installed in the client 10 in advance.

  The communication unit 32 is for communicating with other information processing apparatuses via a network. In the present embodiment, the communication unit 32 can transmit and receive data between the project registration unit 30 and the UI memory server 20.

  The client 12 is a designer terminal used by a screen designer, and includes a screen design unit 34 and a communication unit 36. Although only one client 12 is shown in FIG. 1, a plurality of clients 12 may exist.

  The screen design unit 34 provides a function for designing a screen to the screen designer. Specifically, the screen design unit 34 provides the screen designer with various types of information from the UI memory server 20 such as information on UI component candidates that can be used on the screen to be designed. Screen design information is generated in response to input from the user. For example, the screen design unit 34 can implement the above-described functions by accessing the UI memory server 20 via a Web browser or by executing a program installed in the client 12 in advance.

  The communication unit 36 is for communicating with other information processing apparatuses via a network. In the present embodiment, the communication unit 36 can transmit and receive data between the screen design unit 34 and the UI memory server 20.

  The client 14 is an approver terminal used by a screen design approver, and includes an approval unit 38 and a communication unit 40. Although only one client 14 is shown in FIG. 1, a plurality of clients 14 may exist.

  The approval unit 38 provides a function for approving the GUI of the designed screen. Specifically, the approval unit 38 verifies the difference when different UI parts are selected for the same data item on a plurality of screens, and issues an approval or correction instruction for the selected UI part. Provides functionality to do. For example, the approval unit 38 can implement the above-described functions by accessing the UI memory server 20 via a Web browser or by executing a program installed in the client 14 in advance.

  The communication unit 40 is for communicating with other information processing apparatuses via a network. In the present embodiment, the communication unit 40 can transmit and receive data between the approval unit 38 and the UI memory server 20.

  The UI memory server 20 includes a UI parts catalog database (DB) 50, a UI selection guideline template database (DB) 52, a UI selection guideline database (54), a screen / UI memory database (DB) 56, and communication units 60a, 60b, 60c. , A UI selection guideline setting unit 62, a screen registration unit 64, a component candidate output unit 66, and a UI selection approval unit 68. Each unit in the UI memory server 20 can be realized by using a storage area such as a memory or a storage device, or by executing a program stored in the storage area by a processor.

  The UI parts catalog DB 50 is a database in which information related to all UI parts used for screen design is stored. FIG. 2 shows an example of the structure of the UI parts catalog DB 50. As shown in FIG. 2, in the UI part catalog DB 50, UI part identifiers, part data, color arrangement data for each basic color, and attribute information are associated with each other. Here, each UI component is a basic UI component such as a text box or a button with variations such as usage, function, and movement. The identifier of the UI component includes a code or name assigned to the UI component. The part data includes graphic data used for drawing a UI part, source files necessary for executing the UI part, and the like. The color arrangement data for each basic color includes attributes relating to the color arrangement used for drawing UI components. As an attribute relating to color arrangement, for example, RGB representation of color data corresponding to component data may be used, or an identifier of color data defined using CSS (Cascading Style Sheet) may be used. The attribute information includes an assumed user image, information on availability of each input device, and the like.

  Returning to FIG. 1, the UI selection guideline template DB 52 defines a guideline template for selecting UI parts, and is a database in which usable UI parts are associated with each function in screen operation. In the present embodiment, the guideline defined by the UI selection guideline template DB 52 is also referred to as a guideline template. In the UI selection guideline template DB 52, a plurality of UI parts can be registered for one function. In the UI selection guideline template DB 52, when there are a plurality of UI parts for one function, the priority order of each UI part can be registered. In the UI selection guideline template DB 52, only a part of the UI parts registered in the UI parts catalog DB 50 may be registered. The UI selection guideline template DB 52 is assumed to be constructed in advance by a GUI administrator, for example.

  FIG. 3 shows an example of the structure of the UI selection guideline template DB 52. As shown in FIG. 3, in the UI selection guideline template DB 52, basic functions, detailed functions, priority, UI component identifiers, and explanation information are associated with each other. The basic functions indicate basic functions of UI parts such as input / output and selection. The detailed function indicates a more detailed function such as password / confidential input or numerical input. In the present embodiment, the basic function and the detailed function may be collectively referred to as a function. The priority order indicates a priority when selecting one UI component from the plurality of UI components when a plurality of UI components exist for the same detailed function. For example, in the example of FIG. 3, a plurality of UI components including the component X and the component Y are assigned to the detailed function of password and confidential input, and the priority order of the component X is the highest. That is, the UI selection guideline template DB 52 indicates that the component X is most recommended as a UI component for password / confidential input. The descriptive information includes various types of information that serve as a reference when selecting UI parts. As illustrated in FIG. 3, for example, the description information includes a description of a UI component, an advantage, a cautionary point, a mounting difficulty level, and the like.

  Returning to FIG. 1, the UI selection guideline DB 54 defines a guideline customized for each project based on the UI selection guideline template DB 52. In the present embodiment, the guideline defined by the UI selection guideline DB 54 is also simply referred to as a guideline.

  FIG. 4 shows an example of the structure of the UI selection guideline DB 54. As shown in FIG. 4, the UI selection guideline DB 54 includes project identifiers and application basic colors in addition to the items included in the UI selection guideline template DB 52. The project identifier includes a code and a name assigned to the project. The base color of the application includes the base color name selected from the base color information in the UI parts catalog DB 50 for each project. In the guideline customized for each project, the priority assigned to the UI component can be different from the priority specified in the guideline template. In the guideline, it is also possible to register only UI parts corresponding to project attributes among UI parts included in the guideline template. Details of the customization of the guideline will be described later.

  Returning to FIG. 1, the screen / UI memory DB 56 is a database that stores design information of screens designed in the past by the screen designer and screens currently being designed. FIG. 5 shows an example of the structure of the screen / UI memory DB 56. As shown in FIG. 5, the screen / UI memory DB 56 indicates the project identifier, application basic color, screen identifier, data item, basic function, detailed function, UI component identifier, arrangement information, and approval status. Approval information is associated. Here, the arrangement information indicates the arrangement of UI parts selected on each screen, and includes information such as size, position, margin, and alignment. The approval information indicates whether the UI component selected on each screen has been approved by the approver. For example, in FIG. 5, “completed” is set as the approval information for UI parts that have been approved by the approver, and “not yet” is set for UI parts that have not been approved. In addition, “correction instruction” is set as approval information for those instructed by the approver to correct UI parts.

  Returning to FIG. 1, the communication units 60 a, 60 b, and 60 c are for transmitting and receiving data to and from the clients 10, 12, and 14.

  The UI selection guideline setting unit 62 is for setting a customized guideline for each project based on a project attribute input from the project manager using the client 10. The guideline set by the UI selection guideline setting unit 62 is stored in the UI selection guideline DB 54. For example, when information indicating a user image is input as a project attribute, the UI selection guideline setting unit 62 refers to the UI component catalog DB 50 and extracts a UI component corresponding to the specified user image. Then, the UI selection guideline setting unit 62 generates a customized guideline for the project based on the guideline template registered in the UI selection guideline template DB 52 and the UI parts extracted from the UI parts catalog DB 50, It stores in UI selection guideline DB54.

  For example, the UI selection guideline setting unit 62 can extract only UI parts extracted from the UI parts catalog DB 50 as guidelines, among those registered in the guideline template. Further, for example, the UI selection guideline setting unit 62 can generate a guideline in which the priority order set in the guideline template is changed so that the priority order of UI parts extracted from the UI part catalog DB 50 is higher. It is. Also, the UI selection guideline setting unit 62 can receive information for setting the priority order of each UI component from the client 10 and reflect the information in the guideline.

  Note that a screen for inputting project attributes in the project registration unit 30 of the client 10 or inputting the priority order of UI parts in the guideline is displayed on the client 10 using a Web browser, for example. be able to. In this case, the UI selection guideline setting unit 62 can transmit data necessary for screen display to the client 10 in response to a request from the project registration unit 30.

  The screen registration unit 64 (design information receiving unit) receives information on data items and functions included in the screen from the client 12 and registers it in the screen / UI memory DB 56 at the start of design of each screen. FIG. 6 shows an example of a screen displayed in the screen design unit 34 of the client 12. As shown in FIG. 6, the screen 100 includes a screen name input area 110, a data item input area 112, a screen initial registration button 114, a guideline reference button 116, a screen matching candidate display area 118, a screen design area 120, and UI component candidates. A display area 122 and a selection result registration button 124 are included. The screen 100 may be displayed on the client 12 using a Web browser, or may be displayed using a dedicated application for screen design.

  As shown in FIG. 6, in the screen 100, the name of the screen to be designed is input to the screen name input area 110. In the data item input area 112, data items included in the screen to be designed and functions for the respective data items are input. For example, the data item can be set by a character input by the screen designer in the data item input area. The function can be set by the screen designer selecting in the data item input area. The screen design unit 34 can display the functions in a selectable manner by referring to the UI selection guideline DB 54. When the screen name, data item, and function are input on the screen 100 and the screen initial registration button 114 is pressed, these pieces of information are transmitted to the screen registration unit 64. Then, the screen registration unit 64 registers the received information in the screen / UI memory DB 56. Information indicating the project may be input on the screen 100 or may be associated with the client 12 or the screen designer in advance. Further, the screen registration unit 64 can set “not yet” as the initial value of the approval information in the initial registration of the screen.

  Returning to FIG. 1, the part candidate output unit 66 outputs part candidate information to the client 12 as reference information when selecting a UI part on the screen to be designed. A unit 72 and a UI selection unit 74 are included.

  The screen matching unit 70 searches for screens designed in the past that are similar to the screen to be designed based on information initially registered in the screen / UI memory DB 56. When a similar screen is searched, information indicating a UI component selection result on the searched screen is transmitted to the client 12 as component candidate information. For example, the screen matching unit 70 can extract a designed screen whose similarity to the design target screen is greater than or equal to a predetermined reference value as a screen similar to the design target screen. Furthermore, the screen matching 70 can provide the client 12 with information on the designed screens in descending order of similarity. Here, the calculation of the similarity of the screen can be performed based on, for example, the degree of coincidence of the data items included in the screen. When determining the degree of coincidence of data items, a function can be included in the keys used for comparison. Further, the screen matching unit 70 can search for a designed screen only in the project to which the design target screen belongs.

  A list of screens extracted by the screen matching unit 70 is displayed in the screen matching candidate display area 118 of the screen 100 shown in FIG. The list of screens can be represented by, for example, thumbnail images representing screen images or screen names. The list of screens can be displayed in descending order of similarity to the design target screen. The screen design area 120 of the screen 100 is an area for designing a screen to be designed. For example, when a screen is selected in the screen matching candidate area 118, the screen design unit 34 requests the design matching information of the selected screen from the screen matching unit 70 of the UI memory server 20. The screen matching unit 70 extracts the requested screen design information from the screen / UI memory DB 56 and transmits it to the client 12. At this time, the screen matching unit 70 acquires component data and color arrangement data of the screen from the UI component catalog DB 50 and transmits them to the client 12 together with design information. The screen design unit 34 of the client 12 renders the screen selected in the screen matching candidate display area 118 based on the design information, component data (drawing information), and color scheme data received from the UI memory server 20, and displays the screen design area. 120 can be displayed. The screen designer adjusts the size and position of the UI component based on the designed screen displayed in the screen design area 120, and adds, changes, and deletes the UI component to design the screen. It can be performed. Note that addition or change of UI components can be performed by selecting from UI components displayed in the UI component candidate display area 122 as described later.

  In the screen design area 120, it is also possible to automatically display a designed screen having the highest similarity. In addition, data items other than the data items necessary for the screen to be designed may be included in the designed screen. In this case, in the screen design area 120, such unnecessary data items may not be displayed, or may be displayed so as to be understood as unnecessary by grayout or the like.

  When a screen is selected from the screen matching candidate display area 118, the UI item selected on the selected screen and the approval state on the selected screen are displayed in the data item input area 112.

  Returning to FIG. 1, in response to a request from the UI selection unit 74, the UI matching unit 72 uses the data item and function as a key for the data items included in the design target screen in the past from the screen / UI memory DB 56. The UI parts selected for the data item and function are searched.

  When the UI selection unit 74 receives, from the screen design unit 34 of the client 12, a UI component search request for a data item included in the design target screen in the past for the same data item and function, the UI selection unit 74 performs UI matching. Such UI parts are searched through the unit 72. Based on the search result of the UI matching unit 72, the UI selection unit 74 acquires the searched UI component description information, component data, and color arrangement data from the UI selection guideline DB 54 and the UI component catalog DB 50, and sends them to the client 12. Send. When a plurality of UI parts are searched for a certain data item, the UI selection unit 74 transmits information regarding the plurality of UI parts to the client 12. In this case, the UI selection unit 74 can output the UI component information to the client 12 so that the UI component is displayed in the UI component candidate display area 122 according to the priority order registered in the UI selection guideline DB 54.

  Here, the screen design unit 34 of the client 12 can transmit, for example, a search request for the data item selected in the data item input area 112 to the UI memory server 20. For example, the screen design unit 34 can also transmit a search request for the data item selected in the screen design area 120 to the UI memory server 20.

  Also, the UI selection unit 74 can provide the client 12 with information on UI parts specified in the guidelines by referring to the UI selection guideline DB 54 regardless of the UI part selection history on the designed screen. Is possible. For example, when a UI part is not searched by the UI matching unit 72, the UI selection unit 74 searches the UI selection guideline DB 54 for a UI part having a function with respect to the data item, and stores information on the searched UI part for the client 12. Can be provided. Further, for example, when a data item is selected on the screen 100 and the guideline reference 116 button is pressed, a UI part having a function for the data item is selected in accordance with a request from the client 12. It is also possible to search from. Even in such a case, the UI selection unit 74 displays the UI component information in the UI component candidate display area 122 so that one or more UI components are displayed together with the UI component description information according to the priority order. 12 can be output.

  Also, the UI selection unit 74 can receive design information indicating the selection result of UI parts on the designed screen from the client 12 and can update the screen / UI memory DB 56. That is, the UI selection unit 74 also has a function as a design information update unit that updates design information stored in the screen / UI memory DB 56. For example, when the selection result registration button 124 is pressed on the screen 100 shown in FIG. 6, design information related to the screen designed in the screen design area 120 is transmitted from the screen design unit 34 to the UI memory server 20. Can be. When the selection result is received from the client 12, the UI selection unit 74 adds UI parts and arrangement information to the design information initially registered in the screen / UI memory DB 56. In addition, the UI selection unit 74 uses a UI part selected on the newly designed screen as it is, using the UI part selected in the past on the similar screen as it is, and has already been approved on the similar screen. May update the approval state of the UI component on the newly designed screen to “done”.

  Returning to FIG. 1, the UI selection approval unit 68 refers to the screen / UI memory DB 56 and identifies a plurality of screens on which different UI parts are selected for the same data item. Then, the UI selection approval unit 68 generates difference information indicating that different UI components are selected for the same data item on the specified screen, and transmits the difference information to the approval unit 38 of the client 14. This difference information includes design information of the specified screen, component data, and color arrangement data. The approval unit 38 of the client 14 approves the selected UI component based on the difference information transmitted from the UI memory server 20.

  FIG. 7 shows an example of a screen when the UI part is approved by the approval unit 38 of the client 14. A screen 200 shown in FIG. 7 is displayed by the approval unit 38 based on the difference information transmitted from the UI memory server 20. The screen 200 includes a UI difference list display area 210 and a UI difference confirmation area 212. In the UI difference list display area 210, a list of data items having differences in the selected UI parts is displayed. In the example of FIG. 7, it is shown that the part T is selected on the screen A and the part V is selected on the screen B for the same data item “sex”. Then, it is indicated that the approval state of the part T is “completed” and the approval state of the part V is “not yet”. In the UI difference confirmation area 212, a screen including the data item selected for the data item selected in the UI difference list display area 210 is displayed. In the example of FIG. 7, the “sex” data item is selected in the UI difference list display area 210, and screen A and screen B including this data item are displayed in the UI difference confirmation area 212. Looking at the UI difference confirmation area 212, it is found that a radio button (part T) is selected on screen A and a list box (part V) is selected on screen B for the same data item “gender”. Recognize. Here, it is assumed that the radio button (component T) on the screen A is already approved and the list box (component V) on the screen B is not approved. At this time, the approver can input the approval result of the list box (part V) on the screen B by pressing the approval button 214 or the correction instruction button 216. Upon receiving the approval result from the approver, the approval unit 38 generates approval information indicating the approval result, and selects the UI of the UI memory server 20 together with information for specifying the screen on which the approval result is input and the data item. It transmits to the approval part 68. The UI selection approval unit 68 of the UI memory server 20 updates the design information stored in the screen / UI memory DB 56 using the approval information.

  In the screen 200 of FIG. 7, only two screens are displayed in the UI difference confirmation area 212, but when there are three or more screens in which the same data item selection results are different, Any display method for confirming the difference between these three or more screens can be employed. For example, in the UI difference confirmation area 212, it is possible to display all the screens in which differences have occurred in the selection result of the same data item. In this case, for example, the UI difference confirmation area 212 can be configured to be scrollable. In addition, for example, a screen in which the target data item has been approved is displayed on the left side of the UI difference confirmation area 212, and a screen in which the target data item has not been approved can be sequentially switched on the right side of the UI difference confirmation area 212. It is good to do. It is also possible to input a correction instruction for the approved data item. In any case, the approver does not simply compare the selected data item with the guideline, but approves the UI component selected on each screen based on the characteristics of each screen and the relationship with the previous and next screens. It is possible to determine whether or not.

  FIG. 8 is a flowchart illustrating an example of processing in the UI memory server 20. First, the screen registration unit 64 receives design information including data items and functions for each screen from the client 12 and registers the design information in the screen UI / memory DB 56 (S801). When the design information is registered, the screen matching unit 70 searches the screen UI / memory DB for screens designed in the past with similar data items, and calculates the similarity of the searched screens (S802). Then, the screen matching unit 70 checks whether there is a screen with a similarity equal to or higher than the reference value (S803). If there is a screen with a reference value equal to or higher than the reference value (S803: Y), the similar screen design information and component data, color scheme Data is acquired from the screen / UI memory DB 56 and UI parts catalog DB 50, and is sent to the client 12 as part candidate information (S804).

  If there is no screen having a similarity equal to or higher than the reference value (S803: N), the UI selection unit 74 displays the UI parts selected in the past for the registered data items via the UI matching unit 72 on the screen UI. A search is performed from the memory DB 56 (S805). When there is a UI part selected in the past for this data item (S806: Y), the UI selection unit 74 displays the design information, part data, and color arrangement data of the UI part selected in the past on the screen / UI. It is acquired from the memory DB 56 and the UI parts catalog DB 50, and is sent as part candidate information to the client 12 (S807).

  When there is no UI part selected in the past for the registered data item (S806: N), or when there is a guideline search request from the client 12 (S808: Y), the UI selection unit 74 performs registration. The UI part corresponding to the function of the designated data item is searched from the UI selection guideline DB 54 (S809). Then, the UI selection unit 74 acquires the retrieved UI component information, component data, and color arrangement data from the UI selection guideline DB 54 and the UI component catalog DB 50, and transmits them to the client 12 as component candidate information (S810).

  The UI selection unit 74 receives design information indicating the UI selection result of the screen designed based on the part candidate information from the client 12, and updates the design information stored in the screen / UI memory DB 56 (S811). ).

  Although not shown in the flowchart of FIG. 8, for example, the approval process for the selected UI component is executed at an arbitrary timing according to a request from the client 14.

  The present embodiment has been described above. According to the present embodiment, in a past screen including the same data item as the data item included in the design target screen, information regarding the UI component used for the data item can be provided as component candidate information. Is possible. Therefore, since the screen designer can select UI parts used in the past for the data item, when designing the screen, the uniformity of the GUI with the designed screen. Can be given.

  In the present embodiment, when there are a plurality of UI parts used for the data item in a past screen including the same data item as the data item included in the screen to be designed, the plurality of UIs are used. It is possible to provide information regarding parts as part candidate information. Therefore, it is possible to make the GUI uniform with the designed screen, and it is possible to improve the degree of freedom when designing the screen by increasing the choice of UI parts.

  In the present embodiment, the component candidate information provided to the client includes arrangement information indicating the arrangement of UI components, such as size, position, margin, and alignment. Therefore, it is possible to unify the UI parts to be selected, and also to unify the arrangement of the UI parts, and it is possible to further improve the uniformity of the GUI.

  In this embodiment, a screen similar to the screen to be designed is selected from screens that have been designed in the past, and information on UI components used in the selected screen is displayed as component candidate information. Can be output as Since it is likely that the same UI component can be used between similar screens, it is possible to improve the uniformity of the GUI by considering the similarity between the screens in this way. It becomes.

  Furthermore, in the present embodiment, for example, as shown in FIG. 6, the image of the selected screen can be confirmed in the screen design area 120. As a result, it is possible to design the screen in consideration of the arrangement of UI parts on the selected screen and the like, and it is possible to improve the uniformity of the GUI.

  Further, in the present embodiment, it is possible to select a plurality of screens similar to the screen to be designed, and to output information regarding UI parts used on the plurality of screens as part candidate information. As a result, it is possible to improve the uniformity of the GUI, and it is possible to improve the degree of freedom when designing the screen by increasing the choices of UI parts.

  Also, in this embodiment, design information of newly designed screens is accumulated in the screen / UI memory DB 56, so that the selection result of UI parts can be updated to the latest state, and the GUI can be unified. It becomes possible to maintain sex.

  Further, in the present embodiment, it is possible to manage screen design information for each project, and to provide information regarding UI parts used on screens that have been designed in the past as part candidate information. Accordingly, in each project, it is possible to provide GUI uniformity in consideration of project characteristics.

  In this embodiment, when there are a plurality of screens in which different UI parts are selected for the same data item, the approver confirms the contents of the difference and approves the selected UI parts. Is possible. As a result, the designer is given a degree of freedom in selecting UI parts, while the UI can be ensured by approving the UI parts by the approver.

  In this embodiment, the approval result of the approver can be stored in the screen / UI memory DB 56 in association with the screen design information. Therefore, the screen designer can confirm the approval result for the selection of the UI parts on the screen 100 at the time of design, for example. In addition to the confirmation on the screen 100, for example, an arbitrary result can be used for confirmation of the approval result, for example, the designer is notified of the approval result by e-mail.

  Note that this embodiment is intended to facilitate understanding of the present invention and is not intended to limit the present invention. The present invention can be changed / improved without departing from the spirit thereof, and the present invention includes equivalents thereof.

10, 12, 14 Client 20 UI memory server 30 Project registration unit 32 Communication unit 34 Screen design unit 36 Communication unit 38 Approval unit 40 Communication unit 50 UI parts catalog DB
52 UI selection guideline template DB
54 UI selection guideline DB
56 screen / UI memory DB
60a, 60b, 60c Communication unit 62 UI selection guideline setting unit 64 Screen registration unit 66 Component candidate output unit 68 UI selection approval unit 70 Screen matching unit 72 UI matching unit 74 UI selection unit

Claims (13)

Design information storage for storing design information including a screen identifier for identifying a designed screen, a data item included in the screen, and a component identifier for identifying a component selected for the data item And
A design information reception unit that receives data items included in the design target screen from a designer terminal that designs the design target screen;
A component candidate output unit that selects a component identifier of a component corresponding to the received data item from the design information storage unit, and outputs component candidate information indicating the selected component to the designer terminal;
A screen design support apparatus. The screen design support device according to claim 1,
The part candidate output unit selects part identifiers of a plurality of parts corresponding to the received data items from the design information storage unit, and sends part candidate information indicating the selected parts to the designer terminal. Output,
Screen design support device. The screen design support device according to claim 1 or 2,
The design information includes arrangement information indicating an arrangement of the selected part on the designed screen,
The component candidate information includes the arrangement information corresponding to the selected component.
Screen design support device. The screen design support device according to any one of claims 1 to 3,
The component candidate output unit
Based on the degree of coincidence between the data item included in the screen to be designed and the data item included in the designed screen, the degree of similarity with the screen to be designed is a predetermined reference value or more Select the screen,
Outputting part candidate information indicating parts corresponding to data items included in the selected designed screen to the designer terminal;
Screen design support device. The screen design support device according to claim 4,
The component candidate output unit
Outputting the candidate component information so that the selected designed screen can be displayed on the designer terminal;
Screen design support device. The screen design support apparatus according to claim 4 or 5,
The component candidate output unit
Selecting a plurality of designed screens whose similarity is equal to or higher than a predetermined reference value, and displaying candidate component information indicating parts corresponding to data items included in the selected plurality of designed screens. Output to
Screen design support device. The screen design support device according to any one of claims 1 to 6,
A design information update unit that receives the design information of the screen designed based on the component candidate information from the designer terminal and stores the design information in the design information storage unit;
Screen design support device. The screen design support device according to claim 7,
The design information update unit further receives project information indicating the project to which the designed screen belongs from the designer terminal, stores the design information in association with the project information in the design information storage unit,
The design information receiving unit further receives project information indicating a project to which the design target screen belongs,
The component candidate output unit outputs the component candidate information corresponding to the designed screen in the project to which the setting target screen belongs to the designer terminal.
Screen design support device. A screen design support device according to any one of claims 1 to 8,
It further includes a guideline storage unit that stores a component that can be used for the screen and a function of the component in association with each other,
The design information receiving unit further receives a function for a data item included in the screen to be designed from the designer terminal,
The component candidate information output unit can select a plurality of components having the accepted function from the guideline storage unit, and can further output component candidate information indicating the selected plurality of components to the designer terminal. ,
Screen design support device. A screen design support device according to any one of claims 1 to 9,
Referring to the design information storage unit, a plurality of screens in which different parts are selected for the same data item are specified, and different parts are selected for the same data item in the specified plurality of screens. Further comprising an approval unit that outputs the difference information indicating that it has been performed to the approver terminal that approves the screen design,
Screen design support device. The approval unit receives approval information indicating an approval result of a component selected for the same data item on at least one of the plurality of specified screens, and the approval information is received as the at least one screen. Storing it in the design information storage unit in association with the design information on the screen;
Screen design support device. Computer
Design information including a screen identifier for identifying a designed screen, a data item included in the screen, and a component identifier for identifying a component selected for the data item is stored in the design information storage unit. Remember,
Accept the data items included in the design target screen from the designer terminal that designs the design target screen,
Selecting a part identifier of a part corresponding to the received data item from the design information storage unit, and outputting part candidate information indicating the selected part to the designer terminal;
Screen design support method. Design information storing design information including a screen identifier for identifying a designed screen, a data item included in the screen, and a component identifier for identifying a component selected for the data item In a computer having a storage unit,
A function for accepting data items included in a screen to be designed from a designer terminal that designs the screen to be designed;
A function of selecting a part identifier of a part corresponding to the received data item from the design information storage unit, and outputting part candidate information indicating the selected part to the designer terminal;
A program to realize

Images