Fitness

The Whole Family Went to Whitetail

Even my mother-in-law came to Whitetail with us. Of course she didn’t ski nor snowboard, but hanging out at the lodge chatting with my friend’s mother.

I took Vương to the learning center to teach him to pizza and turns. He was doing really well all by himself. I shouldn’t have used the harness in the previous two seasons. It slowed down his progression. Xuân also taught Vương how to turn. We did three runs on the green.

After that I switched to snowboard and did three runs on the blue trails by myself. We packed up and went to Sushi Bomb for dinner.

I am exhausted once again. I still want to go back to Whitetail tomorrow by myself and have many runs before returning to work on Tuesday.

Music

Nguyễn Tuấn Anh: Hồi ký không tên

Nguyễn Tuấn Anh có chất giọng trầm ấm nhưng không mấy lôi cuốn. Anh trình bày những tình khúc của nhạc sĩ Vũ Thành An không ấn tượng lắm tuy cách hòa âm phối khí của nhạc sĩ Nguyễn Quang sang và đẹp. Nguyễn Tuấn Anh không tạo được nét riêng của mình mà bị gò bó hát cho đúng theo lời dạy của thầy.

Fitness

Soccer, Ski & Snowboard

Couldn’t sleep last night so I got out of bed around 7:00 am and decided to play some soccer. One of my teammates twisted his knee. He could barely walk. He would need a long time to recover. I couldn’t afford to be out during the skiing and snowboarding season; therefore, I played with care. Nevertheless, I played hard for two hours. I was dead tired.

I came back home, ate a bowl of rice, read a few pages, and fell asleep for a bit. I woke up and felt recharged again. I asked my family if anyone wanted to join me for a late-afternoon skiing and snowboarding. Only Đạo (my oldest son) and Xuân (my third son) wanted to join me.

We arrived at Whitetail around 3 pm. The express lift was not working; therefore, there was only one blue trail. The condition was not so good. New snowboarders and skiers were falling everywhere. I did three runs on skis and three runs on snowboard. Around 5 pm, we called it the day. We went to Chili’s for dinner and drove home.

These days I am more active than my kids. I ski, snowboard, skate, and play soccer. My 45-year-old-out-of-shape body is holding up surprisingly well. I hope I can continue to stay active for many years to come.

Personal

Sức mạnh tiềm ẩn của Mẹ

Thứ Bảy vừa rồi tôi lái xe chở cả gia đình và mẹ vợ đi trượt tuyết. Từ khách sạn đến khu trượt tuyết thường chỉ mất khoảng nửa tiếng đồng hồ nhưng hôm đó trời tuyết, mưa, và đông đá. Mấy lần xe của chúng tôi bị trượt qua làn đường đối diện.

Vì đam mê trượt tuyết mà tôi đã đưa bảy mạng vào những giây phút nguy hiểm nên tôi rất lo âu. Lúc phải chạy lên núi, đường trơn trượt và đóng băng nên chiếc xe không lên dốc nổi. Cố gắng hết sức cũng chỉ kéo được 5 dặm một giờ. Nhìn vào kính xe, tôi thấy một đoàn xe ở sau chúng tôi.

Không biết phải làm gì hơn, tôi cầu xin: “Mẹ ơi, giúp con vượt qua đoạn đường này nhé mẹ”. Cố gắng đạp ga xe từ từ để nó không bị lùi lại. Chỉ vài phút sau, bỗng dưng có một chiếc xe tải cào tuyết từ đường bên trái chạy ra trước xe chúng tôi. Xe tải vừa cào sạch tuyết vừa rải muối để cho xe tôi cũng như cả đoàn xe đằng sau chạy dễ dàng.

Tôi nhìn lên trời, nở một nụ cười, và vô cùng cảm ơn Mẹ. Một lần nữa, Mẹ đã dùng sức mạnh tiềm ẩn để che chở cho gia đình chúng tôi. Lần nào con cầu cứu Mẹ, Mẹ cũng trả lời và lần này sự linh thiêng chỉ trong vòng vài phút.

Nỗi đớn đau không còn có Mẹ trên cõi đời này cũng xoa dịu trong tôi theo thời gian. Tuy thể xác Mẹ không còn ở trần gian nhưng Mẹ vẫn mãi mãi bên tôi. Bất cứ ở thời điểm, địa điểm, và hoàn cảnh nào, tôi chỉ cần gọi “Mẹ” là có Mẹ ngay. Tôi tin chắc là như vậy.

Development

Simple Slideshow

