Inspired by Gwern Branwen’s design outline, this page documents the design philosophy behind not only this website, but also every other project I work on.

Lagomor.ph is implemented as a static website, compiled via Hugo from Standard Markdown, and hosted on a cloud server in Toronto.

“Indifference towards people and the reality in which they live is actually the one and only cardinal sin in design.”

Dieter Rams

It is designed to be readable, pleasing to the eye, and easy to navigate. The logo, which is often the singular image on each page, was drawn by Rek Bell.

Fundamental Principles

1. Affordances Should be Obvious

   Donald Norman’s book The design of everyday things highlights the concept of affordances in design, refering to the properties of an object that indicate how it can be used - essentially, the possibilities of action presented by and object. In good design, these affordances should be evident, enabling users to understand at a glace how an object can be interacted with.

   In the context of this site, there is no hidden content, drop down menus, or “hamburgers”. Hyperlinks are inline, underlined and made clear. Where symbology is used instead of text, it is clear what icons represent, and tooltips appear on hover with text explaining action.

2. Be Brutal, Be Minimal

   Brutalism is an architecture style that showcases the raw building materials and structural elements of a building over decorative design. In web design, a “brutalist” website is one that takes advantage of as many default web browser features as possible, supplementing only where neccessary with Javascript or CSS.

   Minimalism is the idea of using as little design as possible to convey your intent or message. ¹

   This website tries to walk the fine line between these two schools of thought using just enough design. Less, but better. Writings are often dense, so Serif fonts are prefered for readability. Images use baked in browser functions and require no JavaScript - where JavaScript is used, it is used on optional features - you can read the text of this site without it. ²

3. Use as Little Computation as Possible

   Computers have become extremely powerful and capable, but good design should strive to use as few resources as possible. This design philosophy means speed and efficency of use are highlighted over features, but it doesn’t mean I don’t take full advantage of new and experimental browser features. This webpage can be opened in almost any browser, including terminal ones. ³

4. Everything Should Do Only One Thing, and Well

   Multitaskers are the bane of my existence. A smartphone can do anything and all of it poorly. In attempting to build a tool useable by everyone, you make something that sacrifices usasbility for anyone.

   Frequently people debate this with me. “What about a kitchen knife? A kitchen knife can cut anything, is useable in many circumstances, and therefore is a multitasker.” No. A knife (should) do one thing - cut - and nothing more. What it can cut is up to the end user, but it’s clear its purpose and can’t be used to say, boil pasta.

Miscellaneous Principles

• Any UI element that can be clicked should be styled in the same way a hyperlink is. ⁴
• Information should be conveyed as succinctly as possible, at expense to SEO. ⁵
• Information over the author.
• Whatever you’re building should work on the smallest device in its category.
• Anything that is taken for granted must be scrutinized.
• Strongly consider if the device you are building actually needs a clock display in it.

Design Inspirations

• Donald Norman
• Marie Kondo
• Dieter Rams
• Kōnosuke Matsushita

Footnotes