Panic Blog

March 9th, 2020

Saving Face

By Michael


Episode 4 of the Panic Podcast, Audion & On, hit the podcast feeds last week, but if you play the episode directly from our podcast page using the “Play Now” button, you’ll find a nice surprise waiting for you.

A screenshot of the podcast page, displaying audio controlled by an Audion face.

We wanted to give our listeners an opportunity to experience some of Audion’s amazing faces for themselves. No matter how well we described them on the podcast, we couldn’t do them justice. The faces aren’t just visual: they’re interactive.

They’re also an important part of Panic’s history that has been inaccessible to modern computing devices for well over a decade. Although they were cutting-edge technology when Audion launched 21 years ago, porting them to modern Web browsers was an involved process. In this post I’d like to give you a peek at how these faces work, and touch on what it took to bring them to the Web.

Painting a Picture

At their core, Audion faces consist of a base image, with smaller images drawn over it. The base image contains not only the background of the face, but all the buttons and UI indicators.

The base image for Smoothface Original.

Buttons in Audion can have different appearances when they’re pressed, when they’re disabled, and when the mouse pointer is hovering over them. Each of these appearances has its own image.

The disabled buttons for Smoothface Original.

For each frame of animation, the base face is drawn first and any special appearances for the buttons are drawn over that.

SmoothFace original with the stop button disabled.

The other UI elements—the UI indicators, the play time, the track number, and the various animation frames—are then drawn over the face. Faces can display animations when connecting to a stream, when playing a stream, and when the stream is lagging. Face designers can use as many frames as they’d like for these animations, and they control the speed of the animations. Because of this flexibility, each animation frame is stored as its own image.

Animation frames for Smoothface Original.

Drawing images this way is not difficult to do in modern Web browsers. However, the faces themselves used Classic Mac OS file formats which are not well-supported today.

In the Old Days

Audion started as a Classic Mac OS application, and, like most Mac OS applications at the time, it used resource forks to store its assets. Resource forks are a Macintosh-only technology designed to store metadata associated with a file. Every file in Classic Mac OS has a data fork and a resource fork. For Applications, the data fork contains the machine code that was run, and the resource fork contains the icons, graphics, sound, and text strings used by the application. This allowed Mac applications to be distributed as a single file, while Windows applications are typically comprised of multiple files.

A year after Audion launched, Apple released the first public beta of Mac OS X. Although it still supported resource forks, Apple began to discourage their use. In their place, Apple promoted the use of packages. Packages are special folders that appear to be a single file on macOS, but look like normal folders on other systems. They serve many of the same purposes as resource forks, and many users wouldn’t notice any difference between the two technologies. More savvy users, however, began to see resource forks as an artifact of old, outdated software, putting pressure on developers to move to Apple’s newer technologies.

In 2003, Panic alumnus Les Pozdena worked on an app to convert Audion faces from resource forks to a package-based format. Audion was discontinued soon after, so these package-based faces were never used, but the face converter code remained in Panic’s source code archive. When Christa first mentioned that she was doing a podcast about Audion, the idea of adding Audion faces to the podcast page immediately popped into my mind. At the time, I had no idea how the faces worked, and Les’s code provided an invaluable starting point.

Updating the Converter

Les’s converter was mostly complete. It could already open resource files, extract images and their coordinates, and convert images from the PICT image format to PNG, an image format in wide use today. However, the code needed to be updated to run on modern versions of macOS. It used a few functions which have been removed from macOS since the converter was written. The converter also didn’t support UI indicators. Many newer faces, like Smoothface 2, don’t have these indicators. Thankfully, the face files themselves provided a description of their format, making it easy to fill in the missing details.

The template description for a face resource.

After a few hours of work, I set the converter loose on the files in our Audion face archive. After I finished, I noticed that some of the faces were using the wrong text color for the artist and album text fields. As it turned out, these fields could optionally be styled by a separate text style resource. This resource contained the text’s color, its styles, (e.g. bold, italic) and its transfer modes. None of the faces on the podcast page use special transfer modes, but if you’re interested in learning about them, they are documented in Inside Macintosh: Imaging With QuickDraw.

