Advent of Patterns Wrap-up | James’ Coffee Blog

Advent of Patterns was motivated by my interest in learning more about design. I was inspired by the advice of a friend who said that to become a better designer I should first start by noting what I like – and don’t like – about other designs. I expanded upon this to start asking myself “what patterns do I see consistently?”

I have occasionally written about patterns in software and design this year. When reflecting on ideas for a potential Advent series this year, I felt patterns would be a good challenge. I started to take notes on some patterns I had observed in software and design: define once, reference everywhere; autosuggestions; pre-rendering data; time since article published disclosure boxes, and more.

Throughout this series, I have noticed there are so many patterns to write about! I covered 24 patterns in the series ranging from access control to autosuggestions to timelines. I had ideas for many more patterns to write about, too. Here are a few that are in my notes:

• Playgrounds: Environments in which someone can experiment with code (i.e. Swift Playgrounds, Repl.it).
• Synchronisation: How software can ensure state is replicated across different devices (i.e. Dropbox, Notion).
• Views: Filters on data (i.e. a specific view on a property listing site, or a filter on a database in software like Airtable). Views should ideally have URLs so they can be bookmarked and shared with others.
• Copy to clipboard: An icon that indicates that, when a region is clicked, its contents will be copied to the clipboard.
• Chunking: How chunks are used to help make text more readable.
• How user experience design gets more complex when you have more data (i.e. you need filters to sift through large datasets, but you don’t need them if you only have a few records).
• Pin / bookmark: Let users pin or bookmark pages within software for easy reference.
• Plain-text data: Plain-text data is easier to search and diff.
• Tabs: Used to create individual contexts in which a user can work within a broader context.
• Autosave: Automatically saving a user’s state.
• Confirmation: How users are asked to confirm sensitive actions (i.e. renaming a project, deleting an account).
• Drag and drop: Being able to drag and drop items into an editing area (i.e. drag-and-drop images into Ghost to include in a blog post).
• Side-by-side layout: Letting users create two or more panels in which to work (i.e. Visual Studio Code, where you can have multiple code files open side-by-side).
• Microsyntax: Syntax used to give semantic meaning to a piece of text (i.e. @James to indicate you are tagging me in a messaging application), or to invoke an action (i.e. / (slash) commands, [[ in Notion to open an inline function tray to add an internal link).
• Folders: Used to help users group information.
• Design systems: A system used to define a site’s identity across layout, spacing, typography, colour, wording, and more. Design systems help ensure consistency across pages on a website or several websites.
• Most recent: Display the most recent information in a collection (i.e. the most recent songs listened to on Spotify, most recent queries in a search engine that start with a given sequence, recently purchased items on a grocery store website).
• Plain text emails: A plain-text version of an email may be a preferable reading experience for users.
• Use the right tool for the job: Much of design and development is knowing what tools are available and when to use them, so that when you have a novel problem you have many tools you can use to help approach it.
• Inspector tools: Used to help someone understand a system (i.e. Developer Tools in browsers, query introspection tools available in software like Elasticsearch and the EXPLAIN function available in some SQL databases).

Documenting patterns has helped me build a mental toolkit of features and commonalities that I can reflect on when I am designing new pieces of software. For example, my reflections on confirmation encouraged me to make sure that the account deletion feature in Artemis, the web reader software I am designing, has a double opt-in mechanism to prevent users accidentally deleting their accounts.

Part of what makes the Advent series work is that I feel like I can make a list of lots of ideas from which I can choose. I like to commit to the series when I have a few ideas I can write about and enough confidence that I can come up with more ideas.

I often write several posts in one day that can then be published over more days. I find that when I get inspired, I can work for longer periods of time. Writing for 24 days – the period of the Advent of Patterns series this year – is challenging. Having confidence that I have enough to write about is essential to making me feel comfortable enough to start.

To everyone who has been reading along this year: thank you! I hope you learned something along the way. If you notice patterns as you design or develop software, write them down. Reflect on other places you have seen the pattern. Think about why the pattern is useful. Thinking in this way was the fuel for this series and has helped me grow a greater awareness of how software is designed.

Happy holidays!