All graphic design platforms have a bias. In any discipline, the medium through which one approaches the design affects the final output. Created in 2012 by Dylan Field and Evan Wallace, the design platform Figma is no exception. Through both guided functionalities and default settings Figma sways the designer’s hand to design in accordance with the methodologies laid out by the Swiss Style, also known as the International Typographic Style. A graphic design movement, originating in the 1950s, the Swiss Style placed emphasis on mathematical precision, clarity, and objectivity, “help[ing] earn designers a kind of professional status separate from artists”(Rhodes).

Karl Gerstner, a celebrated graphic designer and a major influence on the Swiss Style’s hallmark attributes, believed that a systematic approach to design would yield superior design solutions. As Gerstner wrote in his 1964 book Designing Programmes, “The creative process is to be reduced to an act of selection. Designing means: to pick out determining elements and combine them” (58). Here, Gerstner advocates for the Swiss Style’s characteristic emphasis on methodical objectivity: specifically, design that is clear and truthful, insofar as it commuincates straightforwardly with the viewer, without the designer’s personal aesthetics or ornamentations. Furthermore, Gerstner goes on to praise another tenet of the Swiss style, its modular approach: “Albert Einstein said of the module: ‘It is a scale of proportions that makes the bad difficult and the good easy.’ That is a programmatic statement of what I take to be the aim of ‘Designing Programme’”(61). Through modular design, designers form a larger design through repetition or rearrangement of smaller elements. Take, for example, creating a structure out of building blocks: the blocks will always be the same, but there are many ways in which they can be combined and arranged that yield different final formations.

Created more than half a century after the start of the Swiss Style movement, Figma software guides the designer through the Swiss approach through its design system functionalities. Figma’s design flow begins influencing the user at a granular level, by prompting the user to select project-wide type, color, and grid styles. Once the designer sets these parameters across the project, they can then create “components,”website features that range from a navigation bar to various cards or buttons. These capabilities in Figma create a flow of design that is similar to the ethos of the Swiss Style, placing uniformity, modular components, and design systems as the backbone of how a designer moves through a project.

Like the typical Figma user, Gerstner also had his own version of components. His approach to design was so objective and mathematical that he adapted Fritz Zwicky’s morphological box, a decision-making model intended for scientists to solve non-quantifiable problems, into an instrument that could be used for design. Gerstner named his own variation the Morphological Box of The Typogram, which defines both the criteria/parameters and the relative components to be used. He explains that, when designers use the morphological box, “The criteria [for the design ] are rough. As the work proceeds, of course, they are to be refined as desired. The components are to be made into parameters and new components are to be specified” (58). In other words, during the design process, initial criteria for elements of the design can be fluid: as a designer goes through the process of designing a user interface, for example, they might deal with specified branding guidelines, or hierarchy and organization of content. During the design process, such criteria may need to be changed. Figma’s modularized, systematic functionalities allow for a designer to easily change these across large bodies of work.

Like Gerstner’s morphological box, Figma allows designers to begin with a specific set of criteria to select from when designing but allows room for those criteria to change, effectively streamlining a process that was developed almost 50 years prior. Indeed, the Gerstner process of component creation is mirrored in Figma’s workflow, down to the very verbiage used within the program. Users create components at the beginning of the process; however, as the design progresses and criteria change, users can then alter those criteria via the original or ‘parent’ component.  Every instance of said component will then automatically change with it. Moreover, components in Figma can also possess variations, in which the designer can define a set of variables for a component, e.g., defining “hover” and “active” states for a button element, or embedding alternate sizing within the same component.

While Figma’s workflow largely invites designers towards adopting the Swiss Style, there are a number of default features that practically demand designers to do so. Aesthetically, Swiss Style typography has historically been sans-serif, left justified ragged right type (text which aligns to the left side of the page and breaks loosely at the right), with a restrained use of color. Meanwhile, the Swiss style also lays emphasis on mathematical precision, both in designers’ choice of grid systems and in their choice of typography. By default, Figma’s font setting presents a black sans-serif typeface on a white background, left justified and ragged right; as for mathematical precision, Figma’s program calculates leading, kerning, tracking, and font sizes down to the pixel and point. These fixed features move the designer towards following core principles of the Swiss Style.

Take, for example, creating a structure out of building blocks: the blocks will always be the same, but there are many ways in which they can be combined and arranged that yield different final formations.

Figma also features a built-in version history for each project, accompanied by detailed, pixel-perfect annotations of a design: specifying the distance between certain elements as 20px with a 40 px margin, for example, which allows a developer to replicate the design in code without needing to eyeball its proportions. These annotations ensure a smooth transition whenever the designer needs to hand off their design to the website developer. Figma’s built-in documentation features also facilitate client-facing presentations of web designs, during which process and rationale can be readily displayed. This feature echoes the Swiss belief in detailed documentation of both the final work and the process that produces it. In particular, Gerstner argued that documenting the design process and rationale behind it was crucial for achieving clarity and transparency in design.

My personal experience with using Figma has strengthened my ability to work within, and create, complex design systems. It allowed me to approach design in a more methodical and precise way. Simultaneously, the program creates a condition where, whether cognizant or not, contemporary designers like me understand and follow Swiss Style principles. That being said, I don’t think Figma’s influence on the design process is inherently good or bad; the design programs we use today all have an agenda, controlling how we move through the process of design, by suggestion and by default. It’s important for designers to be aware of this agenda, what one does under its influence, and why. Design, after all, is a series of purposeful choices. Figma is only one of them.

Works Cited

Gerstner, Karl. Designing Programmes. London, Alec Taranti Ltd, 1964. Excerpted in Graphic Design Theory: Readings From the Field, ed. Hellen Armstrong, Princeton Architectural Press, 2009, pp. 58-61.

Kulba, Bryan. “Celebrating Karl Gerstner. Swiss designer Karl Gerstner passed… | by Bryan Kulba.” Medium, 3 January 2017, https://medium.com/@bryanarchy/celebrating-karl-gerstner-b0ffbcf65c96. Accessed 10 October 2023.

Rhodes, Margaret. “The Swiss Designers Breaking Tradition.” Eye on Design, 12 June 2017, eyeondesign.aiga.org/the-swiss-designers-breaking-tradition/#:~:text=The%20clean%2C%20minimalist%20approach%20to,serif%20typefaces—Helvetica%2C%20mostly. Accessed 22 Mar. 2024.