Visualgui Updates

I have a subtle and not-so-subtle changes to the blog. For typographic, I added IntelOne Mono, designed by Fred Shallcrass, into the mix for coding examples and meta text (date and category).

For the not-so-subtle change, I added Google Adsense. As much as I despise running ads, I need to cover the hosting cost to run this blog. The ads turned out to fit well with my design. I had always used the spot right below my logo for promotions, but I didn’t always have something to promote. Now it is a perfect spot for ads.

I wish I have other ways to pull in some revenue stream for this blog, but I don’t. I experimented with Amazon Affiliate, but it didn’t worth the effort. I don’t know how much I will get from Adsense, but I want to experiment with it for a few weeks. The ads don’t seem to distract from the reading experience. In fact, the ads look quite nice with the design on larger screens.

New Wordmark for simplexpression

I have been struggling to come up with a wordmark for simplexpression. Choosing the typeface and designing the wordmark aren’t as simple as I had expected. I have been working and thinking about it for a while. This morning, Mireille, designed by Anita Jürgeleit, suddenly came to mind. I immediately licensed it, but I purchased the web format instead of an OpenType or TrueType format. Instead of using Illustrator, I created the wordmark in CSS. My wife, the true talent behind simplexpression approved it. I hope it will inspire her to create new pieces. Take a look at the new simplexpression wordmark.

Bụi đời

As I was reading Nguyễn Phan Quế Mai’s Dust Child, I made note of all the Vietnamese proverbs sprinkled throughout the novel so I could put together a Vietnamese typographic sample. For the design of the page, I wanted to use sticky notes to highlight the proverbs. To complement the sticky note concept, I set the proverbs in marker-style Shantell Sans, designed by Shantell Martin, Stephen Nixon, and Anya Danilova. The header and footer are set in Aneto, designed by Veronika Burian, José Scaglione, Azza Alameddine, and Roxane Gataud. Take a look and enjoy.

Identity Crisis

This blog is having an identity crisis. I changed the wordmark once again.

I am still using DJR’s Megazoid, but I am not doing any customization. I am playing around with the shade. I am taking it back to the old school. Since I made the logo filling up the browser, I had to remove the big hero typography at the top. I brought it to thee bottom instead. Now I have both big top and bottom.

It’s nice to have a personal blog I can play with the design. I don’t have to take the branding too seriously. I am digging this direction for now, but I can change it tomorrow, next month, or next year. We’ll see how it goes.

Việtjazz Sample

While driving and listening to Donny Trương Presents Việtjazz, I came up with a sample for Vietnamese Typography. I picked out my 10 favorite pieces from my collection. Each song gets a typographic treatment. I also paired each song with a painting from the late great Đinh Cường. Link to each song is included on the artwork for your enjoyment. Take a look.

Macan Speaks Vietnamese

A versatile Neo-Grotesque type family, Macan, TIGHTYPE, balances utility and vivacity. While Macan focuses on functionality, Macan Stencil brings quirky quality to the family. Both solid and stencil versions support Vietnamese. Its acute, grave, and hook above stack to the right of its circumflex. I had the pleasure of reviewing Vietnamese diacritics for Macan. Check out the Macan Vietnamese specimen.

Revising Visualgui Wordmark

As you can see, the Visualgui wordmark gets a bit of an update. If you are reading this post in an RSS reader, make sure you visit my website. I still use David Jonathan Ross’s Megazoid as a starting point, but I modified the letters quite a bit. I was experimenting with connecting two letters together—like ligatures. Because of Megazoid’s geometric shapes, the letters fit together in an interesting way.

What is Visualgui anyway? Almost twenty years ago, I came up with the name because I loved the sound of the word “visual”. I was also starting out with visual design. GUI obviously stands for graphical user interface. It also means “gui” with the short i instead of the long y because I am short gui.

