Moved to the MODX Cloud

After the disastrous failure of trying to upgrade MODX, which brought down the Scalia Law website for almost an entire day, I needed to make a move. It was an embarrassment and my reputation was on the line.

I looked into the possibility of moving the site to WordPress or Drupal. The development would be expensive and the migrating process would be long, but we needed to get off MODX or move off a dedicated server I managed.

I presented the options and explained the pros and cons to my supervisor, but she had another idea in mind. She was neither impressed with WordPress or Drupal. Moving almost 1,200 pages to another platform seemed scary and daunting. She suggested that we should look into MODX Cloud. My worries turned into excitement when she made that suggestion. I didn’t think it would be an option because I strongly advised that we move to MODX Cloud a few years ago, but it didn’t work out.

I immediately reached out to the MODX Cloud team and they offered to take care of the migration for us at no charge. In the past few weeks, they worked closely with me to make sure the migration went smoothly. They explained everything I needed to know. They moved and tested our site on their Cloud platform. They made suggestions to improve our site. I was amazed with the level of support they had provided us at no cost. We were more than happy to pay for the business package and a few extra options they offered.

For the first time in almost 10 years at Scalia Law, I feel so good about handing over this part of my job. A huge rock has been lifted off my chest. Server administration was never my strong suit. I rather have the experts taking care of the server and I take care of the design and the development parts of the site. The most stressful part of my job has migrated. I now can enjoy and focus on what I do best for the law school.

The Scalia Law website is now in a good home. Who can take better care of MODX than the creators themselves? The team was a pleasure to work with. Special thanks to Jay Gilmore and Veljko Mirkovic for their patience and expertise. I am so glad that we’ve made the move. Although MODX is small and its adoption is not as popular as WordPress or Drupal, it is still a powerful and flexible content management system. The people behind it are just phenomenal.

A Tribute to My Father

Last night, I put together a webpage in memory of my father. It features photos, a couple of blog posts I have written here, and a video of his funeral. I hope my brother, sisters, and extended family members will send me their photos and written memories of him.

The typeface is the variable version of Piazzolla, designed by Juan Pablo del Peral for Huerta Tipográfica. Piazzolla is a versatile type system with great Vietnamese support.

This is my way of paying a tribute to him. I can always visit him here. He’s not just in my heart and mind, but also in my virtual home. I love you, dad!

Visualgui 2020 Iteration 7: Roslindale

For the seventh iteration of my blog, I reset the typeface using the demo variable font of Roslindale, designed by David Jonathan Ross. Although this version of Roslindale is still a work-in-progress, David would send it to any member of his Font of the Month Club to try out. Of course, I jumped on the opportunity to test it out.

For big headlines, I wanted the ultra style to grab readers’ attention. For smaller headings, I used the bold display style. On mobile devices, body text set in text regular and text italic at 100% (16px). For large screens, I wanted to increase the size to 125% (20px). At this size, the text weights looked clunky and bulky; therefore, I changed to deck narrow regular and deck narrow italic. The deck style reveals less details at larger size. As a result, I am using six different fonts, but only needed one file. That’s the power of the variable font technology.

For code samples, I needed a mono font, but I hardly write about coding. It would be a waste if I had to include a font in my CSS, but would not using it much; therefore, I used Input Mono, also by DJR, for small details such as category, date, and pagination.

New Dean New Vibe

