Technology for managing graphic design using metadata relationships
Systems and methods for managing graphic design using metadata relationships are described. According to certain aspects, an electronic device may display a visual design including a set of design elements, each of which may be contained within a corresponding container. The electronic device may receive a selection to spatially adjust a design element, and may determine a modification to the design element based an element behavior of the design element and/or a container behavior of the corresponding container. The electronic device may display, in the user interface, the design element reflecting the modification.
1. A computer-implemented method of modifying a visual design comprising a design element, the method comprising:
displaying, in a user interface, the visual design comprising at least the design element in a first configuration and having associated a container in which the design element is contained, wherein the design element comprises textual content and has an element behavior that preserves a payload of the textual content within the container, and wherein the container that contains the design element in the first configuration has a first amount of rows;
receiving, via the user interface, a selection to spatially adjust the design element from the first configuration to a second configuration, the second configuration resulting in a modified container for the design element;
determining, by a processor based on the selection to spatially adjust the design element, a modification to the design element to preserve the payload of the textual content of the design element within the modified container, including:
determining an amount of characters included in the textual content,
determining, based on the amount of characters included in the textual content, (i) a second amount of rows that fit within the modified container, and (ii) an amount of spaces per row of the second amount of rows, wherein the second amount of rows is different than the first amount of rows, and
determining that a size of the textual content fitting in the second amount of rows and the amount of spaces per row is larger than a size of the textual content fitting in the first amount of rows; and
displaying, in the user interface, the design element in the second configuration and reflecting (i) the payload of the textual content of the design element being preserved within the modified container and (ii) the textual content fitting in the second amount of rows.
2. The computer-implemented method of claim 1 , wherein the container that contains the design element in the first configuration has a first amount of spaces in each row of the first amount of rows.
3. The computer-implemented method of claim 2 , wherein the first amount of spaces is different than the amount of spaces.
4. An electronic device for modifying a visual design comprising a design element, comprising:
a user interface for displaying content;
a memory storing non-transitory computer executable instructions; and
a processor interfacing with the user interface and the memory, wherein the processor is configured to execute the non-transitory computer executable instructions to cause the processor to:
cause the user interface to display the visual design comprising at least the design element in a first configuration and having associated a container in which the design element is contained, wherein the design element comprises textual content and has an element behavior that preserves a payload of the textual content within the container, and wherein the container that contains the design element in the first configuration has a first amount of rows,
receive, via the user interface, a selection to spatially adjust the design element from the first configuration to a second configuration, the second configuration resulting in a modified container for the design element,
determine, based on the selection to spatially adjust the design element, a modification to the design element to preserve the payload of the textual content of the design element within the modified container, including:
determine an amount of characters included in the textual content,
determine, based on the amount of characters included in the textual content, (i) a second amount of rows that fit within the modified container, and (ii) an amount of spaces per row of the second amount of rows, wherein the second amount of rows is different than the first amount of rows, and
determine that a size of the textual content fitting in the second amount of rows and the amount of spaces per row is larger than a size of the textual content fitting in the first amount of rows, and
cause the user interface to display the design element in the second configuration and reflecting (i) the payload of the textual content of the design element being preserved within the modified container and (ii) the textual content fitting in the second amount of rows.
5. The electronic device of claim 4 , wherein the container that contains the design element in the first configuration has a first amount of spaces in each row of the first amount of rows.
6. The electronic device of claim 5 , wherein the first amount of spaces is different than the amount of spaces.
7. A non-transitory computer-readable storage medium configured to store instructions executable by a computer processor, the instructions comprising:
instructions for displaying, in a user interface, a visual design comprising at least a design element in a first configuration and having associated a container in which the design element is contained, wherein the design element comprises textual content and has an element behavior that preserves a payload of the textual content within the container, and wherein the container that contains the design element in the first configuration has a first amount of rows;
instructions for receiving, via the user interface, a selection to spatially adjust the design element from the first configuration to a second configuration, the second configuration resulting in a modified container for the design element;
instructions for determining, based on the selection to spatially adjust the design element, a modification to the design element to preserve the payload of the textual content of the design element within the modified container, including:
instructions for determining an amount of characters included in the textual content,
instructions for determining, based on the amount of characters included in the textual content, (i) a second amount of rows that fit within the modified container, and (ii) an amount of spaces per row of the second amount of rows, wherein the second amount of rows is different than the first amount of rows, and
instructions for determining that a size of the textual content fitting in the second amount of rows and the amount of spaces per row is larger than a size of the textual content fitting in the first amount of rows; and
instructions for displaying, in the user interface, the design element in the second configuration and reflecting (i) the payload of the textual content of the design element being preserved within the modified container and (ii) the textual content fitting in the second amount of rows.
8. The non-transitory computer-readable storage medium of claim 7 , wherein the container that contains the design element in the first configuration has a first amount of spaces in each row of the first amount of rows.
9. The non-transitory computer-readable storage medium of claim 8 , wherein the first amount of spaces is different than the amount of spaces.