Generation of graphical user interface prototypes
A method of generating a prototype of a graphical user interface (GUI). The method includes acquiring a draft wireframe representing a GUI design, the draft wireframe including one or more wireframe components, and decomposing the draft wireframe into one or more component slices, each component slice including a respective wireframe component of the one or more wireframe components. The method also includes generating a component slice sequence including the one or more component slices and at least one additional component slice selected based on the draft wireframe, constructing a wireframe based on the component slice sequence, and generating a prototype of the GUI design based on the constructed wireframe.
1. A method of generating a prototype of a graphical user interface (GUI), comprising:
acquiring a draft wireframe representing a GUI design, the draft wireframe including one or more wireframe components;
decomposing the draft wireframe into one or more component slices, each component slice including a respective wireframe component of the one or more wireframe components;
generating a component slice sequence including the one or more component slices and at least one additional component slice selected based on the draft wireframe;
constructing a wireframe based on the component slice sequence; and
generating a prototype of the GUI design based on the constructed wireframe,
wherein the machine learning model is a generative adversarial model that includes a generator configured to generate the component slice sequence, the generator configured to be trained by a first discriminator and a second discriminator,
wherein the first discriminator trains the generator based on discriminating between real component slice sequences from a training data set and component slice sequences output by the generator, and
wherein the second discriminator trains the generator based on discriminating between real wireframes from the training data set and wireframes constructed from the component slice sequences output by the generator.
2. The method of claim 1 , wherein the additional component slice is selected based on a target platform and a target function.
3. The method of claim 1 , wherein generating the component slice sequence and constructing the wireframe is performed at least in part by a machine learning model.
4. The method of claim 1 , wherein generating the component slice sequence and constructing the wireframe is performed at least in part by a GUI wireframe generative adversarial model (GWGAN) and generating the prototype is performed at least in part by a GUI style generative adversarial model (GSGAN).
5. A system for generating a prototype of a graphical user interface (GUI), the system comprising one or more processors and computer-readable instructions stored in tangible storage medium, the computer-readable instructions when executed by the one or more processors performs operations comprising:
acquiring a draft wireframe representing a GUI design, the draft wireframe including one or more wireframe components;
decomposing the draft wireframe into one or more component slices, each component slice including a respective wireframe component of the one or more wireframe components;
generating a component slice sequence including the one or more component slices and at least one additional component slice selected based on the draft wireframe;
constructing a wireframe based on the component slice sequence; and
generating a prototype of the GUI design based on the constructed wireframe,
wherein the machine learning model is a generative adversarial model, generating the component slice sequence is performed using a machine learning model including a generator, the generator configured to be trained by a first discriminator and a second discriminator,
wherein the first discriminator is configured to train the generator based on discriminating between real component slice sequences from a training data set and component slice sequences output by the generator, and
wherein second discriminator is configured to train the generator based on discriminating between real wireframes from the training data set and wireframes constructed from the component slice sequences output by the generator.
6. The system of claim 5 , wherein the additional component slice is selected based on a target platform and a target function.
7. The system of claim 5 , wherein generating the component slice sequence and constructing the wireframe is performed at least in part by a machine learning model.
8. The system of claim 5 , wherein generating the component slice sequence and constructing the wireframe is performed at least in part by a GUI wireframe generative adversarial model (GWGAN), and generating the prototype is performed at least in part by a GUI style generative adversarial model (GSGAN).
9. A computer program product, the computer program product comprising:
a tangible storage medium readable by a processing circuit and storing instructions for execution by the processing circuit for performing a method comprising:
acquiring a draft wireframe representing a GUI design, the draft wireframe including one or more wireframe components;
decomposing the draft wireframe into one or more component slices, each component slice including a respective wireframe component of the one or more wireframe components;
generating a component slice sequence including the one or more component slices and at least one additional component slice selected based on the draft wireframe;
constructing a wireframe based on the component slice sequence; and
generating a prototype of the GUI design based on the constructed wireframe, wherein generating the component slice sequence is performed using a machine learning model including a generator, the generator configured to be trained by a first discriminator and a second discriminator, the first discriminator configured to train the generator based on discriminating between real component slice sequences from a training data set and component slice sequences output by the generator, and where the second discriminator is configured to train the generator based on discriminating between real wireframes from the training data set and wireframes constructed from the component slice sequences output by the generator.
10. The computer program product of claim 9 , wherein generating the component slice sequence and constructing the wireframe is performed at least in part by a machine learning model.
11. The computer program product of claim 10 , wherein the machine learning model is a generative adversarial model.
12. The computer program product of claim 10 , wherein generating the component slice sequence and constructing the wireframe is performed at least in part by a GUI wireframe generative adversarial model (GWGAN), and generating the prototype is performed at least in part by a GUI style generative adversarial model (GSGAN).