Visualgui 2022 Iteration 2: Warbler

Welcome to the second iteration of this blog. Warbler, a new text face David Jonathan Ross has sent out to the Font of the Month Club yesterday for February, has prompted the change.

I have been a member of the club from the beginning and I appreciated all the display fonts, but a text face is rare to come by. Even though Warbler Text is still a work in progress, especially with Vietnamese diacritics, I can’t wait to use it and this blog is a perfect place to experiment. Stephen Nixon once quipped, “I like how @visualgui handles this: he updates the fonts on his blog frequently … like once a month, I think?” Whenever I get new fonts, I tend to update this blog to put them to use.

Although the body text has changed to Warbler, I still keep Forma DJR for display and small texts. I also changed the colors to make it easier on the eyes for reading. In addition, I moved the main column to the middle and the sidebar to the left. Thanks to CSS Grid, swapping columns is so easy.

Since we are celebrating Vietnamese New Year this week, this little update is fitting with the holiday spirit. Wishing those who celebrate Lunar New Year with plenty of love, health, and wealth. Stay strong like tigers.

Vietnamese Bree

When Vik and José sought out my advice on Vietnamese diacritics for one of their award-winning font families, Bree already supported the Vietnamese language. Upon reviewing the typeface, I noticed its diacritical marks were lacking the handwriting qualities that gave Bree its friendly yet distinctive voice. In addition to their generic shapes, the marks were strangely connected to each other, specifically the acute was attached to the right side of the circumflex and the grave was attached to the left side of the circumflex.

Based on my suggestions, José did a complete overhaul of Bree’s diacritical marks. With attention to the details, he incorporated the handwriting touches and organic shapes from the base letters into the diacritical marks. In particular, he redrew the tilde to give it more curves and added the bottom tail to the hook above to give it a humanist touch. In combined marks, he detached the acute and the grave from the circumflex and repositioned all the stacking accents to the right of the circumflex for consistency, which helped with readability on long-form texts. He also reworked the ư and ơ horns to make sure they were harmonized.

After many rounds of revisions, I was happy to see that the diacritics have become part of the letters. I appreciated José’s commitment to get it right. He sweated every detail to make the diacritical marks flow with the base letters. I can’t wait to see more Vietnamese texts set in Bree.

Visualgui 2022: Forma DJR

Welcome to the 2022 rendition of Visualgui. If you’re reading this from your favorite RSS reader, you might want to hop over to your favorite browser to see the new change. As a tradition, I try to do a major redesign of this blog for each year then I would follow up with several iterations throughout the year.

For 2022, the major change is typography. In the past few years, I had always drawn to a serif text face for reading content, but I am switching it up for this redesign. Forma DJR, designed by David Jonathan Ross, is not a new typeface, but it was recently updated with Vietnamese support. I am proud to have played a small part in it. When David sent me the test fonts to review, he was not sure if the straight horns (ư and ơ) were too unconventional for reading. I assured him that they weren’t getting in the way and I alway appreciated when designers like David pushed the tradition. I have no trouble reading Vietnamese texts set in Forma DJR.

In addition to language support, David turned the Forma DJR family into variable fonts, which offered so much flexibility for a typographic system. I love the ability to play with font weights and optical sizes with just a few lines of CSS and see the immediate results in a browser. I can set large headlines, body copy, and small text from just one variable font. Variable font is not only convenient, but also a huge time saver. If I have the option between static and variable, I would go for the latter every time.

For the layout, I wanted to bring back the sidebar. A blog isn’t a blog without its sidebar companion. For large screens, I wanted to fill up as much space as possible; therefore, I brought back not one but two sidebars. CSS Grid makes responsive grid-based layouts fast and easy and this redesign gave me the opportunity to implement it. Even though the grid system was drawn from print, CSS Grid is native to the web. I could change from one to two to three columns depending on the screen size.

Finally, I got tired of gray text on white background for light mode and white text on black background for dark mode. I wanted to bring in a different color. I don’t even know the name of the color I am using for this new design. I pulled it from a text file that contained a list of my favorite colors in hex values I had found and saved in the early 90s. Back then websites were much more colorful than now.

I hope you like the new design.

I Love Ngoc Lan is Back On WordPress

So I decided to bring back to WordPress. I didn’t want to use DigitalOcean because it would take too much work to setup WordPress and to migrate the site over. I definitely didn’t want to go back to HostPapa; therefore, I needed to find an alternative. WordPress recommends three hosting companies: BlueHost, DreamHost, and SiteGround. I have heard of the first two for years, but not so much the third one.

After reading a bit about SiteGround, I was drawn to its WordPress Automatic Migrator. I signed up for the StartUp plan. Setting up WordPress was a click away. I didn’t even have to touch the config file or the database. I installed the WordPress Automatic Migrator plugin on HostPapa, pasted the migration token, and voila. The migration process took less than five minutes. I switched the IP address and that was it. My jaw dropped. Everything worked just as expected.

I am really dig SiteGround. Give SiteGround a shot if you just want to get WordPress up and running quickly. If you want to migrate your site off HostPapa, SiteGround is the way to go.

Visualgui 2021 Iteration 5: Captura Now

In less than a month, I switched up the design of this blog again. I still keep the typefaces: Loretta, designed by Abel Martins and Joana Correia and Captura Now, designed by Anita Jürgeleit. I got rid of the random Unsplash photos. They made the website fun, but I got tired of them quickly. They overpowered my words.

