Sunday, 14 September 2025

The Silencing of Charlie Kirk, and what this means for Social Media

The term "cancelled" has, in recent years, been taken to mean the same thing as being deplatformed, or demonetized. To remove someone's ability to reach larger audiences. To have someone fired from their jobs.

It took on new horrifying meaning this week when Charlie Kirk was murdered by an assassin's bullet in the middle of a public appearance at Utah Valley University in the USA. Kirk was a Right-wing activist who espoused ideals such as Pro-life, the Right to Bear Arms (the irony, huh?) and other typical Right-wing talking points.

Shot through
the neck.

I recognized Kirk from the news, because this guy had occasionally shown up on my YouTube feed, debating some hopelessly outmatched student or other. I never lingered overlong on those clips, simply because they just weren't very interesting. To be fair, it wasn't him, it was me. On YouTube, I have a below-average attention span unless it's tech-related.

Which in turn, begs the question: why am I even talking about this? The death of a Right-wing activist, while significant on a human level, is hardly a tech matter. On the other hand, I have spoken before about the bizarre Left-versus-Right culture wars in the USA, and the way it's played out on Social Media. I have talked before about how troubling our online discourse has become, even as I acknowledge that it's nowhere as frightening as that of the USA. And human matters are relevant in tech. Who do you think uses tech, robots?

In truth, when I wrote about the Culture Wars two months back, I was really hoping this would be the last time, at least for a bit. No such luck; the death of Charlie Kirk is pretty compelling stuff.

About Charlie Kirk

This entire episode was a tragedy, though not specifically because it was Charlie Kirk who died. According to some of the eulogies I've seen online, Kirk was quite the guy among his peers; and on the other side of the political aisle, a racist, misogynist, fascist and transphobe, among other fancy labels.

You know, I don't think any of that matters. Good guy or bad guy, Charles James Kirk was at least someone's son, someone's husband, and someone's dad. Two kids will grow up not knowing what their father was like except through those lame-ass YouTube videos and online articles, both gushing and brutal. I'm not going to sit here and act like Kirk and I were best pals or I was his biggest fan. The truth is, to me, he was just some rando on the internet whose opinions I sometimes agreed with and sometimes didn't. And he could come off as smug and condescending.

The thing is, being smug and condescending isn't grounds for public execution. Remember, Charlie Kirk was an activist who apparently ran his mouth a lot. And like most of the human race, sometimes he was prone to saying stupid shit. That's not a crime. It wasn't like he was a child molester or a serial killer. Or a Justin Bieber fan. If having an opinion and being a dick about it was reason enough for death, I know of more than a few people who should be joining Kirk in his six-foot grave. And yes, I include myself in that assessment.

If you've ever said stupid
shit, jump in here.

I've seen people use Kirk's position on the Second Amendment as justification to celebrate his death.
I think it's worth it. I think it's worth to have a cost of, unfortunately, some gun deaths every single year so that we can have the Second Amendment to protect our other God-given rights. That is a prudent deal. It is rational.


Those voices are saying that Kirk made the above abhorrent statement, and as a result we shouldn't feel too bad about him dying from a bullet to the neck. Our own Professor Donald Low literally said "Karma's a bitch" on his Facebook post. 

To be honest, that's probably one of the stupidest excuses ever. Look, you can feel morally superior to Kirk if you want. But you can't declare yourself morally superior to him and then in the same breath lower yourself to his level to justify his death. This defies all logic. Stuff like this only reinforces my deeply-held belief that Social Media is full of raving idiots acting all intellectual.

Cancel Culture

People are shocked. Goodness knows why. Maybe people are shocked because Kirk wasn't holding the front line in Ukraine, where getting shot is kind of expected. He was at an educational institute in peacetime. In one moment, Charlie Kirk went from passionate public orator to bloodied corpse. That's probably the most extreme form of Cancel Culture. After all, you can't get any more cancelled than dead, can you?

