Config 2024
Duration: 8 weeks
Role: Designer
Tools: Figma, Adobe CC, HTML/CSS, Javscript
Collaborators: None
Role: Designer
Tools: Figma, Adobe CC, HTML/CSS, Javscript
Collaborators: None
![](https://freight.cargo.site/t/original/i/4eed7b8d1c735f12c123bf2f66aa521088e06b282c1ac9810621dc6fc4eb82b6/logotype2.png)
![](https://freight.cargo.site/t/original/i/8ce782acfe21b5f25c236c1fdd46ee37ce694d99367473724f1ce06bba681afa/logotype1.png)
![](https://freight.cargo.site/t/original/i/55339114a4aed63e1ab3272e57561913a5d9563c96fab6e45290089124e52bad/logotype7.png)
![](https://freight.cargo.site/t/original/i/9548d57fe0f215a368f466fe331884629b67c2cbcb444da57708529184d9bc3f/logotype6.png)
![](https://freight.cargo.site/t/original/i/2a5143fcfbc73f3ef578c6fee2df86a0d9953049d4f160d09cf62b880d578008/logotype5.png)
![](https://freight.cargo.site/t/original/i/0f9645f6e2134028c500f548ec05b24c2f72354b27b3c57ee859b680e1ce6dfb/logotype4.png)
![](https://freight.cargo.site/t/original/i/513a91515029518a8368b3b6f9e119610e33b91789ae2e6fda260e316060ab19/logotype3.png)
Project Space
I created a design system for Config 2024. Config is a speaker hosted by Figma where designers, developers, product managers, and more come to talk about the design industry and share their insights.
The design system I created revolved around the principles that make Figma unique: collaboration, design, systems, and development. I took a generative approach to create the different assets for this system to show the blurring of lines between design and code.
The design system I created revolved around the principles that make Figma unique: collaboration, design, systems, and development. I took a generative approach to create the different assets for this system to show the blurring of lines between design and code.
Logotype
![](https://freight.cargo.site/t/original/i/9f525871d9ad7cb1d10a47229d874f2165349f2ef13468e6dd2389dc490eb04c/Config_Thumbnail.gif)
With each click, this javascript function creates a completely unique variation of the logotype. The logotype consists of 10 different components of varying colors, sizes, and positions.
Logotype at Scale
![](https://freight.cargo.site/t/original/i/d7963ca07244e2f576a920315853a114a77addc86017428db4ecb4c96917f412/Screenshot-2023-04-20-at-3.32.52-PM.png)
![](https://freight.cargo.site/t/original/i/6487e10a64865babc39c726c763e5617eff430ab45c298500f10a0db8460b16a/Comp_1_AdobeExpress.gif)
At scale, I simplify the logotype down to 4 symbols. Symbols are interchangeable and also randomize between their fixed positions; scale does not change.
Logotype Spacing
![](https://freight.cargo.site/t/original/i/63a031b10063e04e7cabdb09841bbeb59006a1d7f4e2678b009eb3085750c7fd/sizing.png)
The logotype shines when given space to shine.
System
![](https://freight.cargo.site/t/original/i/3ad54acb69cc65aab367ed452a6f95134480f50b7b69382298f80c4fefbb0cb1/Typeface.png)
![](https://freight.cargo.site/t/original/i/e20466fde3ac62802f864d91b6d9d1dc5d5fca61500e848484722608c404ff29/Typeface-Mono.png)
![](https://freight.cargo.site/t/original/i/81da5683f096f97581a384e86d6bcc2b118acc9650d54aca28e8f4544e536128/Color.png)
![](https://freight.cargo.site/t/original/i/4c84f838f55847e565a0c94da7797b8a7fe6c3e3022e9c20530a37d404c7c8a2/Iconography.png)
Applications
![](https://freight.cargo.site/t/original/i/5d5fa2970e39279d39af3b9d17168d55985d74a4d255e8e4e3449dd6b0a2276c/keynote.png)
![](https://freight.cargo.site/t/original/i/4954242a499ab71b34af73df45c0a5976f18ea060cbc584d39d5527f2f820dc7/makerspace_small.png)
![](https://freight.cargo.site/t/original/i/48d5495da227582e450ec1c824b7441135c9c4ee1ecfa05576bc78d9beb4c843/glueposter_small.png)
![](https://freight.cargo.site/t/original/i/008fd7c9813dd568e85fe8d3eac80bf06ffb9c6ffba17960eebff4b4de11e5a3/businesscardsmockupbackinverted_small.png)
![](https://freight.cargo.site/t/original/i/934575e8f365614316016e95c441bae556109f7dcf95b494f8e122d78170a5d4/tshirt_small.png)