I must confess, I find Visualgui to be silly and sometimes embarrassing even to this day. I have thought of changing it, but it has stuck with me for so long, I might as well embrace it. Ever since I got the name, I struggled with creating my own wordmark. I was never satisfied with what I came up with. The previous version, which was set in Fit, also designed by David Jonathan Ross, was the longest I had used.

After five years, however, I wanted to make a change. The earlier version of the new wordmark was straightforward. The only modification was creating the lower a from the uppercase G. With the revision, I modified every letter.

I am loving the new wordmark. I hope you like it too. If you have any feedback, please drop me an email. I also sincerely hope that David doesn’t mind me modifying his typeface to make a somewhat unique brand for myself.

Visualgui 2023: Change & Aneto

The new design for 2023 is here. Unlike previous years, in which I came up with the new design a couple of weeks before the new year, Visualgui 2023 comes a bit late. I was catching the Designer’s Disease: “most of us catch it at one point or another but evolve & find a new formula—one that takes everything in you to make.” Yes, I stole that one from Nas’ King’s Disease 3. I didn’t know what to design for a while and then I overcame the disease.

As you can see, I have a new logo. After using the previous logo for five years, I just wanted to come up with a new one, which set in Megazoid, designed by David Jonathan Ross. I love this quirky typeface. Megazoid is chunky, raw, weird, and anything but boring.

For typography, I selected the two typefaces that I had the pleasure of contributing to the Vietnamese diacritics. The main body copy is set in Aneto, designed by Veronika Burian, José Scaglione, Azza Alameddine, and Roxane Gataud. I love the readability of Aneto. To accompany Aneto, I chose Change, designed by Alessio Leonardi, for large headings as well as secondary texts. The two complement each other nicely. For coding, I kept Input Mono, designed by David Jonathan Ross.

For the huge text on the homepage, I chose Aneto Skyline, which is part of the Aneto family. I will also use Change in the future. I hope you’ll like this new design.

Recent Projects at Scalia Law

I made a major MODX upgrade from version 2.8.4 to 3.0.2. It took me several months to test to make sure everything works as expected. When I attempted to upgrade from 2.8.3 to 3.0, most of the dynamic pages broke. I am glad that I made the exact copy of the production site and made the test upgrade first. If I did a live upgrade, it would have been a disaster. Fortunately, version 3.0.2 fixed all of the issues.

I work with the alumni staff to update the alumni landing page. The featured stories are dynamically pulled in from our spotlights. When we want a spotlight to appear on the alumni page, we simply check the alumni box under news categories in the template variables.

We launched a new blog, Voices for Liberty, for the Liberty & Law Center using WordPress.

I have been cleaning up Google Analytics and moving from UA to GA4.

We have lots of tracking on our site. Google Tag Manager alone has 27 tracking codes ranging from Google Ads to Google Conversions to LinkedIn. In addition, we have a few pixel trackings. Since I don’t have access to Google Ads or Linkedin Ads accounts, I can’t tell which tracks are still active and what types of data are being tracked. Should we put together a privacy statement to be more transparent with the users?

Creating a Typographic System With Variable Fonts

I was asked to put together a last-minute fact sheet for the Scalia Law fall 2022 entering class. The goal was to showcase the numbers, such as 2114 applicants, 415 admitted, and 53% women. Because of the time constraint, I decided on a typographic direction.

Based on the provided content, I created a nine-column grid system to organize all the numbers and the corresponding texts. For typesetting, I chose Acumin, designed by Robert Slimbach, for its variable fonts, which provided a wide range of weights and widths. Once the grid system was in place, I filled in the columns with the numbers. While experimenting with variable fonts, I discovered that I could keep the weights constant, but change the widths based on the digits of the numbers. The longer the digits the narrower the glyphs and vice versa.

I ended up creating a typographic system, in which the numbers stayed balanced but dynamic. The result was simple on the surface, but sophisticated underneath with a solid grid and typographic foundation. This was one of the reasons I loved working with variable fonts. They offered limitless flexibility and precise control at the same time. Take a look at the high-resolution version of the fact sheet.

Contact