diff --git a/notebooks/svg_variation_transfer_ui_widget.ipynb b/notebooks/svg_variation_transfer_ui_widget.ipynb index 7421ecb..096443c 100644 --- a/notebooks/svg_variation_transfer_ui_widget.ipynb +++ b/notebooks/svg_variation_transfer_ui_widget.ipynb @@ -331,7 +331,7 @@ "shape_orig = page_svg.get_shape_by_name(\"Dark / Text area / Rest\", require_unique=False) \n", "var_gen = SVGVariationsGenerator(shape=shape_orig, semantics=\"text area\", model=RegisteredLLM.GPT4O)\n", "\n", - "variations = var_gen.create_variations_sequentially_from_example(example_variations)\n", + "variations = var_gen.create_variations_from_example_present_at_once(example_variations)\n", "HTML(variations.to_html())" ], "metadata": { @@ -354,207 +354,6 @@ }, "id": "b5d4d84132ae869f" }, - { - "cell_type": "code", - "outputs": [ - { - "name": "stdout", - "output_type": "stream", - "text": [ - "To create the 'Focus' variation based on the provided example, we need to make the following changes to the original SVG:\n", - "\n", - "1. Change the background color of the main rectangle to `#2e3434`.\n", - "2. Add an inner stroke with color `#7efff5` and width `1`.\n", - "\n", - "Here is the modified SVG for the 'Focus' variation:\n", - "\n", - "```xml\n", - "\n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " Label\n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - "\n", - "```\n", - "\n", - "This SVG includes the necessary changes to create the 'Focus' variation, with the background color changed to `#2e3434` and an inner stroke added with color `#7efff5` and width `1`.\n", - "To create the 'Disabled' variation based on the provided example, we need to make the following changes to the original SVG:\n", - "\n", - "1. Change the background color of the main rectangle to `#18181a`.\n", - "2. Add an inner stroke with color `#2e3434` and width `1`.\n", - "3. Change the text color to `#8f9da3`.\n", - "\n", - "Here is the modified SVG for the 'Disabled' variation:\n", - "\n", - "```xml\n", - "\n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " Label\n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - "\n", - "```\n", - "\n", - "This SVG includes the necessary changes to create the 'Disabled' variation, including the background color, inner stroke, and text color adjustments.\n", - "To create the 'Error' variation based on the provided SVG, we need to make the following changes:\n", - "\n", - "1. Change the background color of the main rectangle to `#2e3434`.\n", - "2. Add a red border with the color `#ff3277` and a width of `1`.\n", - "3. Ensure the text and other elements remain the same.\n", - "\n", - "Here is the modified SVG for the 'Error' variation:\n", - "\n", - "```xml\n", - "\n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " Label\n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - " \n", - "\n", - "```\n", - "\n", - "This SVG includes the changes to the background color and the addition of the red border to create the 'Error' variation.\n" - ] - }, - { - "data": { - "text/plain": "", - "text/html": "

Original

\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n Label\n \n \n \n \n \n \n \n \n \n \n

Variations

Focus

\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n Label\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n

Disabled

\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n Label\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n

Error

\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n Label\n \n \n \n \n \n \n \n \n \n
" - }, - "execution_count": 9, - "metadata": {}, - "output_type": "execute_result" - } - ], - "source": [ - "variations = var_gen.create_variations_sequentially_from_example_1by1(example_variations)\n", - "HTML(variations.to_html())" - ], - "metadata": { - "collapsed": false, - "ExecuteTime": { - "end_time": "2024-06-19T14:06:34.627265400Z", - "start_time": "2024-06-19T14:05:03.600445200Z" - } - }, - "id": "531f21b33c70e304", - "execution_count": 9 - }, { "cell_type": "code", "outputs": [ diff --git a/src/penai/variations/svg_variations.py b/src/penai/variations/svg_variations.py index 2b3198d..898d2a3 100644 --- a/src/penai/variations/svg_variations.py +++ b/src/penai/variations/svg_variations.py @@ -293,15 +293,15 @@ def create_variations_sequentially( variations.write_results(self.result_writer) return variations - def create_variations_sequentially_from_example( + def create_variations_from_example_present_at_once( self, example_variations: SVGVariations, - write_results: bool = True, ) -> SVGVariations: - """Generates variations sequentially, one at a time, based on an example set of variations - that are presented to the model at once. + """Generates variations based on an example set of variations that are presented to the model initially. + Given the example variations (original, (variation_1, variation_2, ...)), the model is asked to generate, + the same kinds of variations for another UI element - one at atime, but in a single conversation. - :param example_variations: the example variations to use as a basis + :param example_variations: the example variations :return: the variations """ system_prompt = ( @@ -337,36 +337,21 @@ def create_variations_sequentially_from_example( variations_dict[name] = code_snippets[0].code variations = SVGVariations(self.svg, variations_dict, conversation) - if write_results: - variations.write_results(self.result_writer) + variations.write_results(self.result_writer) return variations - def create_variations_sequentially_from_example_1by1( - self, - example_variations: SVGVariations, - ) -> SVGVariations: - # This applies the function create_variations_sequentially_from_example multiple times - # such that the model is presented with only a single example in each conversation - all_variations_dict = {} - example_variations_dict = example_variations.variations_dict - for name in example_variations_dict: - single_example_variations_dict = {name: example_variations_dict[name]} - single_example_variations = SVGVariations( - example_variations.original_svg, single_example_variations_dict - ) - variations = self.create_variations_sequentially_from_example( - single_example_variations, write_results=False - ) - all_variations_dict.update(variations.variations_dict) - return SVGVariations(self.svg, all_variations_dict) - def create_variations_from_example( self, example_variations: SVGVariations, ) -> SVGVariations: - # This is a dedicated solution for the "from example" use case, where the model is to generate - # one variation at a time based on a single example + """Generates variations based on an example set of variations that are presented to the model one + at a time, i.e. in each conversation, the model is given one example (original, variation) and is + asked to create the same type of variation for another UI element. + :param example_variations: the example variations; if there are multiple variations, then there + will be a separate conversation for each variation asking the model to create that kind of variation + :return: the variations + """ system_prompt = ( "You are a design assistant tasked with creating a variation of an SVG. " "You will be presented with an example, i.e. an original design and a variation thereof. "