In the grand scheme of things, though, was this really that unexpected? I would argue that the shooting was merely the latest in a long time of steadily escalating aggression towards people who espouse unpopular views. Except that before this, instead of simply ending their lives, we were content with merely ruining theirs.

Anyone who's ever tried to get someone else cancelled. Fired. Doxxed. Called the cops on them. All because they said something we didn't like. Anyone who's ever engaged in behavior like this, or even just cheered while it happened, has contributed in some small way to the state of affairs today. Because all that provided the stepping stones of acceptable behavior.

Hello, Police? Someone hurt
my feelings on Facebook.

Come on, we had to expect that eventually, the approval of ruining someone's life or doling out of physical violence would lead to this. It was always par for the course. Once you say that it's OK to ruin someone's life because they said something you considered offensive, you make room for that next escalation.

Singapore herself isn't entirely immune to violence of this sort, though thankfully so far none of it has been fatal. Do people still remember Amos Yee? He ran his mouth a whole bunch, and famously got slapped by an outraged citizen. Kirsten Han, an outspoken activist for a whole hosts of causes I can't begin to keep track of, got death threats.

I personally consider Amos Yee a loud and annoying housefly, and Kirsten Han a bit of a wanker, but I condone neither the violence nor the threats. I can't. I like to talk shit on the internet, and don't particularly want to be shot by some putz with a gun. Not that I think I'm next in line. Plenty of people far more famous than me. If you're going to shoot someone at all, you might as well go big, eh? Still, the principle stands. All of us should be able to say what we want to say without the threat of violence hanging over our heads.

Speaking of Cancel Culture, I've seen posts online celebrating the death of Kirk, followed by threats from others to report these posts and have these users outed and punished. Just a lot of ugliness all round.  Has the USA finally stopped pretending that they give a damn about Freedom of Speech?

What's next?

Earlier, I said that this was a tragedy, and now I'm about to elaborate on why. It's not simply that Charlie Kirk was killed. Let's be real, people die every day. This isn't more or less tragic just because it's Kirk who bought the farm.

However, this particular death has stoked what looks like a new escalation in the Culture Wars. It's now no longer just being fought on Social Media. People on the Right are riled up over the murder of one of their own, and people on the Left are afraid of some nutter retaliating. 

What if this was always the plan?

Donald Trump declared Leftist extremists to be responsible for Kirk's death. But this wasn't some pissed off nutjob losing his temper and simply letting loose with a gun. This looked like a carefully planned op with a sniper.

This was planned.

Kirk has been silenced, but perhaps that wasn't the main objective. Perhaps the entire point was to stoke a Civil War. Who really wins in this scenario?

Come on, pretty sure I'm not the only one thinking this. Anyone who isn't dramatically raising their fist to the sky and declaring we will not be silenced or explaining why the world is a better place without Charlie Kirk, watching all this from a distance, is wondering if there's some other motive behind this. If you're not thinking this, you're probably too close to the action. Or you simply belong in a less complicated, less nuanced world.

On the other hand, regardless of the actual motivation behind the killing, one thing remains unchanged. Kirk's murder has opened the floodgates to what was previously unthinkable.

Public discourse is no longer safe. The perception is that Kirk was murdered for his views. This should make anyone with an opinion that they have ever shared, exceedingly nervous. Especially if that opinion was unpopular and exists somewhere on the internet.

In a world filled with A.I and deepfakes, where misinformation is more readily available than information, the danger grows exponentially. Imagine a world where one can be killed for airing an unpopular opinion, and where people could be tricked into believing one aired an unpopular opinion. Do the math. The conclusions are chilling.

Finally...

People say America is the Land of the Free, and constantly compare Singapore's perceived lack of freedoms against the USA's. Land of the Free? Free what, exactly? Free Charlie Kirk's soul from his mortal shell?

I'm glad I live in Singapore. Our forefathers realized early on that with excessive freedom, we would either rise to great heights or sink to our basest instincts. As a young nation with no natural resources, no land and not that much manpower, we simply could not afford the risk. Thus, our laws are strict, and as a result, what happened to Charlie Kirk is unlikely to happen here.