Converting the faces for the Web required making a few changes to how they worked. When drawing to HTML’s <canvas> element, you can get better performance by redrawing as little as possible. Audion redrew the face every frame starting from the base image because it needed to in order to get transparency right, but that’s not required on modern computers. The converter therefore cut the button and indicators out of the base image. This allows the base and the buttons to be drawn separately.

The base image for Smoothface Original with its buttons and indicators cut out.

The most challenging part of displaying the faces on the Web is text rendering. There are two reasons for this. The first is that many Classic Mac OS fonts contain a set of bitmap glyphs that were used when drawing the font on screen and a separate set of outline glyphs used when printing. The bitmap glyphs were designed to look good on low-resolution screens and were faster to draw than the outline glyphs. Modern operating systems exclusively use the outline glyphs, which makes the text look quite different. This was noticeable back in 2001. Audion’s text looked different in Mac OS X than it did in Classic Mac OS. However, HTML’s <canvas> element offers very little control over text rendering, and each Web browser draws the text differently. If you used Audion back in the day, the text on the page will not look exactly like you remember.

Text rendering on Classic Mac OS.Text rendering on the podcasts page.

The second problem is that many Audion faces used custom fonts, and some of these fonts have been difficult to convert for the Web. Mac Postscript fonts also stored their font data in resource forks, and although there are many tools to convert these fonts to other formats, these tools fail to convert some of these fonts correctly. It is likely that we will need to write a bespoke tool to convert these fonts. The faces in our archive use a total of 95 unique fonts, and converting them all will take some time.

Hidden Details

Not every image in the face is used in the Web player. For example, we couldn’t find a good use for the inactive face image, which is used when Audion was in the background. The drag region, a bitmask image which Audion 1 used to draw face outlines while dragging, was the most interesting of these images.

Some face designers used this image to sign their work.

A drag region image with the artist's signature.

Others used the drag region to hide messages or drawings.

A drag region image with the message, "expose what lies beneath."

When SoundJam first added support for Audion faces, they incorrectly used the drag mask for transparency, causing these messages to be cut out from the face. Because of this, some face designers would hide advertisements for Audion in the drag region.

Preserving Audion for the Future

It’s wonderful to be able to show off these faces on our podcast page, but it’s also important to preserve them for the future. A few of the faces in our archive are offensive, especially in a modern context, but they may be useful to future historians.

However, as time goes by, it will become harder to preserve these faces. The face converter already does not currently work on macOS Catalina because Catalina removed support for working with resource forks and PICT images. There are third-party libraries which can read these formats, but much more work would need to be done to the converter to get it running in current and future versions of macOS.

That makes now the ideal time to convert and archive Audion faces. If you have any faces that aren’t in our archive, please get in touch so we can convert as many faces as possible.

For Fun

The most rewarding part of this process has been revisiting the many great Audion faces in our archive. There are good reasons we don’t design customizable software interfaces anymore, but they’ll always hold a special place in my heart. They weren’t just fun, they made personal computing personal.

If you’ve read this far, there’s a good chance that you also have a fondness for Audion. I hope you enjoyed this look into how the faces worked. I plan to post a followup in a few months detailing my progress converting the rest of the faces and showing off some cool finds.

Please look forward to it!

Posted at 3:00 pm 5 Comments
July 31st, 2019

Hello, long-time Panic friends. It’s nice to see you again. We have a few quick — and important — announcements for you.

A new Mac editor.

You’ve been waiting. For a very long time. Us too. And we’re so happy to announce that the next Coda is almost here.

And it’s called Nova.

Our next great Mac-native text editor, Nova, is about to enter private beta. We’re looking for testers, and we’d love for you to be a part of it. We’ll be doing tests in groups, so the more we know about your editor usage, the better!

Visit the Nova Private Beta Page

A few possible answers to a few possible questions:

Why “Nova”?
Nova is a dramatic upgrade in every respect, a total re-write and reimagining. It felt appropriate to give it a new identity.

Is today’s Coda dead, then?
Nova is replacing Coda, but if you like using Coda there’s good news: we’re planning a final Coda update soon to add support for macOS Catalina, and we will always update Coda if any major security issues are discovered. Importantly, if you like how Coda works and haven’t yet purchased it, do that now — it will not be for sale in 2020.

