Your Web News in One Place

Help Webnuz

Referal links:

Sign up for GreenGeeks web hosting
May 7, 2021 10:15 pm GMT

Modern Logo Maker Using Variable Fonts

Why I Wanted to Create Just Another Logo Maker

I myself have a lot of dev side projects, my friends do too, and given my profession as a branding designer I chat a lot with small businesses and startups that ask for a low-budget logo.

While I cant take on small logo projects, these chats usually leave me feeling that Im not very helpful. I find myself explaining that good logo design is based on brand strategy which requires a decent amount of market research, going through strategic positioning exercises, and so on and so forth. In fact, in another side project, I put all of our company strategy workbooks [https://mmarchny.com/branding-workbooks/] online for people to use. No luck! Everybody wants to jump into logo making because theyd like to have one ready in the next few days.

I searched many times for an online logo maker that I can actually recommend as a designer. Wix, Canva, Shopify and so many others have logo maker appsbut they all seem to create logos with cheesy icons and typefaces that no graphic designer I know would ever use. So, I created Mojomox [https://mojomox.com].

My Take On a New Type of Logo Maker

I usually recommend creating a simple wordmark, no icon; simply setting the brand name in a geometric typefacesomething that looks clean and professional. That way a tight budget is accommodated and people can focus on their business or product development. Often, theres no product-market fit yet anyway so from a brand strategy standpoint, writing a fleshed-out brand book and creating designs based on that would be a waste of time and money.

But how does one stand out with a basic geometric wordmark logo? My personal designer heart has always been married to typography and typefaces. You show me a random letter and Ill tell you what typeface that is ;) So Ive been following the variable fonts development and their progressing implementation capabilities within modern browsers with much excitement for the past few years.

individual font weights

roundness of corners

stylistic sets

Last December, as a new side project, I decided to create my first variable font. I sketched out the different font axes that would allow for lots of design freedom: super individual font weights (instead of 100, 200, 300 etc. you can set the weight to precisely to 223, for example), widths (from condensed to extended) and other fun settings, like the roundness of corners. Additionally, and this is simply an OpenType feature, with up to 20 stylistic sets, you can define lots of different letter Ms (or, in fact, any letter). Given the variety of adjustments, I figured a variable font would be a great baseline for creating individualized designs.

I know theres room for improvement and taking the concept of customization using variable fonts further but my first version of a new type of logo maker consists of the following three steps:

  1. Type out the company name and select baseline design from auto-generated options.
  2. Change typeface settings, mix and match letters and pick colors.
  3. Export logo file and test logo on your website.

On top of the variable font features, you can of course use basic CSS for tracking (letter-spacing) the logo, switch casing (text-transform) and play around with colors to further customize your logo.

Id love to hear your thoughts: https://mojomox.com/
Thank you, Saskia


Original Link: https://dev.to/saskiaketz/modern-logo-maker-using-variable-fonts-46ff

Share this article:    Share on Facebook
View Full Article

Dev To

An online community for sharing and discovering great ideas, having debates, and making friends

More About this Source Visit Dev To