For the fifth iteration, I refocused on the typography.I increased the font size and made the layout wider. Nothing is groundbreaking, but lots of whitespace to breath with an imageless design. I hope this is the last iteration until 2022. With that being said, I always make changes this blog. It’s my personal playground where I get to experiment quite a bit. I am glad someone noticed:

I like how @visualgui handles this: he updates the fonts on his blog frequently … like once a month, I think?

I hope you like this new layout.

Scalia Law’s Events Calendar

After more than a decade of using an outdated calendar system for the law school, we have finally switched to a modern calendar system using WordPress. When it comes to calendar, WordPress has tons of choices to choose from. After some researching and experimenting, I selected The Events Calendar plugin.

The Events Calendar has a simple interface that is integrated with WordPress’s UI. It also has a decent layout that adapts well with our existing theme. It took me a few hours to set up and moved the events over. The nice thing about being powered by WordPress is that we can invite law school members to post their own events instead of sending them to us.

My supervisor is happy with the new calendar. We can finally sunset the expensive and outdated system. I am not sure why we waited this long. I should have take the lead and just do it. Take a look.

Designed the Monument for My Mother

After seven months, my mother’s monument had finally arrived and had been installed at her gravesite last Tuesday. I was anxious and nervous. I prayed that it would turn out the way I had expected. We had worked so hard on the design and I wanted to make sure that every detail was correct. On Sunday, I took my family to visit her grave and I was relieved that her monument turned out perfect. The black granite headstone shipped from India looked gorgeous. The smooth, curvy shapes added a nice touch to the headstone. The heart-shaped jade was firmly recessed into the stone with epoxy. Finally, the typesetting was excellent.

When I shopped around for my mother’s monument, I needed someone not only I could trust but also someone with patience and understanding. Even though we had to paid a bit more, I went with Heritage Monuments, which is a division of Charles F. Snyder Funeral Home that provided exceptional funeral service for my mother. I worked closely with Kathy Snyder Guidos who was very patience and understanding, especially when it came to typesetting.

At first, I did not understand the process; therefore, I wanted to set the text with Queens, designed by Sebastian Losch, to match the tribute website I had created for my mother. It turned out that I couldn’t use any typeface I wanted. I had to choose one of the typefaces from the catalog. I went with Garamond, but it didn’t work either because I wanted to set the text in a block. The only typeface that could accommodate the block was Modified Roman, which is a modified version of Time New Roman. Ms. Guidos and I went back and forth countless of iterations to make sure the alignment, the words, and the Vietnamese diacritics were correct. I didn’t want to be an annoying client, but Ms. Guidos had reassured me that they won’t start the project until I was completely satisfied with the design. I was grateful for her accommodation.

In addition to the text, I wanted to include a heart-shaped jade (my mother used to wear) on the headstone. Ngọc (Jade) was her middle name and my cousin, Karen Huỳnh, had shared an important detail about Jade. She wrote:

[W]hen our grandfather (her Dad) gave her the middle name, 玉 (Yù) in Chinese, translated to Ngọc in Vietnamese, he had in effect shaped her person, inscribed, etched, and carved her personality, character, and temperament. This beautiful name 玉 (Yù) or Ngọc means Jade in Chinese. In Chinese tradition and culture, 玉 (Yù) represents “fair, pure, and graceful (as in a woman).” Your Mom is the embodiment of these wonderful qualities… Looking back at your Mom’s life, I believe that her life experiences undeniably reflect the qualities of jade described above. What a special precious gem your Mom was! As a person, as a daughter, as a mother, as a grandmother, as an aunt, she truly lived a life befitting the name, 玉 (Yù).

I cried with tears of joy that her monument turned out well. It was the last thing I could do for her. I love her and miss her everyday.

Scalia Law Reflects on September 11

I launched a webpage to provide a space for the law school community to reflect on September 11, 2001. Some heartfelt recollections have been posted. Amy Sarina writes:

As a country, we vowed to never forget but America has forgotten. I remember a sense of unity and togetherness after 9/11. That’s not the America I feel today and the insurrection on January 6th reinforced my feeling of despair for this country. “We will never forget” – I feel so alone in those words. America has forgotten. Cognitively as a country, we remember for history’s sake. But it isn’t in our bones and in isn’t in our spirit anymore.

I have similar sentiment.

Visualgui 2021 Iteration 4: Loretta

Last Friday, a new version of Loretta, designed by Abel Martins and Joana Correia, landed in my inbox. When I found out that the latest release supports Vietnamese, I was ecstatic. I have invested in a handful of typefaces from FutureFonts, but Loretta is the first completed family with Vietnamese diacritics.

Of course, I wanted to put Loretta to use and this blog is the perfect place for it. To complement Loretta, I immediately thought of Captura Now, designed by Anita Jürgeleit. Captura Now is also one of my recent acquisitions. When I combined them, they looked great together.

For this new design, I wanted to simplify the layout to just one narrow column with generous white space. But then I decided to bring in photography for a change. I played around with Unsplash Source to load random images that are related to typography. This direction brings back the good old days of web design, especially for blogs.

I hope you enjoy this new design and continue to read my rants.

My Law School Portal

I was assigned to design the landing page for My Law School Portal. The portal is powered by Blackboard. I was given a JSP file to work with. The only way to see how the page work is to upload the JSP file and refresh the page. The page has ton of JavaScript and CSS callings in the backend. I don’t know what are being used for. For the purpose of what I was in charged to do, I just added some custom CSS elements to create the page. It’s like killing an ant with a sledgehammer, but whatever works.