How much will Nova cost?
We’re still figuring this out. We’re leaning towards a Sketch-like “buy it, keep it forever, and get a year of feature updates” model. We also hope to provide a discount to Coda 2 owners, to be determined.

Will Nova be in the Mac App Store?
Not at this time. This is because of Nova’s heavy reliance on arbitrary third-party executables and extensions, prevented by sandboxing.

And later, an updated iOS editor.

We’ve also begun work on a new version of our iOS editor. It won’t ship at the same time as Nova, and it won’t be a feature-complete copy of Nova for Mac — rather, we’re planning something that hopefully strikes an ideal balance between Nova-like functionality, and Transmit-like functionality, for on-the-go work.

But! Until this new version is ready, we’ve somewhat-comically renamed the current app to just “Code Editor“, since there’s a new Coda in town — a reimagined document at So, don’t be alarmed if you search for Coda for iOS and wind up with Code Editor. That’s us!

We can’t wait to get these new apps in your hands!

Posted at 10:11 am 29 Comments
May 16th, 2019

After more than 20 years of making quality apps you love for Mac and iOS, Panic was ready to try something new…

…and that something was hardware.

Today, after more than four years of work by a small and talented team within Panic, we are extremely excited to introduce Playdate, a brand new handheld gaming system, arriving in early 2020.

Playdate is both very familiar, and totally new. It’s yellow, and fits perfectly in a pocket. It has a black-and-white screen with high reflectivity, a crystal-clear image, and no backlight. And of course, it has Wi-Fi, Bluetooth, USB-C, and a headphone jack. But it also has a crank. Yes, a crank: a cute, rotating analog controller that flips out from the side. It’s literally revolutionary.

It also includes a full season of original games, at no extra charge, delivered each week to the system — games in all sorts of genres that are all hopefully surprises.

Yes, this is all real.

Now before you ask, and you will ask, don’t worry, yes we’re still developing Mac and iOS software. In fact, we’ll be releasing a preview of the next major version of Coda later this year. Stay tuned!

But if you enjoy games, if you like beautiful things, or if you just enjoy having fun, you might enjoy Playdate. Hopefully it’s unexpected, but also totally Panic. We really think it’ll brighten your life.

Learn About Playdate
Posted at 2:30 pm 17 Comments
December 7th, 2018

Hello! Panic has an opening for a Web Services Engineer to join our award-winning team at our Portland, OR headquarters.

We’re looking for a Python developer with Django experience to help us maintain some of our existing web services and write some new ones!

We don’t currently support remote work, and would prefer to hire someone already in the Portland area, but we still encourage anyone to apply and would relocate someone within the USA if we can’t find a suitable local candidate. Please follow the link below to the job listing to see the other requirements for this position!

Now, it’s possible you might not think of Panic as much of a “web services” place. I get it. But there’s actually a lot going on over here! in addition to our rock-solid Panic Sync service, and our homegrown eCommerce platform (“Circle”, which just underwent a massive modernization rewrite), we have upcoming services needed for the next major update to Coda, as well as other very cool undisclosed future projects.

You’ll call a lot of shots, you’ll own a lot of things, and with any luck, it will feel pretty good. Sound interesting?

Head on over to our jobs page and submit your resume soon.

Also, there’s one other thing I want to mention again that’s not explicitly stated in the job posting: if you read our qualifications, feel like you’re really really close to matching them all but you’re missing one, or maybe you aren’t a super confident person or feel a touch of the ol’ imposter syndrome creep in as you read the page, please consider pushing through and applying anyway. None of us here are perfect geniuses or have it together 100% — we’re all just doing the best job we can, and I’m confident you can do that too.

We really look forward to hearing from you.

Posted at 4:50 pm Comments Off on Help Wanted: Web Services Engineer (Portland, OR)
November 15th, 2018

You already know Transmit is a wonderful file transfer app, maybe even the best on any platform. It’s jammed with features, it’s fast, it supports every major cloud storage provider, and it looks awfully nice.