The Scalia Law School has a new dean who comes from business background. His first order of business is to get rid of Mason’s Green, Gold, and Orange. The only color from the Mason guideline that he approves is Bright Blue (#007dc5). Thanks to SASS, updating the color scheme for the entire website was effortless. Replacing one CSS file and voila!

Yesterday, we rolled out an updated logo with Mason’s Bright Blue. All the links and highlighted items are also blue. Our new color palette consists of blue, gray, and white. Maybe I getting wearied of Mason’s Green, Gold, and Orange, but I find the Bright Blue to be refreshing. I also appreciate the limitation of just using a few colors.

I am sure there will be more changes to come, but just changing the color alone makes a difference.

Visualgui 2020 Iteration 6: Bookerly

I changed the typefaces again. For body text, I switched to Bookerly, designed by Dalton Maag for Amazon Kindle. I love how legible Bookerly appears on e-books. I also changed the background from pure white to light grain-like paper quality. I am a lover of physical books.

For the headers, I went with Ballinger, by Signal Type. I had the opportunity to work with Max Phillips on supporting Vietnamese. I really love the black weight for headers. I wanted to use Ballinger’s text weight, but I still hesitated to use sans serif for body copy. Maybe some time in the future.

In the previous iteration, I said that it would be a while before I made the change again and yet it only lasted 4 days. That’s the beauty of having my own site. I can change it up whenever I want to. I love the freedom to write as well as the freedom to design.

The homepage is featuring a lovely illustration of a diverse group of people supporting Joe Biden. I lifted that artwork right off joebiden.com, which is being displayed way too far down on the official website. I wanted to give it more prominent space on my site until Election Day. Go vote for Sleepy Joe so you can sleep better at night knowing a competent, compassionate president taking care of America.

Visualgui 2020 Iteration 5: Bitter

For iteration 5, I changed the typesetting to Bitter, designed by Sol Matas. In the previous version, the body text was set in Harriet, by designed by Jackson Showalter-Cavanaugh. Although Harriet is beautiful, its serifs appeared a bit too busy for reading on the web. I wanted something simpler and less busy. Bitter fits the bill. Bitter is an open source typeface and it is also a variable font.

In the past few years, I tried to avoid using open source fonts. Because they are open source, anyone can use them. I wanted to have a bit of a selective typeface, but I can’t resist Bitter. Unlike what its name might suggest, Bitter is such a friendly text face. It is so much easy on the eyes. It has distinctive serifs, but not too overwhelming. I wish its black weight has more contrast, but it is still pretty good-looking for headlines. Since it is a variable font, it would be a waste not to use it.

Google Fonts has been putting out so many high quality typefaces with Vietnamese support. I am very impressed with its dedication to typography. I still don’t want to let them host the fonts on its end. I am hosting all the fonts on my own server. If you want to use Bitter, go check it out on Google Fonts.

Visualgui 2020 Iteration 4: Ad Free

The forth iteration of this blog returns to an ad-free design. The ad experiment was fun, but didn’t quite work out as I hope it would. I didn’t think it would work out because I always wanted to change up the design of this blog. With ads, I might be stuck with one design for a while. As a result, I wanted to get back to just making this site a personal blog like it always has been.

A few months ago, I also reduced the footer. I moved all the footer stuff to the info page. The bottom of the blog is now much lighter. I like that. Scrolling on a mobile device is less exhausting.

Of course, the redesign comes with new set of typefaces. Body copy is set in Harriet. UI elements are set in Alright. Both typefaces designed by Jackson Showalter-Cavanaugh for Okay Type.

Simplexpression Rebranded

When David Jonathan Ross sent out Pomfret on July 1st to his Font of the Month Club members, I immediately thought of using it for Simplexpression.

Pomfret is such a beautiful, elegant titling face based on Bertram Goodhue’s Arts & Crafts lettering for The Knight Errant magazine. Unlike the original drawing, David increased the contrast between thick and thin to give Pomfret the extra edge.

In addition, David added over 175 ligatures. Simplexpression has always been about the hidden letter E. As a result, Pomfret is perfect for the Simplexpression brand. With the new wordmark, MP, EX, and EX are joined together. Although SS is a ligature, I wanted to make it extra special. I flipped the second S to form the heart shape. It also gives a sense of weaving strings together like when my wife created her pieces with her hands. I really love how the new wordmark turned out. Take a look.

New Site for Kristin Bair

I have the pleasure of working with Kristin Bair to promote all three of her novels: Thirsty (September, 2009), The Art of Floating (April, 2014), and now Agatha Arch Is Afraid of Everything (November, 2020). With the release of her new book, she wanted a new website. Her goal is to have everything in one place. I revamped her website to draw attention to her new novel and to simplify her online presence.

Read my write-up or check out her new site.

Designing for Class of 2020

For the law school’s class of 2020, we wanted to do something special on graduation. The Senior Associate Dean wanted to put together a banner on our homepage looping all the graduate names. When I received the request, I was not sure how to include over 230 graduates on a small banner. After doing some research, I came up with the scrolling solution, which is similar to the credit at the end of a film. I came across this simple CSS scrolling text technique by Syed Murtaza and adapted for our own use. The scrolling banner is only featured for today so take a look before the day is over.

In a typical graduation year, we would have a print booklet about 40 pages. Since the event is online this year, we wanted to create a short program page recognizing all the graduates. I put together the program page using CSS multi-columns. I really love this CSS feature. It makes typesetting for something like this painless.

We also created a page for the faculty and staff to leave personal notes for the graduates.