Welcome to my little corner of the web. Before we begin, go ahead and press that right arrow key of yours.

Looks something like:

Or you can click this

Welcome to my little corner of the web.

My name is Henry Kuo. I reside in San Francisco. I’m part UX, part creative, part technology, part product. I build high-fidelity prototypes. I design for business outcomes.

Below, I'll share a bit of what’s noodling around my head, some fun experiments and side projects, and a few of my favorite tips on getting things done fast (Sorry, Mac only).

On the other hand, if you’re here to learn about my professional side, switch over to my RECENT CLIENT WORK. (You’ll need to request a passcode first.)

Holy slide action!

Yep, this whole site is basically one big slideshow, custom-built from the ground up. On top of being a UX and creative designer, I love building high-fidelity prototypes in HTML, CSS, and JavaScript. Great for user tests. Great for fine tuning. And practically production-ready too (like this one).

(Hit that right arrow again.)

Before you continue, I’d be thrilled if you also checked out this site on your laptop or desktop for the fully enhanced interactive version.

(But you can thank me now for not adding crazy animations and interactions here to kill your mobile phone.)

Sweet! You’ve got the hang of this!
Let’s go on.

Full name: Henry Kuo. I reside in San Francisco. I’m part UX, part creative, part technology, part product. I build high-fidelity prototypes. I design for business outcomes.

In the following slides, I’m going to share a bit of what’s been running around my head, some fun experiments and side projects, and then a few of my favorite Mac to help you save time (Sorry, PC users).

Here to see my professional side? Head over to my recent client work up here on the right.

First up. Some things squirming around my head. More shower thought than essay, this is just a small peek into what's on my mind.

Don’t just empathize. Harmonize.
Write from start to finish
A simple case against FAQs

Thought 1

Don’t just empathize. Harmonize.

Empathy is fast becoming a focal point in design. It balances the user's rational needs with their emotional ones. People are not, after all, robots, and within all of us is the desire to feel known and understood. Brands are getting pretty good at this empathy thing, but uncertainty often comes in its application. For me, one simple concept guides my approach: harmonization.
[continued...]

If someone is excited, amplify their excitement. If someone is worried, meet them with compassion.

Harmonization is simply how you would respond to someone's emotional state face-to-face. More than the words you would say, small cues would quickly shift the nature of your response. Is the person eager or hesitant? Inspired or obliged? Reawakened and confident or burnt and confused? We can't see these cues through the user's screen, but we can know enough through data or research to predict the user's emotional state and respond in kind, creating a harmonic relationship that let's the user know we care.

Thought 2

Write from start to finish.

I'm old enough to remember the days of advertising when a copywriter and art director were tied at the hip creating work derived from their collective perspectives, great work borne from the interplay between rational and creative, words and delivery. In the transition to digital, how did this get so decoupled? Designs begin with placeholder copy while Word documents churn through business and legal. At some point, they meet in the middle and often too late for meaningful collaboration.
[continued...]

Write in context.

Meaning and impact of words change with context. How big it is. How much space it's allotted. What surrounds it. What came before—what comes after. Is it a headline? Is it in a supporting role? Is it to sell? Guide? Educate? Instruct? Can it be clicked?

The interplay of words within the experience is vital to know what best needs to be said.

Write together.

In my experience, the best writing happens when the copywriter sits side-by-side with the designer. Copy is not just flown into the design in real time, the joining of perspectives uncovers opportunities and improvements each alone would miss (Nowadays, a tool like Figma makes this possible virtually).

Most importantly, this isn't a one time thing. This is start to finish, with continual and fluid flexibility to iterate up to the point of delivery.

 

Write in context.

Meaning and impact of words change with context. How big it is. How much space it's allotted. What surrounds it. What came before—what comes after. Is it a headline? Is it in a supporting role? Is it to sell? Guide? Educate? Instruct? Can it be clicked?

The interplay of words within the experience is vital to know what best needs to be said.


Write together.

In my experience, the best writing happens when the copywriter sits side-by-side with the designer. Copy is not just flown into the design in real time, the joining of perspectives uncovers opportunities and improvements each alone would miss (Nowadays, a tool like Figma makes this possible virtually).

Most importantly, this isn't a one time thing. This is start to finish, with continual and fluid flexibility to iterate up to the point of delivery.

 
Thought 3

A simple case against FAQs

Or at least, maybe find a better name.

You know how FAQs are typically at the bottom of a page? Well if users so frequently ask them, why are they so far away from where users can find them? If you have FAQs, you may want to ask yourself what you've deemed more important than the answers users are frequently asking for. You might just find one or two that could be upleveled into the page to better serve both your user and your business.

Next up. A few things I made for fun. My own personal creative outlet to experiment and realize ideas.

Scoreboardz
iPhoneception
Keyboard swipe
Game Scene Editor


Note: these are just my fun side experiments. If you're here to check out my professional work, you can view recent client work through the link in the upper right. Be aware that a passcode is required, which I'll be more than happy to share if you connect by email.

Scoreboardz

A scoreboard in any browser, big or small.

My kids and I devise all sorts of silly competitions. I designed and built this so that whether we're at home or about, we can always fire up a quick scoreboard on a nearby computer or phone to keep score.

Visit Site

Choose from 10 custom themes. Add up to 12 players (even on mobile). And simply bookmark the page to save your settings.

With a simple templated CSS file, I styled 10 fun themes that can be hot-loaded in without losing your current values. Adding up to 12 players automatically reorganizes the layout. And I used a basic hash to update the url so you can save your preferred theme and players by simply bookmarking the page.