But here’s something you might not know: the reasons we never put Transmit 5 in the App Store. They’re simple. We weren’t sure we could provide a good-enough Transmit experience under the stringent sandboxing security the App Store requires. And frankly, we weren’t sure Apple cared that much about the App Store on the Mac.

Since then, a lot has changed. macOS Mojave gave us a significantly improved App Store that caters to professionals like yourself and seems to treat apps with respect. And sandboxing has evolved enough that Transmit can be nearly feature-parity with its non-sandboxed cousin.

So, as we promised at WWDC: it was time to give this another go.

You can now get Transmit 5 on the Mac App Store!

But, there’s a twist…

A screenshot of Transmit in the Mac App Store.

The Twist

Transmit from the Mac App Store is a subscription — just $24.99 a year. Included with your subscription is Transmit, access to Panic Sync, and any major Transmit updates that we may release in the future, all rolled into a convenient yearly charge. There’s even a free 7-day trial before your subscription kicks in. And, of course, you can cancel at any time.

If you don’t like subscriptions, don’t worry! You can still buy Transmit 5 directly from us. It’s still $45. It will still include free minor updates. And you get the same support as a subscriber would.

The choice is yours. Love the App Store? Subscribe today. Don’t like subscriptions? Buy it directly from us. Everybody wins! (Almost.)

There’s a little something in it for us, too — a chance to learn about the subscription business and see how, if at all, it can impact our decisions moving forward.


Wait, so I have to subscribe to Transmit now?
No, my post-skimming friend, you don’t. While Transmit in the App Store is a subscription, you can still buy Transmit 5 directly from us at full price and own it forever for just $45.

How much does the subscription cost?
$24.99 a year. 

Is there a free trial?
Absolutely. When you install Transmit from the App Store, on first launch you’re given 7 days to use it as much as you want, without restriction, until the subscription kicks in, and you can cancel during the trial (here) if it doesn’t work for you. It’s really simple and should give you more than enough time to demo the app and make sure you love it.

What’s included with the subscription?
Transmit, Panic Sync, and frequent updates, of course. But you’ll also automatically get any major updates we release in the future as long as you remain subscribed.

I already bought Transmit 5. Can I switch to the App Store version?
If you bought Transmit 5 in the last 60 days, we can refund your purchase if you’d like to subscribe instead. Simply e-mail our support team. Beyond that, it’s gets really difficult, particularly as the prices are so different.

Hey, what if I love the App Store but strongly dislike subscriptions?
Yeah, that’s the one bummer zone in our plan — we’re sorry. But we believe the App Store is suited particularly well for subscriptions, and we’re always looking for a sustainable future building our complex applications.

Does it have the same features as regular Transmit 5?
Yes, it does! With one small exception — “Open in Terminal” depends on AppleScripting the terminal, which isn’t possible with sandboxing (yet). But even viewing or editing or changing the permissions of files you don’t own is now possible, which wasn’t until very recently.

What about Transmit Disk?
It’s not in this initial release, but stay tuned.

Any other differences in the App Store version?
For security, you have to manually “Choose” any local folders in the file browser that you want to navigate to. However, Transmit will remember the highest-level folder you’ve chosen, so over time you’ll have to do this less and less. (And here’s a pro-tip for all the FAQ readers out there: just drag your hard drive to the “choose a folder” view to unlock your entire drive and never be prompted again.)

If my subscription lapses, do I lose my sites/favorites?
Absolutely not. If you use Panic Sync, your sites are safely stored in our spacious, welcoming cloud, and you can sync them down in the future, even to non-subscription Transmit. And if you don’t use Panic Sync, as long as you don’t delete Transmit’s application support files, they’ll be there waiting for when you re-subscribe.

Will Transmit 5 support iCloud for sync?
We’re not planning to. We know it’s a bit of a bother to manage another account, but we really value the ability to debug syncing problems directly.

What about Coda in the Mac App Store?
Sadly, Coda cannot be sandboxed yet. We’re hopeful for the future.

Oh and hey while I’ve got you on the line where’s Coda 3?
? (More on Coda soon!)

Posted at 11:13 am 20 Comments