# Building a Brand Identity With Code

Category:
Design
Published:
JUN 8, 2023
Building a Brand Identity With Code

Recently had a fun branding project come through at my day job. One of my unused brand directions was the idea of using Lissajous curves to form parts of the logo and various brand elements.

Lissajous curves, named after the French mathematician Jules Antoine Lissajous, are mathematical visualizations that represent the motion of two perpendicular harmonic oscillations. These curves are formed by plotting the coordinates of points that correspond to the simultaneous values of the two oscillating variables. The easiest way to design these was to have a program do it for me, so that's what I did. With the help of ChatGPT, I built a Figma plugin to draw out the curves based on whatever parameters the user selects.

Plugin details:

• a: This is the frequency of oscillation along the x-axis for the Lissajous curve. The value of 'a' influences the shape and complexity of the curve, determining how many 'loops' it forms in the horizontal direction.
• b: Similar to 'a', 'b' is the frequency of oscillation along the y-axis. It determines how many 'loops' the curve forms in the vertical direction.
• delta: This is the phase shift between the two sinusoidal functions that generate the Lissajous curve. By altering the value of 'delta', you can change the relative positions of the curves in the x and y directions, leading to a wide variety of different shapes.
• numPoints: This is the number of data points used to draw the Lissajous curve. It's effectively the resolution of the curve; a larger number of points will result in a smoother curve, while fewer points will create a more 'stepped' or polygonal appearance.
• scale: This is a scaling factor that influences the overall size of the Lissajous curve. By adjusting 'scale', you can make the curve larger or smaller without changing its basic shape.