✍️ Overview

Buttondown is functional, opinionated, and hierarchically flat. Every page serves a relatively well-scoped purpose, but the relationship between pages or elements within a single page is not always easy to understand.

The product is clearly built with a point of view about how writing newsletters should work, and this point of view seems to feed into the stark utilitarian feel. Despite this feel, the product has more character than most products in this space, driven mostly by a conversational copywriting style that trades brevity for humanity.

There are three areas where I think Buttondown can improve:

  1. Layout — while the full-width layout and “flatness” of each page might feel simple, it makes the product hard to read and scan on any screen size larger than a phone. When elements are full-width, it can make copy harder to read, items in a list harder to distinguish, and creates lots of whitespace that works against the user to help them understand where one section starts and the next begins.
  2. Hierarchy — there are opportunities to improve the hierarchy of a page by reducing the number of primary actions available to a user and using a wider range of typographic styles to help users to distinguish between elements like headings or interactive labels. Rethinking what controls deserve global persistence (like search, or the newsletter switcher) will help users accomplish their job faster, with fewer mistakes.
  3. Navigation — the lack of a top-level global navigation to quickly jump between my “jobs to be done” makes it feel awkward and click-intensive to navigate the product. The grouping of items within the primary navigation dropdown could be restructured to better reflect the way a user engages with the product, and the full-width persistent search bar could be reconsidered as one of two globally-available interface elements.

💬 Annotated Screenshots

View in Figma

<aside> 🚨 While the notes in this Notion document are pretty thorough, there are also tons of comments in the Figma file that might not be included here (I took a lot of notes!). Be sure to skim through both 😊

</aside>

Untitled

🎥 Watch the Loom

https://www.loom.com/share/43f148dbb0004e0480d17204ff8e0778?sharedAppSource=personal_library