diff --git a/src/content/journal/2007/gtd.mdx b/src/content/journal/2007/gtd.mdx index d9ce8be..147f3c0 100644 --- a/src/content/journal/2007/gtd.mdx +++ b/src/content/journal/2007/gtd.mdx @@ -4,7 +4,7 @@ slug: gtd author: Stefan Imhoff date: 2007-11-24T01:15:00+02:00 description: "I’ve been working with GTD (Getting Things Done) for 1.5 years: An Introduction to Organization and Self-Management with GTD." -tags: ["productivity", "self-improvement"] +tags: ["productivity", "self-improvement", "book"] --- ## One and a Half Years With GTD @@ -14,7 +14,7 @@ For one and a half years I use now the principles of _GTD_ (Getting Things D In his book __, David Allen introduces an interesting system that allows you to do your tasks efficiently. - + In any case, I think that one _gets_ the everyday madness governed by Allen’s system. @@ -22,7 +22,7 @@ In any case, I think that one _gets_ the everyday madness governed by Allen’s ## The GTD Basics
- My desk before + My desk before
GTD uses the concept of _contexts_, which are certain situations/places to which a task is assigned (telephone, home, care, or similar). Besides, there can be an allocation to a _project_. @@ -42,7 +42,7 @@ Tasks can be delegated to other people or planned for certain times. If you have ## GTD in Everyday Life
- My desk afterward + My desk afterward
GTD may look complicated or awkward, but it helps immensely to prevent keeping pondering. diff --git a/src/content/journal/2007/koi-design.mdx b/src/content/journal/2007/koi-design.mdx index 8fcd074..6192aff 100644 --- a/src/content/journal/2007/koi-design.mdx +++ b/src/content/journal/2007/koi-design.mdx @@ -5,7 +5,7 @@ author: Stefan Imhoff date: 2007-06-02T02:00:00+02:00 description: Irezumi (Japanese tattooing) is an inspiration for my website and the origin of my design. cover: /assets/images/cover/design-koi.jpg -tags: ["design"] +tags: ["design", "book"] --- ## Inspiration and Idea For My Header diff --git a/src/content/journal/2009/gitweb-theme.mdx b/src/content/journal/2009/gitweb-theme.mdx index 7a37a7c..7930970 100644 --- a/src/content/journal/2009/gitweb-theme.mdx +++ b/src/content/journal/2009/gitweb-theme.mdx @@ -4,7 +4,7 @@ slug: gitweb-theme author: Stefan Imhoff date: 2009-02-19T20:00:00+02:00 description: My popular theme for GitWeb to download for free. Now GitWeb looks more similar to GitHub and is not ugly anymore. -tags: ["download"] +tags: ["download", "design"] --- ## GitHub Style for GitWeb @@ -18,29 +18,29 @@ The exact installation instructions are included in the package on GitHub. ## Screenshots
- Project View + Project View
- Summary + Summary
- Commit + Commit
- Commit DIFF + Commit DIFF
- Log + Log
- Tree View + Tree View
- +
diff --git a/src/content/journal/2014/john-seymour-books.mdx b/src/content/journal/2014/john-seymour-books.mdx index 5b07e8b..cda19b2 100644 --- a/src/content/journal/2014/john-seymour-books.mdx +++ b/src/content/journal/2014/john-seymour-books.mdx @@ -4,7 +4,7 @@ slug: john-seymour-books author: Stefan Imhoff date: 2014-08-03T16:00:00+02:00 description: On John Seymour’s fantastic, beautifully illustrated books on self-sufficiency, agriculture, and crafts. The optimal equipment for an upcoming zombie apocalypse. -tags: ["book", "recommendation"] +tags: ["book", "recommendation", "self-improvement"] --- My earliest memories of books are that I lie on my parents’ soft carpet on my stomach in the living room and read the Atlas of World History or the books of _John Seymour_. Who was John Seymour, and why did his books remain in my memory? diff --git a/src/content/journal/2014/website-typography.mdx b/src/content/journal/2014/website-typography.mdx index 74b86dd..ef721cc 100644 --- a/src/content/journal/2014/website-typography.mdx +++ b/src/content/journal/2014/website-typography.mdx @@ -4,7 +4,7 @@ slug: website-typography author: Stefan Imhoff date: 2014-06-19T10:30:00+02:00 description: "About the typography of my new website: scale, font, vertical rhythm, font size, font size, and sentence width." -tags: ["design", "code"] +tags: ["design", "code", "book"] --- I’m a _typophile_. But this is nothing for a self-help group because it means to love typography. It was clear to me from the start that I would start with typography for my new website. diff --git a/src/content/journal/2017/minimalism.mdx b/src/content/journal/2017/minimalism.mdx index 3248458..95b766c 100644 --- a/src/content/journal/2017/minimalism.mdx +++ b/src/content/journal/2017/minimalism.mdx @@ -5,7 +5,7 @@ author: Stefan Imhoff date: 2017-06-07T18:30:00+02:00 featured: true description: Minimalism is currently popular, but Minimalism is hard to understand, and many misconceptions can be found. This essay carries my thoughts on Minimalism and my history with it. -tags: ["self-improvement"] +tags: ["self-improvement", "book"] --- ## The Pursuit of Minimalism diff --git a/src/content/journal/2018/morning-routine.mdx b/src/content/journal/2018/morning-routine.mdx index 0a752e9..b3abdd1 100644 --- a/src/content/journal/2018/morning-routine.mdx +++ b/src/content/journal/2018/morning-routine.mdx @@ -4,7 +4,7 @@ slug: morning-routine date: 2018-09-08T18:00:00+02:00 author: Stefan Imhoff description: On the advantages of building yourself a morning routine and the details of my morning routine. -tags: ["self-improvement"] +tags: ["self-improvement", "book"] --- Lately, I have been thinking a lot about habits and routines. I’ve had always routines in my life, but I wanted to build a better morning routine because I’ve come across many sources, that emphasized the importance of routines for success in life. @@ -56,7 +56,7 @@ I have a [Traveler’s Notebook Passport Size](https://www.travelers-company.com I start by reading the daily chapter of the fantastic book . The Stoic practice is the best start to a day you can have. Thereafter, I read 1-2 books, not novels, but harder topics (philosophy, science, or psychology). If I want to remember a quote or part of a book, I mark it and extract it later into my Commonplace book or write it down in my pocket-size notebook. - + ### Get Up diff --git a/src/content/journal/2020/new-website-2020-design.mdx b/src/content/journal/2020/new-website-2020-design.mdx index 89b52b9..15b7f06 100644 --- a/src/content/journal/2020/new-website-2020-design.mdx +++ b/src/content/journal/2020/new-website-2020-design.mdx @@ -4,7 +4,7 @@ date: 2020-07-21T08:00:00+02:00 slug: new-website-2020-design author: Stefan Imhoff description: This is the second of three parts in a series of essays about the process of creating my new website. This one shows the design process for my website. -tags: ["design"] +tags: ["design", "book"] series: new-website-2020 --- @@ -41,8 +41,8 @@ The next thing I moved my attention to was Typography. I always loved Typography I even own a copy of the 650 pages strong [Decode Unicode](https://www.goodreads.com/book/show/17186505-decodeunicode), a book listing all 137,374 typographical characters, from the Armenian capital letter _Ayb_ to the Khmer Letter _Ka_. There is even a [complete website](https://decodeunicode.org/) showing all characters and a [two-and-a-half-hour-long movie](https://vimeo.com/48858289) showing all characters. - - + + ### Typeface @@ -58,7 +58,7 @@ I like in particular the italic font with the beautiful loops and curves. I pick Next, I picked a Typographic Scale. A scale is a way to pick font sizes based on a fixed set of rules, for example, a specific harmonic number or formula to create a harmonic visual image. I decided to go with the [golden section](https://www.modularscale.com/?1&em&1.618) (ratio 1:1.618).
- Typographic Scale + Typographic Scale
I picked 20 Pixels as the base font size. Furthermore, I’m in my forties and websites pick fonts far too small. The company iA Inc. wrote 2006 the essay [The 100% Easy-2-Read Standard](https://ia.net/topics/100e2r), but still, fonts below the recommended 16 Pixels of browsers are a standard. @@ -82,15 +82,15 @@ I wanted my website to have the color of Japanese _Washi_ (和紙) paper. Early I picket the HSL color space, to be able to quickly create variations of my colors. In HSL, the first value **H** stands for Hue. Red is 0°, and then each color is represented by a value on a circle. The **S** stands for Saturation and is a value between 0% (gray) and 100% (full saturation). The **L** stands for Lightness and is a value between 0% (black) and 100% (white). With all three values, I was able to create the colors I wanted: First, I picked the color hue I wanted to go for. Next, I reduced the Saturation to a value below or around 10% which I found made any color instantly look _Shibui_ (one of its identifying features is desaturated colors). To get all the other colors, I moved the Lightness value down for a dark color or up for a light color. - - - + + + - - - + + + --- @@ -102,15 +102,15 @@ Additionally, to the main colors, I created 3 other color themes: A green one fo #### Green - - - + + + - - - + + + --- @@ -118,15 +118,15 @@ Additionally, to the main colors, I created 3 other color themes: A green one fo #### Brown - - - + + + - - - + + + --- @@ -134,15 +134,15 @@ Additionally, to the main colors, I created 3 other color themes: A green one fo #### Blue - - - + + + - - - + + + --- @@ -154,19 +154,19 @@ I didn’t invert colors but needed to make sure to create good contrast, which Next, I moved my focus to the logo. A logo is always a difficult topic. Do I need one? Why? What should it be? My initials? An image? It’s easy to create a cheesy logo. I used a _rakkan_ (落款), a Japanese artist seal, for at least 10 years. An artist carved it for me into stone, using the oldest Chinese font, the _small seal script_, introduced by the Chinese Emperor _Qin Shi Huang_, 2200 years ago. It gets pressed into red ink and then applied to the artwork as the signature. I choose the characters of my internet pseudonym _kogakure_ (木隠), meaning “hidden behind leaves”.
- Rakkan + Rakkan
I created a few sketches of other possible logos, but eventually, I discarded them all and moved back to my _rakkan_. Likewise, I decided to simplify the vector form and reduce the number of points and make it more performant and easier to recognize in smaller sizes.
- Logo Scribbles + Logo Scribbles
But after finishing the logo, I decided in the interest of simplicity and austerity that there is no reason to use a logo at all. I even removed my name from the header, as it’s obvious on what website the visitor is. My name is written enough around the site. The logo will appear in parts of the website, for example as an icon for the app, or on other locations, a logo fits.
- Rakkan Logo + Rakkan Logo
## Grid @@ -174,7 +174,7 @@ But after finishing the logo, I decided in the interest of simplicity and auster Early on I got obsessed with the [Golden Canon Grid](https://youtu.be/fWfD0EfiXcE) and my early designs used a complicated and sophisticated version of it.
- Golden Canon Grid + Golden Canon Grid
But gradually I decided this would end in a nightmare when moving to code and migrating to a modular grid. However, I didn’t recognize my error of using a fixed-size module for the grid—an error I had to correct later. @@ -204,7 +204,7 @@ And working with [Affinity Designer](https://affinity.serif.com/designer/), [Aff I decided to use Aaron James Draplin's method of designing. He is a talented designer inspiring millions with his artwork and author of . - + As he shows in the fantastic free video, [Aaron Draplin Takes On a Logo Design Challenge](https://youtu.be/zOPA0NaeTBk), he starts in the middle with an idea and then duplicates the whole version and iterates on it. If he reaches a dead end, he moves back to the last junction and moves from there in another direction. In the end, he has one giant board with dozens of variants and ideas, none of them worked into good craftsmanship or details, but keeps everything loose and ungrouped to be able to manipulate the individual pieces. @@ -212,11 +212,11 @@ As he shows in the fantastic free video, [Aaron Draplin Takes On a Logo Design C I followed this technique on all my designs and created dozens of variations, sometimes entire pages, sometimes a small detail as the footer or a meta section.
- All Artboards of the base design + All Artboards of the base design
- Variants of the Meta section + Variants of the Meta section
Designing was the part that brought the most fun to me. Designing is like a concert: It starts with a cello, but then more and more instruments get added until the full [concert ends in a massive crescendo](https://youtu.be/XpT-92HS11I). The start is always the hardest, with the designer staring at a blank, white screen. But then things fall into the place and ideas multiply and in the end, everything is obvious, and the next screen is easy to create. @@ -224,23 +224,23 @@ Designing was the part that brought the most fun to me. Designing is like a conc I started designing the blog detail page headline and moved out from there, creating text, header, footer, and small details.
- About Section + About Section
Then I moved into color variations for the pages. I designed error pages, navigation, special pages, and the homepage last. I didn’t design every detail, but quickly moved from idea to idea, leaving behind a mess of unnamed layers and incomplete or outdated ideas.
- Color Variants + Color Variants
I created a giant design for all layout variations I wanted to support on a page (e.g., the combination of an image and a text). I moved quickly to [CodePen](https://codepen.io/) to create prototypes for these variations to validate my ideas where feasible. You can see all my prototypes on my CodePen account.
- Homepage + Homepage
- Haiku Section + Haiku Section
In the fall of 2019, I finished my design and left it for a few weeks untouched to see if I start disliking it. On the 25th of November 2019, I finally started coding. diff --git a/src/content/journal/2020/new-website-2020-inspiration.mdx b/src/content/journal/2020/new-website-2020-inspiration.mdx index b86b0cd..0744291 100644 --- a/src/content/journal/2020/new-website-2020-inspiration.mdx +++ b/src/content/journal/2020/new-website-2020-inspiration.mdx @@ -4,7 +4,7 @@ slug: new-website-2020-inspiration date: 2020-07-14T08:00:00+02:00 author: Stefan Imhoff description: This is the first of three parts in a series of essays about the process of creating my new website. This one has a look into the inspiration for my website. -tags: ["design"] +tags: ["design", "book"] series: new-website-2020 --- @@ -23,15 +23,15 @@ And as I always collected designs and saved them on boards or put them in folder I read all books from Kenya Hara, the art director of Muji, and one of the leading designers of Japan. Additionally, I read the old and famous books by Jun’ichirō Tanizaki and by Kuki Shūzō. I read a compendium on all major Japanese currents of Art and Aesthetics, from glamorous gold-loaded styles to minimalistic Zen styles. I mapped out my research in detail in this [mind-map](https://my.mindnode.com/FGhdh66uMbi1aJ9RfriKUL3JoMCHd18aS8z9Uayw). - - - - - - - - - + + + + + + + + + ## Shibui – Subtle Elegance diff --git a/src/content/journal/2021/processing-information-into-notes.mdx b/src/content/journal/2021/processing-information-into-notes.mdx index 9f3fe58..0122c72 100644 --- a/src/content/journal/2021/processing-information-into-notes.mdx +++ b/src/content/journal/2021/processing-information-into-notes.mdx @@ -4,7 +4,7 @@ slug: processing-information-into-notes date: 2021-05-13T10:00:00+02:00 author: Stefan Imhoff description: My process of extracting information out of books, articles, podcasts, and videos and creating atomic notes. -tags: ["productivity", "writing", "recommendation"] +tags: ["productivity", "writing", "recommendation", "book"] --- Everybody is consuming content, through books, articles, videos, podcasts, or other media. We consume content for entertainment, to be informed, or to learn and grow. But few people take the time to extract the valuable parts from the content they are consuming.