I've been working on a redesign of hanafuda and hwatu cards to make them more approachable for beginners. Here's what a recent iteration looks like. There's two main goals with the redesign. First is to make the cards more vibrant and interpretable than the traditional black-heavy artwork. Second is to give some guidance on how| Thomas Park | On web development, interface design, user research, and all th...
For the 2024 Reddit Games and Puzzles Hackathon, I submitted 575, a daily word game where you compose a haiku using the words of the day. How to Play 575 Each day, a new set of words is posted. Players can add any words from this bank to their poem. Your poem is limited, however,| Thomas Park | On web development, interface design, user research, and all th...
Way back when, vertically centering an element was a tall task. Setting consistent gaps between elements took some thinking and several lines of code. Then came flexbox and grid. Both were new and, at the time, magical features of CSS. Those were the times in which I released Flexbox Froggy and Grid Garden. Well now| Thomas Park | On web development, interface design, user research, and all th...
My son's current obsession is the New York Times word game Spelling Bee. Every day, he looks up the letters (he says it's gonna be a good one if the puzzle has e & d, or i & n & g). Then it's time to work our way up the ranks to "genius". Our routine| Thomas Park | On web development, interface design, user research, and all th...
Skeuomorphism taken to the extreme rarely works. But it can be fun. Like a turntable interface for playing YouTube music or a rotary telephone dial for number inputs. For buttons, skeuomorphic design usually takes form … Read more| Thomas Park
I've made a Chrome browser extension called No Scary Parts. It automatically skips the scary scenes in family movies on Disney+, for the sake of your sensitive kids from age 1 to 100. Install it or learn more by clicking the button below. No Scary Parts Background With the COVID-19 quarantine in effect and two| Thomas Park | On web development, interface design, user research, and all th...
My latest experiment is Needledrop, a turntable interface for playing music from YouTube. Enjoy chill vibes as you spin a virtual vinyl of your favorite album from YouTube. You can try it for yourself here: Needledrop With Needledrop, I went for the Dieter Rams school of design. It's inspired by unapologetically skeuomorphic interfaces like Apple's| Thomas Park | On web development, interface design, user research, and all th...
Chess is a continuously evolving game. Technically. There have been many rule changes, but each one has taken centuries to be introduced and widely adopted. That might all change though with the latest work from AlphaZero, where the self-learning engine was used to evaluate 9 proposed variants of chess. These variants range from reverting the| Thomas Park | On web development, interface design, user research, and all th...
So you want a different language keyboard for your MacBook Pro. And it's too late to pick that option at checkout. Apple Support won't be much help here. They won't change your keyboard language after it's been delivered. Even if they wanted to, they don't carry the right parts for your "vintage model", so they| Thomas Park | On web development, interface design, user research, and all th...
At the Overwatch League Grand Finals in Philadelphia, attendees received white wristbands that blink different colors in sync with each other during the event. When the San Francisco Shock won a round, they flashed orange and white in unison. When the Vancouver Titans — well, nevermind... These bands, made by PixMob, have been used at| Thomas Park | On web development, interface design, user research, and all th...
In the course of developing Campus Arrival, a WordPress site that provides school-specific packing lists, we added a feature to suggest nearby universities. When viewing a school's checklist, this feature displays other, nearby colleges. When viewing the front page, it suggests colleges near the visitor's own location. For example, check out the suggestions for MIT,| Thomas Park | On web development, interface design, user research, and all th...
Recently I've been working on The Beautube, a site that integrates video tutorials with details about the products being mentioned in the videos, specifically in the realm of cosmetics. This project has presented numerous challenges for how to design a tight, intuitive UI that makes efficient use of the available screen space when both video| Thomas Park | On web development, interface design, user research, and all th...
I just finished binging the latest release of Terrace House, a reality TV show from Japan. If you're not familiar, Terrace House is hands down the slowest and quietest reality television you'll find, although not without its own kind of drama. And while the fourth installment, Opening New Doors, kept a lot of what made| Thomas Park | On web development, interface design, user research, and all th...
I recently got a new phone that supports wireless charging, allowing me to switch out my rather hefty clock radio dock for a teeny wireless charging pad, continuing the minimalist march in my living room. Things were good until my Apple TV remote needed a recharge, and I had to dig out my old lightning| Thomas Park | On web development, interface design, user research, and all th...
I'm pleased to announce Grid Garden, a sequel to Flexbox Froggy. This time, you'll learn about CSS grid, the hot new layout module, and cultivate a carrot or two in the process. Grid is cutting edge, with browser support landing just last month. What this means is that you'll need to update to the latest| Thomas Park | On web development, interface design, user research, and all th...
Last week, a fun article titled fitteR happieR crowned the most depressing Radiohead song as True Love Waits. This was determined by a "gloom index" calculated with Spotify's valence metric — which measures the musical positiveness of a track — and sentiment analysis of lyrics. The results were pretty spot on in this Radiohead fan's| Thomas Park | On web development, interface design, user research, and all th...
From deep in the vaults, here's an app called QuickLine that I made and then promptly forgot about in 2014. It's a Mac utility for quickly saving and launching terminal commands. QuickLine is made with NW.js (called node-webkit back then), an incredible tool for writing cross platform desktop apps using JavaScript. I'm making the project| Thomas Park | On web development, interface design, user research, and all th...
It goes without saying that Stack Overflow is an invaluable resource for any coder seeking help. This is in large part because they enforce stringent guidelines such as sticking to factual questions and answers. As a result, many posts that don't meet these guidelines get locked down. Many are duplicates or desperate students doing homework| Thomas Park
So here's a fun but useless trick: mimicking Pokemon Go's battery saver mode on the web. For the few who missed the craze, Pokemon Go dims your phone's screen when you turn it upside-down. With the game being something of a battery hog, this can save you precious charge as you walk from one PokeStop| Thomas Park | On web development, interface design, user research, and all th...
Fidgeting is a natural impulse that seems to relieve our anxiety and aid us in contemplation. It often involves mindlessly interacting with everyday objects like stones, pen and paper, bubble wrap, and more. Of course there are also products purpose-built for this, from stress balls to the Swiss Army knife of fidget contraptions, Fidget Cube,| Thomas Park | On web development, interface design, user research, and all th...
Since Steve Job's return in 1997, Apple has been bold about dropping legacy I/O standards, on a knife edge between marching the state-of-the-art forward and convincing the world to follow suit. It's been the same story for the floppy, SCSI, optical, VGA, and most recently, USB and the headphone jack. There's always pain when making| Thomas Park | On web development, interface design, user research, and all th...
Scoped CSS is a new feature that makes it possible to add elements anywhere in your document, scoping the CSS rules it contains to its parent element. This was just what we needed while developing Snowball. Unfortunately, support is limited to Firefox, and existing polyfills like scoped-polyfill and jQuery-Scoped-CSS weren't working quite the way| Thomas Park
Google has been making sweeping changes to the look of their products. One of these changes is the addition of density control. With a couple of clicks, users of Gmail and Reader can now switch between a comfortable, cozy, and compact display. It may seem like a totally unremarkable feature. But here's why Google deserves| Thomas Park
Yesterday, I showed a graphic that lays out popular devices by display size. In this post, I want to show a version created using HTML, CSS, and JavaScript. The upside of doing this programmatically rather than manually in a drawing program is that it's easier to update, adjusts to each user's viewport, and can be| Thomas Park
With new devices being released at such a rapid pace, it's hard to keep up. Perhaps the most frenzied of the bunch has been Samsung, who's adopted a mentality of "let's release everything and see what sticks". This really comes out when graphing some of the most popular devices by display size. As you can| Thomas Park
Major versions sure don't go as far as they used to. Both Google and Mozilla have adopted rapid release schedules for their web browsers, aiming for four or more major releases per year. As a point of reference, it took Microsoft five long years to bump Internet Explorer from version 6 to 7! One per| Thomas Park
Can you play videos natively through CarPlay? That is, without jailbreaking your phone or buying expensive hardware. The short answer is, no. The longer answer is, poorly. Poorly as in, slice up a video's audio track, treat each slice's album art as a video frame, and play it back as a gapless album. How well| Thomas Park | On web development, interface design, user research, and all th...
Like most web developers, Google Fonts is an indispensable resource for me. What would otherwise be a choice between sticking to a small handful of web safe fonts or wrangling WOFFs, OTFs, and TTFs is solved with just two lines of code. Clicks and Conundrums While Google Fonts is a valuable tool, its interface leaves| Thomas Park
In Team Fortress 2, there are nine playable classes with unique personalities and complementary abilities: pyro, engineer, spy, heavy, sniper, scout, soldier, demo, and medic. When referring to several scouts, or pyros, or heavies, it'd be perfectly adequate to refer to each as a "group" or "bunch". But given TF2's whimsical style, why not adopt| Thomas Park
Right now we're blessed with many, well, awesome icon fonts that continue to grow with every release, like Font Awesome, Glyphicons, and Ionicons. And game-changers like Iconic might be just around the bend. But searching through this abundance of icons one by one often leads me to tedium and eye strain. Sure, I can use| Thomas Park
I'm headed to Mozilla Festival this week, after spending the summer working for Mozilla Webmaker. Everything at Webmaker is a team effort, so I helped out on a number of projects and had a blast doing it. But I wanted to document my main effort — adding a tutorial feature to Thimble — from design| Thomas Park
We've all run into CAPTCHAs, those annoying registration fields you never get right on the first try. But CAPTCHAs do play a valuable role, keeping spambots out by verifying that you're a human. On top of this, reCAPTCHA serves a greater good, having you digitize old books in the process. Meet CRAPCHA. CRAPCHA doesn't serve| Thomas Park
A visitor to your site decides to follow you on Twitter. You have a link in your footer — but their search for "Twitter" comes up empty and they move on. Unfortunately, you named the link "@username" instead. Cinnamon.js prevents just this situation, taking some of the pain out of naming things. It allows users| Thomas Park
iTunes 11 marks a significant departure from previous versions. While many of the changes are problematic (another post for another time), I want to focus on one positive: the expanding album effect. Similar to folders in iOS, this effect lets users to scan a list of items and open one up in place. This has| Thomas Park
For those who aren't familiar, Hacker News is a popular site where a community of techies discuss a wide range of topics. According to HN's guidelines, on-topic submissions are "[a]nything that good hackers would find interesting. That includes more than hacking and startups. If you had to reduce it to a sentence, the answer might| Thomas Park
Last year, I posted a gallery of every Apple Store ever. It was a quick and dirty project, made on a whim. But it eventually took on a life of its own, getting coverage from such heavyweights as MacRumors, Gizmodo, and Time (in that order). If I knew so many eyeballs would be on it,| Thomas Park
Although I spilled the beans in an interview yesterday, I wanted to formally announce a personal project called Bootswatch. It's a collection of themed swatches that you can download for free and drop into your Bootstrap site. You can check it out at bootswatch.com. What's Bootstrap Again? Bootstrap is a popular web framework made by| Thomas Park
Here's a quick guide to multitouch gestures on Kindle Touch, since Amazon doesn't provide documentation and some commands are less than obvious. Gestures include taps, holds, swipes, and pinches. Let me know if there are any I've missed. Tap Kindle Touch uses a system of invisible tapzones called EasyReach. Tap right zone: Next page Tap| Thomas Park
Way back in August of 2001, some good friends and I took a road trip down to Virginia to attend a concert. Unfortunately the rains came, the venue got flooded, and the concert was cancelled. Disappointing, but as something of a concession prize, I got to check out the very first brick & mortar Apple| Thomas Park
Despite its name, Google Reader had up until now three levels of use: Reader: read RSS items Linkroll: share RSS items with friends Social network: converse on these shared RSS items with these friends What was nice about this is that you could exchange and comment on posts within the flow of reading them. Unfortunately,| Thomas Park
After nearly a decade of service, my messenger bag is finally giving up the ghost. I've been looking for a replacement that's smaller and lighter: just enough to hold a 13-inch Macbook Air, some pen and paper, and maybe a book. And I'm realizing that the man-purse is an inevitability. Once upon a time, men| Thomas Park
I'm not the only one who's noticed that blue icons seem to be totally overrepresented. But is it really this bad, or is the confirmation bias just acting up again? I decided to find out. The Method From each of the twenty iTunes categories (e.g., books, business, education), I collected the icons of the top| Thomas Park
I've created a game for learning CSS flexbox called Flexbox Froggy. The goal of the game is to help the frogs get to their lilypads by writing CSS code. See if you can beat all the levels! Flexbox Froggy Flexbox Froggy takes inspiration from the classic arcade game Frogger, and web literacy games like the| Thomas Park | On web development, interface design, user research, and all th...
A bad web form sparked a series of increasingly absurd designs for inputting phone numbers, including an incrementer, slider, random number generator, and very large table. Here's a good rundown of the solutions developers came up with. This is my take. It's a retro, skeuomorphic input based on the rotary telephone. Inefficient, but kinda fun.| Thomas Park | On web development, interface design, user research, and all th...
With the era of the humble unstyled and unscripted input field behind us, there's increasing variety in how monetary inputs work on the web. And this inconsistency can lead to big mistakes. Take two cases from the same company. PayPal has you input money amounts by the cent. To input fifty dollars, you type 5| Thomas Park | On web development, interface design, user research, and all th...
The Problem The clutter. While I admit this setup is cleaner than most, there's still the white power strip peeking out and the Nintendo Switch obscuring a corner of the TV. Then there's the random cables drooping here and there. You might say I'm obsessive about cable management, decluttering, and minimalism in general. But while| Thomas Park | On web development, interface design, user research, and all th...
Footnotes An xkcd tribute inspired by what has become a meme. Also inspired by all things recursive like We Become What We Behold and xkcd itself. Made with the official xkcd font. Can you guess which xkcd this was traced from? Winner gets seven Vienna Fingers cookies. If you click enough times, this is actually| Thomas Park | On web development, interface design, user research, and all th...
I love me some fantasy baseball. Mainly when I'm near the top. With the regular season winding down and the playoffs set to start, my team sits comfortably in second place (in a league of 12). But this post is only partly to brag about the Mythical Man-Moths. It's also to reflect on them. How| Thomas Park
The Obsession My family gets competitive with card games. Our latest obsession is Dutch Blitz, a fast-paced game that seems somewhat regional due to the Pennsylvania Dutch influence. To give you an idea of just how seriously we take it, we have a spreadsheet to keep score and maintain lifetime stats. Feel free to fork| Thomas Park | On web development, interface design, user research, and all th...
If you're into tools — think hammers and drills — you're probably familiar with the extremes people go to protect their prized possessions. The most popular system right now, based on my hours watching carpenter and electrician setups on YouTube, is Milwaukee Packout, an expansive line of interlocking boxes in all shapes and sizes (check out the| Thomas Park | On web development, interface design, user research, and all th...
After 65 years at Mad Magazine, comic artist Al Jaffee announced his retirement. Jaffee was best known for his Mad Fold-Ins, where folding the page would reveal a hidden message in the artwork. Plenty of examples can be found on the web. The problem is, they all show the before and after statically, side by| Thomas Park | On web development, interface design, user research, and all th...
Welcome to another installment of the collective nouns survey. This time we focus on Overwatch, following surveys for Team Fortress 2 and Starcraft. In Overwatch, there are 27 playable heroes so far, each with unique personalities and complementary abilities. When talking about a six-stack of McCrees or Meis (which isn't seen outside of arcade mode| Thomas Park | On web development, interface design, user research, and all th...
Even if you've never watched an episode of The Joy of Painting, there's a good chance you're familiar with artist Bob Ross, with his trademark afro and "happy little trees". But if you've seen his show, then you'll know that another trademark was his choice of paints. Bob Ross always used the same 13 paints,| Thomas Park | On web development, interface design, user research, and all th...
As of this month, 25 percent of all websites are using WordPress, according to W3Techs survey. This ubiquity was one of the leading factors in choosing WordPress as the platform for Snowball. Of course Snowball's main target are news organizations and journalism students, which raises the question of how closely this general 25 percent figure| Thomas Park
I just returned from another great Mozilla Festival. For most of the attendees, Mozfest seems to be a chance to kick back and celebrate the daily work they do with their teams. For me, it was a rare opportunity to get face-time with some really talented people working on the same kind of problems I| Thomas Park | On web development, interface design, user research, and all th...
As web developers, the deal is that we try to support our users on all the different platforms they might use to view our site. Generally speaking, that spans everything from the latest mobile devices to Internet Explorers that've long outstayed their welcome. But what about when your site isn't meant for the general public,| Thomas Park
Since May, our research group has been developing a new tool called Snowball. As with our other tools, the purpose of Snowball is to empower people from all sorts of backgrounds to express and create — tell their stories — on the web. We chose to implement Snowball as a WordPress plugin because WordPress users represent| Thomas Park
You have two choices when it comes to formatting academic papers for conferences and journals: Microsoft Word and LaTeX. Word is familiar and easy for anyone to pick up. But the WYSIWYG interface that makes it so easy also makes it easy to create inconsistent, amateur-looking documents that are tough to maintain and fine-tune. On| Thomas Park
A recent post about efforts to counter the declining popularity of golf got me thinking. I'm a pretty terrible golfer, but still have fond memories of playing with friends and family over the years, and do my best to make a couple of rounds each summer. The reason I started playing wasn't my father, who| Thomas Park
In math, you're sometimes so focused on getting the calculations right that you end up with nonsensical answers without realizing it. In web design there's a similar phenomenon, where you're so intent on pixel perfection that you lose sight of the bigger picture. This is where Nick Pettit's three "design tests" come in — simple| Thomas Park
One feature that's often overlooked in iOS is adding webpages to your homescreen. You even get a nice retina icon if the webpage author designates one. Naturally, my mind went to how this feature could be used for a prank: Replace legitimate app with fake. The fake looks exactly the same, but takes you to| Thomas Park
In 2011, for the first time, Amazon sold more Kindle ebooks than paperbacks. Last June, ebook sales surpassed hardcovers for all of the US. The futurist dream of a paperless world is slowly but surely becoming reality. With books, there are downsides to going digital, but perhaps the greatest upside is that they become omnipresent.| Thomas Park
It's a great time to learn to code. It seems as long as there's been the web, there's been text tutorials on coding. But now we're seeing the rise of lecture videos (see iTunes U), massive open online courses (see Coursera), and interactive tutorials (see Codecademy). I've sampled them all, but what's hooked me lately| Thomas Park
I recently spent way too much time trying to find a domain for a project. Every good .com, and even most of the terrible ones, had long been claimed by squatters. This got me to wonder how startups are dealing with this. From reading the news, it seems as though more and more are going| Thomas Park
Today our attention is divided among many apps on many devices, networked and constantly updating. Given this, status badges are used more than ever to help users maintain awareness. They're used everywhere from operating systems to applications to websites, to varying degrees of success. What makes a badge well-designed is that it communicate a bit| Thomas Park
Over at 99designs, businesses can hold contests to get logos designed for them. To provide better direction to identity designers than "I'll know it when I see it" or "just make it pop", each business is asked to create a design brief that includes a description of their business, the type of logo they want,| Thomas Park
I was lucky enough to receive a Kindle Touch as an early Christmas present. To be clear, I love it as a long-form reading device, from its weight to its battery life to its integration with Amazon's ecosystem. It's already begun to replace my next shelf of books. With that said, here's my quick review| Thomas Park
Yesterday, Microsoft's Steven Sinofsky responded to chatter about how Windows 8, in its grand debut, was demoed almost exclusively in landscape mode. In the post, he affirms Windows 8's agnosticism. Our point of view is that both portrait and landscape orientations are important, and experiences can be great in either orientation. Rather than picking a| Thomas Park
The Building Windows 8 blog offers some fascinating insight into Microsoft's research and design processes. Take the recent post on improving Windows Explorer. It begins with a discussion on how Windows Explorer is used today. Through telemetry data — "based on hundreds of millions of individuals opting in to provide anonymous data about product usage"| Thomas Park
I had a bunch of relatives from Korea visit over the summer, and naturally an arm wrestling tournament broke out. What I found most interesting though was how they set up the initial match-ups. They didn't draw straws, pick names out of a hat, roll a die, or eeny meeny miny moe. Instead, they made| Thomas Park
The hallmark of Google Plus so far has been Circles. In contrast to Facebook where you're either a friend or you're not (until you put people into lists), Circles has you categorize people as friends, family, coworkers, etc. right from the start. This compartmentalization is meant to make targeting specific audiences and managing privacy easier.| Thomas Park
A post on my impressions of Ubuntu 11 led to lots of thoughtful discussion here and over at Hacker News. The part that seemed to generate the most interest was my take on why certain menus seemed so troublesome. And while I described the problem in some depth, I glazed over any solution. So here| Thomas Park
For a while now, I've been using my home machine with MAMP to develop a research prototype. But last week, I got my hands on a PC to use as a web server. Before I could get started on it though, I needed an operating system to install — ideally one that would get the| Thomas Park
The folks over at Devour maintain a nice collection of videos, wrapped in a clean interface. One of the touches is that each video is presented using what I call the Devour Effect: a text description in the foreground and a still from the video blurred in the background. I was curious how Devour produced| Thomas Park
In my experimentation with HTML5, I ended up making Trebek, a web app that allows you to play along at home with Jeopardy! The idea is that by trying to answer questions before the contestants do and keeping score, you can gauge your chances of making it onto the show. According to two-time winner Karl| Thomas Park
I previously talked about why the current Apple TV is a stopgap for the true Apple TV. With that in mind, I want to discuss my experience with the current model and what it means for an eventual Apple-branded TV. Through the lens of the remote control. Apple is renowned for its excellent design. But| Thomas Park
In the face of rumors that Apple is working on a TV, many remain skeptical that they would get into such a commoditized business. Let me offer some counterpoints. The boundary between computers and TVs is blurring. TVs are becoming increasingly connected and "smart", while personal computers are becoming a platform for obtaining, viewing, and| Thomas Park
Groups of animals get special collective nouns[1. A longer list of animal collective nouns can be found here.], some of which are familiar (e.g., a pride of lions, a gaggle of geese) and others that are less known but equally evocative: a crash of rhinos, a charm of hummingbirds, a prickle of porcupines, a loveliness| Thomas Park
The other day, I was having breakfast and scouring the cereal box for reading material when I came across the new food pyramid. What had they done! This version apparently replaced the old one back in 2005. No doubt the actual content of the original was highly dubious, but it's hard to argue against its| Thomas Park
Earlier this week, David Friedman proposed a new save icon to replace the antiquated floppy disk. In the ensuing discussion, many noted that with automatic revision control à la Google Docs and Mac OS X Lion becoming the norm, the whole notion of saving would become history and render the issue moot. Whether that turns| Thomas Park