iPhoneception

iOS prank with explosions, jump scares, gravity physics and more.

Even 6 years after launch, iPhoneception still gets healthy traffic with spikes on April Fools. It was inevitable when Apple enabled any webpage to be added to the iOS home screen. If you could precisely spoof the iOS screen, you could trick a person to believing its the real thing.

Visit Site

Pranked by millions across the world.

I built iPhoneception in about two weeks, and luckily April Fools was a couple months away. Leading up to that day, it got picked up by one publication after another leading to viral growth of over a million unique visitors in the first month.


Special shout out to TUAW (R.I.P.) for creating the biggest momentum.


Keyboard Swipe

Tactile swiping across binary keys.

I still haven't found time to apply this to a project, but as long as keyboards are still around, I still believe this has potential for a unique experience.

Give it a try

You'll need a keyboard of course, so come back and try this when you're back at your computer.


Game Scene Editor

Create and edit platformer scenes in the browser.

For an upcoming iOS game I'm building, I needed a seamless flow of designing scenes to testing in game. So I built my own scene editor in JavaScript that prints out code to copy/paste into the build.

View a Janky Version

It's janky because it's meant to run locally, on the desktop, and designed to be used only by me.

I suppose we could take a pause and talk a little bit about myself.

My career began with interactive demos on floppy disks made in Macromedia Director with a roughly 1.2MB hard limit. I cut my chops through the rise and fall of Flash and the eventual shift to JavaScript. I've been through the advent of UX and its many evolutions and transformations. I've refined my design thinking through testing and data. I've learned how to be agile with business and technology.

At every step, I continually re-evaluate how I, as a designer, can effectively provide business value, whether its broadening my capabilities into strategy, content, writing, research and testing, or creating operational efficiencies through scalable design systems, adoption of new tools, and more seamless integration with dev.
[continued...]

Some fast facts. In bullet list form!

Personal stuff
  • Half Taiwanese. Half Japanese.
  • Grew up in the southern comfort of Baton Rouge.
  • Went to LSU before transferring to Parsons.
  • Bounced between New York, Honolulu, and Los Angeles.
  • Currently in San Francisco, married, 3 kids.
  • Favorite films in no order: Brazil, Smoke, the Spiderverse Spiderman movie.
  • Books: Hitchhiker's Guide to the Galaxy, Neuromancer.
  • Games: The Witness, Call of Duty: United Offensive (the last good version), Quake, Speedball (Amiga), Modem Wars (C64), Bike Baron (iOS, ranked as high as #5 globally at one point)


Professional stuff
  • 24 years of experience.
  • Wore hats as both creative and UX.
  • Worked on both agency and client side.
  • Work primarily in Sketch with plans to adopt Figma.
  • Build fully-functional prototypes in HTML, CSS, and JavaScript.
  • Experience with agile methodology.
  • Expertise building scalable design systems.
  • Notable clients: Schwab, VF Corp, LegalZoom, Cisco, Mattel, Toyota, Tabasco, Kraft, P&G, Nature Made, MTV, WSJ

Finally, I just wanted to leave you off with a few of my favorite and easy Mac tips on doing things fast.

Often, people ask me how I do things so quick on my computer. Anytime I find myself repeating a task, however big or small, if I can shave even seconds off the time to do it, that savings multiplies with every repetition. Below are the ones I always recommend people start with.

Quicksilver
Divvy
Dictionary
Numi
youtube-dl


Quicksilver

Open apps, folders, and files with a few key strokes.

If you're not already using an app launcher like Alfred or Spotlight, you're probably using your dock to launch apps and digging around your file system to find folders and files. With Quicksilver, you just start typing to find what you want. Eventually, you just do it without thinking.

Go download it

 

Alternatives: Alfred, Launchbar, Spotlight


Divvy

Resize windows with keyboard shortcuts.

Dragging windows to move and resize is an incredible chore. It really can't get any quicker than hitting a keyboard shortcut to change size and position. While you'll have to manually bind keys to window size/position, it's a one time thing and offers more size/position choices than alternatives.

Go download a trial

 

Alternatives: Magnet, Spectacle


Dictionary

Definitions, synonyms, and Wikipedia

Definitions and synonyms alone are a time saver against looking them up online. Why would you endure the latency of a page load against something available immediately on your computer? Not to mention the clutter you expose yourself to be bombarded with on a given web page.

Additionally is the Wikipedia lookup. While this does require retrieving content from the web, it's served in a cleaner and more readable display. Plus, you can toggle between dictionary, thesaurus, and Wikipedia without needing to retype your search phrase.


Numi

Calculate freely within a text file.

There's really no comparison to this unique app. Write calculations in a text field and results appear on the right. Use variables to write more complex calculations. Use units of measurement to convert to other units (such as seconds to hours to days). And freely edit any line as you would a text file.

Go download it


youtube-dl

Download source videos from almost any site.

The name of this command is misnomered, as it can download source videos from hundreds of sites. If you've never opened the Terminal app, you can take this opportunity as an easy way to get familiar. Homebrew is the easiest way to install youtube-dl, simply by copying these 2 lines one at a time in your Terminal.

  • Install Homebrew: /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
  • Install youtube-dl: brew install youtube-dl
  • Run the command: youtube-dl [url of page you want to get video from]

The end! Or a new beginning?

I'd love to chat about your project, your company, share thoughts, compare notes, and just simply connect.


How would you like to continue?

LinkedIn
Email
Resume

Connect
I built this here site from scratch and .