I needed a simple slideshow to display images on a large-screen TV and I came across Simple Fullscreen Image Slideshow. It was exactly what I needed and the codes are just so simple. I loved it so much, I replaced all my Flickity slideshows with this one. Here’s an example. Although it works as webpage, my goal is to create a digital display slider. Here’s the entire page:


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Slideshow</title>
<style>
@keyframes fadey {
0% { opacity: 0; }
15% { opacity: 1; }
85% { opacity: 1; }
100% { opacity: 0; }
}
body {
  font-family: Avenir, Arial, sans-serif;
  font-size: 0;
  background: #000;
}

body, figure {  margin: 0; padding: 0;}

figure#slideshow {
  width: 100%;
  margin: 0 auto;
  position: relative;
  /*border: 1px solid #000;*/
  cursor: pointer;
}
figure#slideshow img {
  position: absolute;
  left: 0; top: 0;
  width: 100%; height: auto;
  opacity: 0;
}
figure#slideshow img:first-child { position: relative; }

#container:fullscreen {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #000;
}
#container:-moz-full-screen figure, #container:-ms-full-screen figure, #container:-webkit-fullscreen figure, #container:fullscreen figure {
  width: 100%;
  margin: 0 auto;
  background: #000;
}
:-webkit-full-screen {
  width: 100%; height: 100%;
}
*:-moz-full-screen {
  background: #000;
}
*:-webkit-full-screen {
  background: #000;
}
</style>

<script>
function cancelFullScreen() {
if (document.cancelFullScreen) {
document.cancelFullScreen();
} else if (document.mozCancelFullScreen) {
document.mozCancelFullScreen();
} else if (document.webkitCancelFullScreen) {
document.webkitCancelFullScreen();
} else if (document.msCancelFullScreen) {
document.msCancelFullScreen();
}
link = document.getElementById("container");
link.removeAttribute("onclick");
link.setAttribute("onclick", "fullScreen(this)");
}

function fullScreen(element) {
if (element.requestFullScreen) {
element.requestFullScreen();
} else if (element.webkitRequestFullScreen) {
element.webkitRequestFullScreen();
} else if (element.mozRequestFullScreen) {
element.mozRequestFullScreen();
}
link = document.getElementById("container");
link.removeAttribute("onclick");
link.setAttribute("onclick", "cancelFullScreen()");
}

window.onload = function() {
  imgs = document.getElementById('slideshow').children;
  interval = 8000;
  currentPic = 0;
  imgs[currentPic].style.webkitAnimation = 'fadey '+interval+'ms';
  imgs[currentPic].style.animation = 'fadey '+interval+'ms';
  var infiniteLoop = setInterval(function(){
imgs[currentPic].removeAttribute('style');
if ( currentPic == imgs.length - 1) { currentPic = 0; } else { currentPic++; }
imgs[currentPic].style.webkitAnimation = 'fadey '+interval+'ms';
imgs[currentPic].style.animation = 'fadey '+interval+'ms';
  }, interval);
}
</script>
</head>
<body>
<figure id="container" onclick="fullScreen(this)">
<figure id="slideshow">
<img loading="lazy" src="img/01.jpg" alt>
<img loading="lazy" src="img/02.jpg" alt>
<img loading="lazy" src="img/03.jpg" alt>
</figure>
</figure>
</body>
</html>
Academics

Statement of Research Interests

As a web designer and an adjunct professor who has a passion for typography, I researched and wrote a book on web typography. Professional Web Typography was my independent study in pursuing my Master of Arts (MA) degree in graphic design at George Mason University.

The first edition of Professional Web Typography was released as a web book in 2015 when web fonts started to take off. At the time, I could not find a book that combined typography principles with web technologies; therefore, I decided to write the book myself.

With my experience of designing websites for over two decades, I understood the importance of legibility, readability, usability, and accessibility when setting type on the web; therefore, I delved into topics such as selecting body text, choosing headlines, picking type for user interface, and discerning typographical details.

My goal was to prove that typesetting on the web was fun and rewarding—not intimidating. As a result, I kept the technical aspects as simple as possible. Back in 2015, variable font was still in its infancy. Not all browsers adopted variable fonts. Today, browser makers, type creators, and web designers are all on board.

My current research is to show the benefits of variable fonts for designing web experiences. Using just a few lines of CSS, designers can have a wide range of possibilities including setting specific weight, width, and optical size.

My future research is to expand the power of variable fonts to make the web experiences more diverse. One of my research interests is language support. As a native Vietnamese speaker and writer, my goal is to see more support for the Vietnamese in typefaces.

Fitness

Checked Out Whitetail

I skied and snowboarded at Whitetail for the first time this season. The condition was surprisingly good given the warm weather in the past week and the heavy rain on Tuesday. Only two blue trails and the learning center opened. I practiced carving on both ski and snowboard on the blue trails. I was not complaining. It was better than nothing. I hope they’ll be able to make more snow in next few weeks.

Music

Ngọc Bích Vol. 2: Ru giấc tàn phai

