This blog is now using CSS Grid. Although I have been wanted to play around with grid on the web for a while, I have been holding out for browser support. Now it is the time to make the switch. I am still very new at CSS Grid, but already impressed with this simple yet powerful feature. I am looking forward to learn more.

Grid has been an essential tool for my graphic design for a while. Needless to say, I am one of those designers that live and die by the grid. Therefore, the support of grid on the web is very exciting to me. I am still trying to wrap my head around all the terminologies because the terms for CSS Grid aren’t the same as ones I have been accustomed to. For instance, gap is used instead of gutter. Other than than, I am so glad that browser makers are onboard with supporting grid.

Mad props to all the designers and developers who had made grid on the web happened. If you want to learn CSS Grid, check out this resource.

I also reworked my résumé using CSS Grid.

I am proud to announce the relaunch for Dep Designs, an architecture studio based in Maryland. Visit the new site or read the case study.

This week I migrated MVETS, the last site on the old server, to the network of Scalia Law Sites. We are now running 29 websites on a WordPress Multisite. It has been a long and challenging project, but I am proud of the result. I have learned a great deal about running and streamlining a network of websites. I also showcased this project on my portfolio.

In the past six months, I had been working on creating a network of websites for Scalia Law School. The goal for this project is to provide the law school community an online presence that is consistent with the Scalia Law branding. The experience was challenging and rewarding at the same time.

In the initial development, I was tasked with moving existing WordPress sites from our GoDaddy dedicated server to our in-house server. Instead of moving each individual installation of WordPress, I wanted to take advantage of WordPress MultiSite. In addition, I wanted to create a network of websites that looks and feels like the Scalia Law branding.

Rather than creating a theme from scratch, I relied on WordPress’s Twenty Sixteen as a starter. Other than the thick border around the edge of the browser, the simple and clean design of Twenty Sixteen allowed me to create a child theme for customization. The theme for SLS is fairly straightforward.

The challenging part was to convinced stakeholders to be part of this network. I am glad that twenty six websites has been on board and only one rejected the design. I expected the resistance to be higher, but one out of twenty six is not bad.

David Jonathan Ross just released his hyper-stylized typeface called Fit, which designed for maximum impact. He shares:

I drew Fit with an expansive range of widths…. Beginning with the impossibly narrow Skyline style, each character grows by 3600% (on average) to reach the gargantuan Ultra Extended. In between these ridiculous extremes, you will find a family rich in panache and expressive potential.

One of the exciting things about Fit is the support for Vietnamese right from the start. I was fortunate to have the opportunity to contribute my input into the Vietnamese diacritics. Because Fit is such a unique typeface, incorporating legible Vietnamese accents while maintaining its proportion was one of the challenges.

Although Fit is not meant to be read, David has done an excellent job of making the Vietnamese accents as clear as possible. One of my favorite accents he drew was the tilde. The first time he showed me it was barely unrecognizable as a tilde. I suggested a solution, but it was not so great. Then he came up with design that is not only legible but also fitting.

It was such a great pleasure collaborating with David on this typeface. He did all the designs. I just provided my advice. When David asked me what would be the use case for Fit and I immediately thought of old Vietnamese vinyl records. As a result, I redesigned old vinyl records using his new typeface. If you design Vietnamese album covers or Vietnamese entertainment marketing materials, make sure to include Fit in your font collection.

Thanks to David for letting me to be part of this stellar typeface. I am looking forward to working with him in the future. I would love to see Turnip and Fern support Vietnamese.

Touched up I Love Ngọc Lan a bit for 2017. The homepage featured a grid of photos. The type is now set in Alda, by Berton Hasebe. The activity on the site has been quiet for a while and I don’t expect to have much interactions in the next few years. I still hope to keep it as a place to remember one of the most beloved Vietnamese singers. The site has been online for 14 years and I’ll keep it running as long as I can.

The latest release of ON Designs is inspired by legendary designer Massimo Vignelli. After reading his book, A to Z, I decided to simplify my porfolio down to its core. The new design is as Swiss as it gets: black, white, and red. It is now only set in one sans serif typeface, which is Acumin Pro, designed by Robert Slimbach. I stripped out various background colors and made the wordmark a bit more prominent. Check out the new look.

As I was looking for inspiration for the 2017 version of this blog, I came across Keith Houston’s The Book. Although I only started to read the first chapter, I love the design of the book so much that I decided to redesign this blog to emulate the reading experience on paper.

The main typeface is Skolar, designed by David Březina and Vaibhav Singh. Because Skolar has many OpenType features and support for Vietnamese characters, it is a perfect balance between flexibility and performance. For the logo, I wanted to have a bit of flare and Memoriam Pro Headline, by Canada Type, does the job.

The layout is a simple single column to focus on the text. I am pleased with the new design even though it is not a radical change.

When the 10K Apart contest first announced, I was excited, but I was not planning on participate. I didn’t have time and I had no idea what I would do.

When I was on vacation, however, I redesigned this blog. I ended up creating The 10K WordPress Theme. After I submitted that project, I felt it was not inspiring at all. I asked to withdraw, but it was too late.

Around the same time, another concept came to me and I felt motivated. Jay Z On Designs is the result of it. Because 10K Apart allows participants to enter up to three entries, I just submitted another one. You can read more about the project on my portfolio or just go straight to it. Wish me luck.

To participate in the 10K Apart contest, I redesigned and recoded my personal blog, which runs on WordPress. The first challenge is that I must rebuild my WordPress theme to deliver a compelling experience in 10 kilobytes. In addition, I write in both English and Vietnamese; therefore, my theme must support Vietnamese characters.

Like the web, WordPress theming has become bloated with front-end frameworks and JavaScript dependencies. When I first learned WordPress back in version one, its Classic theme was simple and easy to grasp because it only contained ten files. In contrast, a modern theme like Twenty Sixteen has fifty-one files. WordPress theming has become too complex over the years. To get back to the basics, I scrapped my previous themes and started a brand new one from scratch with just two files: index.php and style.css. I wanted to control every markup that goes into the theme; therefore, I applied PHP functions to only dynamic contents and used as much static components as I can to improve the processing time. The result was a lightweight template that accommodated my design.

The other half of the battle was to support the Vietnamese language. If I used a custom typeface that has Vietnamese subsets, the filesize for the fonts alone will be over 100 kilobytes. I had no choice but to go with the system fonts. For body text, I count on Times New Roman as my first choice. If Times New Roman is not available, I fall back to Times, and system serif if all failed. Headlines are set in Tahoma and fall back to Verdana and system sans-serif. The wordmark is set in Impact and fall back to Haettenschweiler, Arial Narrow Bold, and system sans-serif.

In addition to typography, responsive design and accessible played an important role; therefore, I took advantage of CSS Flexible Box for layout and ARIA Landmarks for screen readers. Of course, the goal for the 10K Apart contest is performance. For my submission, I put a static demo, which is under 10 kilobytes, on Github. To experience the live version, visit Visualgui.