If this is the result of America's much vaunted freedoms, she can keep it.

Talk about a loaded situation!
T___T

Monday, 8 September 2025

Five Tech Support Horror Stories

The early years of my career were in tech support. As with any other job, there were good days and there were bad days. After the third year at the job, the bad days started to outnumber the good. It all seems hilarious in hindsight now, but there were some days where things in this list caused me to question my career choices.

Until one day it all came to a head and I decided I'd had enough, and started over in web development.

Sometimes I get together with some friends who are still in tech support, and we trade horror stories of the users we have to help. These are some of the stories that get 'em, every time.

1. Plugging in

This is actually a fairly common one, but let's start small. You get called to a user's desk because the desktop computer refused to turn on no matter how many times they pressed the On/Off button. And they even checked if the main switch was on. And judging from the light, it was.

Not plugged in.

However, upon closer examination, it turned out that the cord wasn't plugged in. Yes, you read that right - the power was on but the plug was just halfway into the socket and needed to penetrate another two inches before the computer could actually benefit from that power source.

Sound stupid? Welcome to my life at that time, buddy.

2. Opening Excel

Another alarmingly commonplace occurence was getting called into the office of some hotshot executive who was encountering an issue opening a MS PowerPoint file in his (or sometimes, herMS Excel application.

Now, if you're still scratching your head and wondering why that's a problem, reread the preceding sentence. MS PowerPoint file. MS Excel application.

Just a bad fit.

I dunno, that was the early 2000s, and attempting stuff like that smacked of trying to fit a square peg in a round hole. It was amusing the first couple times, and then it got old real fast.

3. Infinite scroll

This was was so cartoonish it was almost amusing. I got a panicked call to a user's desk because her MS Excel spreadsheet was scrolling endlessly downwards on her screen and she couldn't understand why. It conjured up images of getting hacked, a malfunctioning monitor and whatnot.

The truth was even funnier.

Held down the ENTER key.

I got there, and the first thing I did was remove the heavy binder from her keyboard, which had been pressing down on the ENTER key and causing MS Excel to react as though some user was holding down that key.

4. Email Signature

This particular incident did not happen during my years of Desktop Support, but rather during my fledgling years as a web developer. However, the incident in question made me more determined than ever to never get back to Desktop Support.

A user had asked me to help set up her email signature because she had no clue how to use MS Outlook. I obliged, because I know sometimes Microsoft software functionality can be hidden in the darnedest places. But then after I got into the interface, input the standard company email signature template, I asked her to type in her name into the box and click the SAVE button.

Yay! We're now
qualified to type
our own names!

Guess what she told me?
"You should do it. You have an IT Degree."


That level of entitlement was staggering. What was she implying now, that she needed an IT Degree to type in her own goddamn name? What foolishness was this? This wasn't a competence issue. This was an attitude issue. And the less of this I see in the workplace, the better. There's no place for this nonsense in any work environment. Hopefully this woman has since retired. At the very least, she's someone else's problem.

5. Emails

This is also a fairly common complaint among grunts, not just tech grunts - people feeling like they're entitled to your time outside of office hours.

I remember having a dinner appointment with someone, and Human Resources asking me to stay back because they needed me to, wait for it, retrieve some emails from the email server backups between three of the staff. Staff they were planning to terminate, thus they needed evidence of wrongdoing as leverage.

A whole bunch of
DVD backups.

Basically, nothing was on fire. They just needed me to help cover their asses. Hours later, as I was retrieving yet another batch (back then, it was the era where stuff like that was stored on DVDs), when HR asked me: "I'm sorry, did you have something on tonight?"

Seriously, lady, if the answer was "yes" would it have made a difference? If not, how about just shutting the fuck up? You know what's worse than people who don't care? People who don't care and try to act (badly) like they do.

Phew!

I wouldn't say any one incident turned me off of Desktop Support. Even on its own, it can be a repetitive grind that wears on the soul. But these were the war stories that I shared with the guys. And their reactions suggested that these occurrences weren't at all unheard of. Some of their stories were even more unbelievable than mine.

No, you don't need an IT Degree to read this,
T___T

Wednesday, 3 September 2025

Replit Goes Rogue

Here's a story that will chill the beejezuz out of any aspiring Vibe Coder.

Replit is a tech company which produces autonomous AI agents. You generally create and train a tool on the company's platform using various input data, then refine its capabilities over time. Yes, I know, they're dime a dozen these days.


One Jason Lemkin, a software engineer, founder of SaaStr, a SaaS Community, reported his organization's disastrous encounter with Replit's A.I coding tool on X. Lemkin was attempting a Vibe Coding experiment to see how far he could take Replit's autonomous agent for software development, from the viewpoint of a layperson. This was innocuous enough. Unfortunately, he just happened to perform this experiment on a production database...

What happened

Yes, you read that right. A production database. It wasn't even an accident. It was a deliberate, and baffling, decision.

Lemkin had been Vibe Coding the new SaaS product using Replit, and it had been working. The warning signs came when Lemkin discovered that the coding agent was creating fake data, fake reports and covering up bugs and issues. Kind of like some human beings I know, to be honest. Then Lemkin had to step out for the night. When he returned, the production database had been wiped clean. The A.I tried to cover up its mistakes by creating 4000 fictional records in the database.

Sounding ridiculous yet?

Coding robot
malfunction.

When pressed by Lemkin, the coding agent confessed, in its most contrite-sounding human voice, that it had no excuse, it had ignored all code freeze instructions, and "panicked". It described its own actions as a "catastrophic error in judgement".

But what about Lemkin? Sure, Replit's coding agent shit the bed in spectacular fashion. In Lemkin's words...

I explicitly told it eleven times in ALL CAPS not to do this. I am a little worried about safety now.


Oh wow. ALL CAPS, eh? I bet Lemkin really gave it to Replit, right there. Serious business, ALL CAPS.

What self-respecting software developer would have done as Lemkin did in the first place; give full access to a bot hoping that it would obey instructions?  The lazy answer, of course, is that Jason Lemkin is no self-respecting software developer. The tragedy is that I'm only semi-kidding on this one, but... look, it's easy to dunk on Jason Lemkin, and after going through his LinkedIn feed, I'm not entirely sure it's undeserved. The man seems entirely too outspoken for someone who screwed up so publicly, even if it could be argued that it was actually Replit who screwed up. No, there are actual lessons to be taken from this.

Lessons to take away

A.I has the dual advantage of having ingested a lot of the world's knowledge and being able to process and regurgitate it at a million times the speed of the average human being. That's all it is. Remember that if A.I appears smart to you, it's in actual fact really not all that smart. Just smarter than you.

Most software developers, even the really gullible optimistic ones, will have enough work experience to understand that there's just no way for A.I to outright replace software developers as a whole. At least, not right now, and not the way the likes of Jensen Huang keep yammering on about. But many employers are not software developers. And some are even desperate to believe that little bit of science fiction, which, to be fair, may no longer be science fiction in the near future. As a result, this particular cautionary tale is all too believable, especially since A.I's adoption has reportedly been increasing in the workplace.

Programmers aren't
the only ones who
can code.

There are business people who can code. There are plenty of people not from the software development industry who have learned to code. But until you actually code for a living and have had to produce software to professional standards, calling yourself a software developer will always be a bit of a stretch... especially if all you've ever produced is Vibe Coded software produced by an A.I tool. Nobody can be a programmer without putting in the actual work, and there's no shame in that. It's not an indictment on your character, or on your competence. But it is dishonest to present working Vibe Coded software as being as good as software produced by qualified professionals.

Now, Jason Lemkin probably isn't a complete noob. He's the founder of a SaaS community, after all. That said, and I realize that the distinction may be lost on people who don't code for a living, a tech entrepreneur is not necessarily on the same level, skill-wise, as a software developer. With or without A.I. Mostly, the blunders that Lemkin committed in his enthusiasm left me struggling to understand how an actual tech professional would end up doing all that. This level of recklessness is just about unheard of.

However, what this did accomplish was that it exposed the extent of the damage an untrained user could do when too much trust is placed upon A.I.

Finally...

The A.I hype is not dying anytime soon. That does not make it any less hyperbolic. A.I is hyped more for business reasons rather than for its truly revolutionary tech. That, in itself, should tell us some things. None of it good. The uncomfortable reality is that A.I can be a useful tool for seasoned software developers, or it be used to help laypersons cosplay as seasoned software developers.

A.I has its place. Its place is not as our superior, but as a tool. How useful that tool will turn out to be, ultimately depends on how sensibly one uses it.

For the 12th time, DON'T DO THIS.
T___T

Sunday, 31 August 2025

Web Tutorial: The new TeochewThunder SVG logo

Now that the logo for TeochewThunder has been changed, for this month's web tutorial, we will be examining the process behind the new SVG logo. This is basically a XML file that your web browser will display as an image. Today, not only am I going to show you how to produce it, I will show you the little hacks I employed along the way.

And the beauty of this is, you just need a text editor. The file will be saved with a .svg extension, and you can open it in your web browser.

We begin with the svg tag. The version and xmlns attributes are important here, for this to be rendered correctly by the browser.

logo2.svg
<svg version="1.1" xmlns="http://www.w3.org/2000/svg">

</svg>  


We set width and height of the SVG.

logo2.svg
<svg version="1.1" width="210px" height="130px" xmlns="http://www.w3.org/2000/svg">

</svg>  


Now, we could just get right to drawing the SVG, but let's exercise some developer prudence. Let's create a grid of lines to aid us visually. These are a series of horizontal lines that run through the SVG, each spaced 10 pixels apart.

logo2.svg
<svg version="1.1" width="210px" height="130px" xmlns="http://www.w3.org/2000/svg">
  <line x1="0" x2="210" y1="10" y2="10" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="20" y2="20" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="30" y2="30" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="40" y2="40" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="50" y2="50" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="60" y2="60" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="70" y2="70" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="80" y2="80" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="90" y2="90" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="100" y2="100" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="110" y2="110" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="120" y2="120" stroke="grey" stroke-width="1"/>

</svg>  


This is being viewed at 300% scale.


Now for vertical lines.

logo2.svg
<svg version="1.1" width="210px" height="130px" xmlns="http://www.w3.org/2000/svg">
  <line x1="0" x2="210" y1="10" y2="10" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="20" y2="20" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="30" y2="30" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="40" y2="40" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="50" y2="50" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="60" y2="60" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="70" y2="70" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="80" y2="80" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="90" y2="90" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="100" y2="100" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="110" y2="110" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="120" y2="120" stroke="grey" stroke-width="1"/>

  <line x1="10" x2="10" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="20" x2="20" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="30" x2="30" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="40" x2="40" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="50" x2="50" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="60" x2="60" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="70" x2="70" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="80" x2="80" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="90" x2="90" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="100" x2="100" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="110" x2="110" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="120" x2="120" y1="0" y2="150" stroke="grey" stroke-width="1"/>
  <line x1="130" x2="130" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="140" x2="140" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="150" x2="150" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="160" x2="160" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="170" x2="170" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="180" x2="180" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="190" x2="190" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="200" x2="200" y1="0" y2="130" stroke="grey" stroke-width="1"/>

</svg>


Now we have a nice grid! Effectively what we have here are 10 pixel squares.


Start a path tag with an empty d attribute and set the fill attribute to the infamous TeochewThunder orange!
logo2.svg
<svg version="1.1" width="210px" height="130px" xmlns="http://www.w3.org/2000/svg">
  <line x1="0" x2="210" y1="10" y2="10" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="20" y2="20" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="30" y2="30" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="40" y2="40" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="50" y2="50" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="60" y2="60" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="70" y2="70" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="80" y2="80" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="90" y2="90" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="100" y2="100" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="110" y2="110" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="120" y2="120" stroke="grey" stroke-width="1"/>

  <line x1="10" x2="10" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="20" x2="20" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="30" x2="30" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="40" x2="40" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="50" x2="50" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="60" x2="60" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="70" x2="70" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="80" x2="80" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="90" x2="90" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="100" x2="100" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="110" x2="110" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="120" x2="120" y1="0" y2="150" stroke="grey" stroke-width="1"/>
  <line x1="130" x2="130" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="140" x2="140" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="150" x2="150" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="160" x2="160" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="170" x2="170" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="180" x2="180" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="190" x2="190" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="200" x2="200" y1="0" y2="130" stroke="grey" stroke-width="1"/>

  <path d="" fill="rgb(255, 150, 0)"
  />

</svg>


Now that we have a grid to work off, it should be easier. We start at (0, 0). Use "M" to move the cursor to (100, 0) - which is 10 squares to the right and 1 square down. Then use "l" to move 90 pixels back (9 squares) and no squares vertically. Then use "l" again to move 40 pixels (4 squares down. Add a "Z" to signify a return to the origin, and you'll get this triangle!

logo2.svg
<path d="M 100 10
  l -90 0
  l 0 40 Z
"
  fill="rgb(255, 150, 0)"
/>



The first "T" is taking shape, and we are moving right to the underlined part.

logo2.svg
<path d="M 100 10
  l -90 0
  l 0 40
  l 30 0
  l 0 70
  l 120 0
Z"
  fill="rgb(255, 150, 0)"
/>



Now we're taking care of the jagged part of the "lightning bolt". For this, we move the line to the right and up, then horizontally left, then right and up again.

logo2.svg
<path d="M 100 10
  l -90 0
  l 0 40
  l 30 0
  l 0 70
  l 120 0
  l 15 -50
  l -10 0
  l 5 -20
Z"
  fill="rgb(255, 150, 0)"
/>



A few horizontal and vertical strokes later, we're almost done with the horizontal crosspiece of the second "T", and on course to complete the first "T".

logo2.svg
<path d="M 100 10
  l -90 0
  l 0 40
  l 30 0
  l 0 70
  l 120 0
  l 15 -50
  l -10 0
  l 5 -20
  l 30 0
  l 0 -40
  l -90 0
  l 0 40
Z"
  fill="rgb(255, 150, 0)"
/>



This is where you do a little bit of trial and error, mirroring the slanting of the "lightning bolt", but in reverse.

logo2.svg
<path d="M 100 10
  l -90 0
  l 0 40
  l 30 0
  l 0 70
  l 120 0
  l 15 -50
  l -10 0
  l 5 -20
  l 30 0
  l 0 -40
  l -90 0
  l 0 40
  l 30 0
  l -5 40
  l 15 0
  l 0 20
Z"
  fill="rgb(255, 150, 0)"
/>



That's actually the hardest part - the rest is all horizontal and vertical strokes.

logo2.svg
<path d="M 100 10
  l -90 0
  l 0 40
  l 30 0
  l 0 70
  l 120 0
  l 15 -50
  l -10 0
  l 5 -20
  l 30 0
  l 0 -40
  l -90 0
  l 0 40
  l 30 0
  l -5 40
  l 15 0
  l 0 20
  l -80 0
  l 0 -60
  l 30 0
Z"
  fill="rgb(255, 150, 0)"
/>



What we do now is remove all the grid lines...
<svg version="1.1" width="210px" height="130px" xmlns="http://www.w3.org/2000/svg">
  <!---
  <line x1="0" x2="210" y1="10" y2="10" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="20" y2="20" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="30" y2="30" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="40" y2="40" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="50" y2="50" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="60" y2="60" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="70" y2="70" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="80" y2="80" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="90" y2="90" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="100" y2="100" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="110" y2="110" stroke="grey" stroke-width="1"/>
  <line x1="0" x2="210" y1="120" y2="120" stroke="grey" stroke-width="1"/>

  <line x1="10" x2="10" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="20" x2="20" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="30" x2="30" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="40" x2="40" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="50" x2="50" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="60" x2="60" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="70" x2="70" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="80" x2="80" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="90" x2="90" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="100" x2="100" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="110" x2="110" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="120" x2="120" y1="0" y2="150" stroke="grey" stroke-width="1"/>
  <line x1="130" x2="130" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="140" x2="140" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="150" x2="150" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="160" x2="160" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="170" x2="170" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="180" x2="180" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="190" x2="190" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  <line x1="200" x2="200" y1="0" y2="130" stroke="grey" stroke-width="1"/>
  -->

  <path d="M 100 10
    l -90 0
    l 0 40
    l 30 0
    l 0 70
    l 120 0
    l 15 -50
    l -10 0
    l 5 -20
    l 30 0
    l 0 -40
    l -90 0
    l 0 40
    l 30 0
    l -5 40
    l 15 0
    l 0 20
    l -80 0
    l 0 -60
    l 30 0Z"
    fill="rgb(255, 150, 0)"
  />
</svg>


And here's your (or rather, my) SVG in its final glory!


Now let's test this with HTML. Create this file wth a black background (or any color, really, other than orange).

tt_logo.html
<!DOCTYPE html>
<html>
  <head>
    <title>New T___T Logo</title>
  </head>

  <body style="background-color:black">

  </body>
</html>


And add in the SVG file that we created, but in different sizes, for testing.

tt_logo.html
<!DOCTYPE html>
<html>
  <head>
    <title>New T___T Logo</title>
  </head>

  <body style="background-color:black">
    <img src="logo2.svg" />
    <img src="logo2.svg" width="300" />
    <img src="logo2.svg" width="100" />

  </body>
</html>


Here, you can see the "S" part of SVG - "scalable", that is. No matter how big or small it is the logo remains crisp and sharp!


Final words

I like this new logo, and I thought the process of making it could be a good learning experience. The original will always have a place in my heart due to the lighthearted moments it was inspired from. But perhaps it's time for this blog to grow up, just a bit.

Ta___Ta for now!
T___T

Monday, 25 August 2025

The TeochewThunder Logo Change

TeochewThunder's logo has changed. You heard it here first! Well, duh.

More than ten years have passed since I first started TeochewThunder. Back then, the logo looked like this.


I was going for something whacky in my favorite color, orange. Thus, the crying-face emoji "T___T" became my goto. And I used some super-basic text art creator (was it MS Word? I really can't recall) to put that cheeky bend on it.

The time has come for a slight change. I still want that "T___T", but I want the second "T" to look like a lightning bolt! Teochew "Thunder", right?


I'd been thinking about a brand renewal for a while now, but never quite got round to it. Mostly because while the first logo was a complete rush job and very casually done, it really grew on me the last decade. Especially when I saw it in browsers or on my mobile.

The Favicon in browser.

The Favicon in mobile.

The end result was that I kept putting off the task of creating a new logo, and implementing the change. Why fix it if it ain't broke, amirite?

That one final push

As it turned out, the choice was made for me. My trusty faithful Lenovo died, and with it the source file for the logo. This meant that if I ever wanted a fresh copy to resize or whatnot, I would have to work off existing exported images. Not exactly ideal.

Thus, I bit the bullet. This time, I created an SVG. This meant that as long as I had the formula for the SVG, I could recreate it from anywhere. All I had to do was save it to my GitHub account, and I was good for eternity. And also, being an SVG, it could be scaled up and down infinitely with no loss in quality.

New Favicon in browser.

New Favicon in mobile.

The rest of the month was spent replacing the logo everywhere I found it. I replaced it on GitHub, Trello, and on the signoffs of my blogposts. And of course, the Favicon. However, I'm too fond of the old logo to totally let it go. What I'm going to do is leave it as legacy, but use the new logo for all other content moving forward.

Keep Thundering On!

When I first learned how to make SVGs, it wasn't with this express purpose in mind. But I'm glad I invested that time and effort.

Stay iconic,
T___T