SYMPHOSIZER – Playing with SF Symphony’s new Visual Identity

This content originally appeared on Bram.us and was authored by Bramus!

At first sight the new visual identity for the San Francisco Symphony (pictured below, on the right) looks a bit off …

Those letters sure look a bit oddly sized, no? Turns out there’s a dynamic drive behind them:

Leveraging new creative technology including variable font design, our new visual language (of which the logo is just the beginning) will use typography itself to bring the essence of sound and music to life.

Bringing typography to life through sound? The SYMPHOSIZER website let’s you do exactly that.

Let the site have access to your microphone and start making some noise!

Lifting up the hood using view-source: they use p5 to capture the audio and after some processing pass the resulting numbers to font-size, font-variation-settings, and transform: skew().

splitChars[wornum].chars[i].style.fontSize = fontSize + 'px';
splitChars[wornum].chars[i].style.fontVariationSettings = "'vrsb'" + isTop + ", 'hght'" + smoothH[i] + ", 'ital'" + smoothI + '';
splitChars[wornum].chars[i].style.transform = 'skew(' + smoothSkew + 'rad)';

SYMPHOSIZER →
San Francisco Symphony – Visual Identity →

This content originally appeared on Bram.us and was authored by Bramus!

Print Share Comment Cite Upload Translate Updates

APA

Bramus! | Sciencx (2021-02-26T23:14:46+00:00) SYMPHOSIZER – Playing with SF Symphony’s new Visual Identity. Retrieved from https://www.scien.cx/2021/02/26/symphosizer-playing-with-sf-symphonys-new-visual-identity/

MLA

" » SYMPHOSIZER – Playing with SF Symphony’s new Visual Identity." Bramus! | Sciencx - Friday February 26, 2021, https://www.scien.cx/2021/02/26/symphosizer-playing-with-sf-symphonys-new-visual-identity/

HARVARD

Bramus! | Sciencx Friday February 26, 2021 » SYMPHOSIZER – Playing with SF Symphony’s new Visual Identity., viewed ,<https://www.scien.cx/2021/02/26/symphosizer-playing-with-sf-symphonys-new-visual-identity/>

VANCOUVER

Bramus! | Sciencx - » SYMPHOSIZER – Playing with SF Symphony’s new Visual Identity. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2021/02/26/symphosizer-playing-with-sf-symphonys-new-visual-identity/

CHICAGO

" » SYMPHOSIZER – Playing with SF Symphony’s new Visual Identity." Bramus! | Sciencx - Accessed . https://www.scien.cx/2021/02/26/symphosizer-playing-with-sf-symphonys-new-visual-identity/

IEEE

" » SYMPHOSIZER – Playing with SF Symphony’s new Visual Identity." Bramus! | Sciencx [Online]. Available: https://www.scien.cx/2021/02/26/symphosizer-playing-with-sf-symphonys-new-visual-identity/. [Accessed: ]

rf:citation

» SYMPHOSIZER – Playing with SF Symphony’s new Visual Identity | Bramus! | Sciencx | https://www.scien.cx/2021/02/26/symphosizer-playing-with-sf-symphonys-new-visual-identity/ |

Please log in to upload a file.

There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.