Ampersand

Discover, inspect, and collect free fonts

Comment

Hey, before you read the project description, I would suggest starting with the video (if possible), so that you don't get any spoilers 😅

Inspiration

  • Public Domain Image Archive inspired the infinite font canvas inside Ampersand
  • Accent color and the way it's used was inspired by Teenage Engineering's TX-6
  • Settings cutout was inspired by Apple's Dynamic Island and Camera Control features
  • The icon-carousel zoom animation was inspired by the macOS Dock hover effect
  • The idea of selling customization (only app icons for now) was inspired by Clear
  • The idea of showing detailed font metrics came from FontDrop
  • Some haptics and part of the slider design came from playing with my dad's radio

The actual idea for Ampersand came from simply wanting a good way to use Google Fonts on my phone (after a few frustrating experiences). I really like typography so I figured I could do it some justice on mobile.

What it does

Ampersand is an iOS app that lets you discover, inspect, and collect free fonts.

The main interaction inside Ampersand is the infinite, omnidirectional font canvas (so fancy right). It's fun precisely because you don't know what you're going to find as you scroll, and it doesn't feel curated or "algorithmical" because it doesn't tell you where to go, you're free to explore in any direction. (but if you prefer a list view, it's also available, in case you want to see fonts in some specific order).

And you can search fonts (by name or designer) inside Ampersand or in Spotlight.

Ampersand also gives you powerful tools for inspecting/understanding a font. You have full access to variable axes, font metrics, language/script support, glyph inspection, and other metadata like designer, description, date added, license, popularity, and category.

To save fonts, you can create as many collections as you want. So if you're picking a font for a new project for example, you can create a collection and start saving font candidates and see them side by side before deciding on a winner. It's a great tool for choosing (or curating) fonts.

I use RevenueCat to sell access to Ampersand Deluxe, a set of alternate app icons for Ampersand. Deluxe is a lifetime purchase of $8, which includes all future additions. As I add more icons and other features to Deluxe, I will raise the price for new customers accordingly.

How we built it

Most of Ampersand's design came from sketching on paper, refining a bit on Sketch, building with Codex, and live-tuning the UI (ie. asking Codex to create a temporary floating panel where I can tune each parameter of the UI I'm building directly inside the app, so that I can get to the exact look and feel I have in mind). Shoutout to Josh Puckett for the term "live tuning".

Every font inside Ampersand comes from Google Fonts (which means they are all free for commercial use). The app is built with SwiftUI (except for the infinite canvas, which uses UIKit). Core Haptics is used for custom haptic feedback. App Clips are used for sharing fonts. App Intents & Core Spotlight are used for Spotlight indexing. Core Text is used for rendering and inspecting fonts.

Accomplishments that we're proud of

Making something that satisfies my hunger for typography on mobile. And for making something that's both delightful and very useful.

What we learned

Caring is a conscious and continuous choice that you have to make as a designer. Coming up with new stuff takes a lot of effort (for me at least), and sitting in front of a blank canvas is scary (this happened a lot with Ampersand). One-shotting stuff is temptingly easy, but my best work invariably comes from burning my brain cells and truly caring about what I'm making.

Hope that's not too philosophical.

What's next for Ampersand

A few things come to mind:

  • More Ampersand Deluxe features. Especially customization of other things, not just the app icon
  • Widgets
  • Font of the week
  • Fonts from other sources, not just Google Fonts
  • Show fonts' stylistic sets
  • Mac app
  • iPhone Duo special experience

Built With

Share this project:

Updates

Submission history