Ngọc Bích mở đầu “Giọt mưa thu” (Đặng Thế Phong và Bùi Công Kỳ) với chất giọng thấp trầm khiến tôi hình dung ngay nữ danh ca Thanh Thúy. Cái đặc điểm trong phiên bản của Ngọc Bích là phần hòa âm. Nhạc sĩ Nguyễn Tuấn Nam khéo léo kết hợp giai điệu dân gian Việt Nam vào phong cách jazz. Các ca khúc trong album được phối theo jazz và blues nhẹ nhàng thích hợp với cách hát nồng nàn và chất giọng trầm ấm của Ngọc Bích như “Thu hát cho người” (Vũ Đức Sao Biển), “Lá rơi bên thềm” (Nguyễn Hiền và Lê Trọng Nguyễn), và “Ru giấc tàn phai” (Trường Sa). Trong những ngày mùa đông lạnh lẽo của miền bắc Mỹ nhờ chín ca khúc này sưởi ấm con tim.

Work

Visualgui 2024: The Button

It’s only January and I already cooked up a second iteration for this blog. The design is inspired by my son Đán Trương who created the cool button and asked me to add it to this site. At first, I refused because his button was a bit too flashy for my site (try hover the next and previous buttons). He insisted that I should use it.

To include his button, I had to redesign the entire site. I went with the Bauhaus style. For the header and footer, I added vibrant, colorful, AI-generate illustrations of Bauhaus architecture, created by Eyetronic. I also added a vector set of abstract avant-garde minimal geometric dividers (to separate each blog post), designed by Vitaneo.

To keep the Bauhaus vibe, I had to remove the scripted typeface for the blog titles. The new titles are now set in Neue DIN, designed by Hendrik Weber, Andreas Frohloff, and Olli Meier, which I had already used for large display text and UI elements.

Of course, I have to give a shoutout to Đán, one of my awesome sons, for creating the supercool button using CSS. Keep learning HTML and CSS, kiddo. You’ll be a superstar designer and you’ll create way cooler sites than your dad. I love you!

Essay

Skiing & Snowboarding

I spent three weekdays alone skiing and snowboarding at Seven Springs. When I was skiing and sharing a lift with other skiers, I would ask them if they snowboarded too. In contrast, when I was snowboarding, I would ask other snowboarders if they skied as well. The general consensus was that skiers felt snowboarding was hard and snowboarders felt skiing was uncool. As for me, I enjoy both sports and split my time in half on the slopes.

I started out skiing four seasons ago at the age of 40—better late than never. I didn’t want to try because the price tag was enormous, but my wife bought me the whole package (lift ticket, rental, and a two-hour lesson) and made me learn to ski with my boys. I took a lesson and skied straight down the bunny slope for the first time without crashing into anyone. I was hooked.

Three seasons ago, I wanted to try snowboarding. I took a semi-private lesson with one of my second son who wanted to switch from skiing to snowboarding. As a natural snowboarder, he picked up it right away. I fell trying to get on the magic carpet, landed my hand inside the edge of the conveyor belt, and bruised my left thumb. I was not sure where I stuck my finger into, but I had a feeling it might be one of the pulleys. Luckily, my finger didn’t get chopped off. I put snowboarding away and focused on skiing for the rest of the season.

Last season, I determined to challenge myself once again trying to learn snowboarding. I took another group lesson. I fell repeatedly and miserably. The instructor said it would take three days of falling in order to learn how to snowboard. I fell for about ten days straight before I could figure out how not to catch an edge. To this day, I continue to fall occasionally, but I have beat the challenge.

I am not an advanced skier or snowboarder, but I have come to understand the concept of both sports. Even though they share the slopes and the terrains, skiing and snowboarding are two worlds apart. Learning each sport has given me a whole new perspective on how relationships worked.

Skiing is a marriage between my left and right foot. Even though I strap on each foot individually, my feet have to work together in parallel. Whether I skid or carve down the trails, my inside foot has to follow my outside foot in order for me to make a smooth turn. As in life, a couple has to be on the same path for a marriage to work. One cannot leave the other behind and both have to take turns to lead.

Snowboarding is a sibling between my left and right foot. Even though I strap them onto the same board, they have to do their own part in order to create a smooth ride. I learned this concept the hard way. When I tried to make them work together, I ended up catching the edges and fell on my behind or flat on my face. I had to learn to separate them so they could hold up their end of the bargain. Once I figured out each individual role, I could carve or short turn my way down any trails. As siblings, they are bounded by the same mother board, but they have their own role to play to keep the family together.

I am so glad that I have picked up these two snowsports. They not only opened up a whole new world for me on the mountains, but also opened up my eyes in life. I hope to continue to play both sports for many years to come.