mirror of
https://github.com/kogakure/website-astro-stefanimhoff.de.git
synced 2026-02-03 12:05:28 +00:00
feat: remove sketchnotes
This commit is contained in:
Stefan Imhoff
committed by
Stefan Imhoff
Stefan Imhoff
parent
8f371d9830
commit
02c124a953
@@ -1,57 +0,0 @@
|
|||||||
---
|
|
||||||
import Image from './Image.astro';
|
|
||||||
import Headline from './Headline.astro';
|
|
||||||
|
|
||||||
const { entry } = Astro.props;
|
|
||||||
|
|
||||||
function randomPosition() {
|
|
||||||
const positions = ['start', 'center', 'end'];
|
|
||||||
const randomIndex = Math.floor(Math.random() * positions.length);
|
|
||||||
return positions[randomIndex];
|
|
||||||
}
|
|
||||||
|
|
||||||
const imageLength = entry.data.images.length;
|
|
||||||
---
|
|
||||||
|
|
||||||
<div
|
|
||||||
class="col-span-full row-start-1 row-end-3 flex flex-col pbs-[clamp(3rem,_5.55vw,_9rem)] lg:flex-row lg:pbs-0"
|
|
||||||
>
|
|
||||||
<div class="p-gap lg:w-2/6">
|
|
||||||
<div
|
|
||||||
class="md:w-[66ch] lg:sticky lg:top-[calc(100vh_/_2_-_(max(30vh,_250px)_/_2))] lg:h-[max(30vh,_250px)] lg:w-full"
|
|
||||||
>
|
|
||||||
<Headline as="h1">{entry.data.title}</Headline>
|
|
||||||
<slot />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
class:list={[
|
|
||||||
'grid grow grid-cols-5 gap-x-[2vw] gap-y-gap bg-[#d0cdc8] dark:bg-[#0e0d0c] lg:w-2/3 print:!bg-transparent',
|
|
||||||
{
|
|
||||||
'lg:pbs-[calc(100vh_/_2_-_(max(30vh,_250px)_/_2))]': imageLength > 1,
|
|
||||||
'lg:items-center lg:justify-items-center': imageLength === 1,
|
|
||||||
},
|
|
||||||
]}
|
|
||||||
>
|
|
||||||
{
|
|
||||||
entry.data.images.map(({ src }: { src: string }, index: number) => (
|
|
||||||
<div
|
|
||||||
class:list={[
|
|
||||||
'col-span-full w-full !mbe-0 lg:col-span-3 lg:max-w-full',
|
|
||||||
{
|
|
||||||
'justify-self-start lg:col-start-1':
|
|
||||||
randomPosition() === 'start' && imageLength > 1 && index > 0,
|
|
||||||
'justify-self-center lg:col-start-2':
|
|
||||||
randomPosition() === 'center' && imageLength > 1 && index > 0,
|
|
||||||
'justify-self-end lg:col-start-3':
|
|
||||||
randomPosition() === 'end' && imageLength > 1 && index > 0,
|
|
||||||
'lg:col-start-2': imageLength === 1 || index === 0,
|
|
||||||
},
|
|
||||||
]}
|
|
||||||
>
|
|
||||||
<Image alt={entry.data.title} src={src} />
|
|
||||||
</div>
|
|
||||||
))
|
|
||||||
}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
@@ -1,8 +1,7 @@
|
|||||||
import { haiku, journal, projects, sketchnotes } from '../schema';
|
import { haiku, journal, projects } from '../schema';
|
||||||
|
|
||||||
export const collections = {
|
export const collections = {
|
||||||
haiku: haiku,
|
haiku: haiku,
|
||||||
journal: journal,
|
journal: journal,
|
||||||
projects: projects,
|
projects: projects,
|
||||||
sketchnotes: sketchnotes,
|
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -57,7 +57,7 @@ These are the countermeasures I took in the last few years or things I experimen
|
|||||||
- **I deleted all messengers**, except the ones my family is using.
|
- **I deleted all messengers**, except the ones my family is using.
|
||||||
- **I stopped reading or watching the daily news** (7 years ago). I’m the last to hear about the newest terrorist attack or the newest threats by Trump to the world. And I avoid the water cooler talks and coffee machine chats as hell. You can’t avoid the news, but not actively searching for news filters out a lot of the noise.
|
- **I stopped reading or watching the daily news** (7 years ago). I’m the last to hear about the newest terrorist attack or the newest threats by Trump to the world. And I avoid the water cooler talks and coffee machine chats as hell. You can’t avoid the news, but not actively searching for news filters out a lot of the noise.
|
||||||
- **I use RSS/Atom feeds** as my major information source because I can choose where and when to get my content from. I pull the content, when I want it (_Pull vs. Push Principle_).
|
- **I use RSS/Atom feeds** as my major information source because I can choose where and when to get my content from. I pull the content, when I want it (_Pull vs. Push Principle_).
|
||||||
- **I use many analog things**. I use Evernote to save content for later access, but I started writing a lot on paper. I always have a pen and a notebook with me. Likewise, I use [sketchnotes](/sketchnotes/) to extract the key aspects of an idea. The combination of writing with hand and drawing helps me remember things. And when I save content in Evernote, I make sure to mark the key aspects and write a summary at the top.
|
- **I use many analog things**. I use Evernote to save content for later access, but I started writing a lot on paper. I always have a pen and a notebook with me. Likewise, I use sketchnotes to extract the key aspects of an idea. The combination of writing with hand and drawing helps me remember things. And when I save content in Evernote, I make sure to mark the key aspects and write a summary at the top.
|
||||||
- **I rarely post links to social media** sites these days. I want to avoid attacking the attention of other people. People interested in what I write or like can go to [my website](https://www.stefanimhoff.de/).
|
- **I rarely post links to social media** sites these days. I want to avoid attacking the attention of other people. People interested in what I write or like can go to [my website](https://www.stefanimhoff.de/).
|
||||||
- **I don’t check in** or brag about the places I am at on social media.
|
- **I don’t check in** or brag about the places I am at on social media.
|
||||||
- **I share photos** with my family and not the whole world.
|
- **I share photos** with my family and not the whole world.
|
||||||
|
|||||||
@@ -141,7 +141,7 @@ I deleted many apps from my digital devices. Less distraction, fewer push messag
|
|||||||
|
|
||||||
I reduced my contacts on social media to roughly around Dunbar’s Number, which is a suggested cognitive limit to the number of people with whom one can maintain stable social relationships (150 people).
|
I reduced my contacts on social media to roughly around Dunbar’s Number, which is a suggested cognitive limit to the number of people with whom one can maintain stable social relationships (150 people).
|
||||||
|
|
||||||
If I find information that I want to remember, I try to store it less in digital form (I used to have 10,000+ notes in Evernote), but instead, use more analog, and create [Sketchnotes](/sketchnotes/) of the basic concepts of an idea.
|
If I find information that I want to remember, I try to store it less in digital form (I used to have 10,000+ notes in Evernote), but instead, use more analog, and create Sketchnotes of the basic concepts of an idea.
|
||||||
|
|
||||||
My calendar is nearly empty, I attempt not to fill it with appointments and live less planned.
|
My calendar is nearly empty, I attempt not to fill it with appointments and live less planned.
|
||||||
|
|
||||||
|
|||||||
@@ -149,7 +149,7 @@ I created a sophisticated `Row` component a month earlier that can automatically
|
|||||||
|
|
||||||
I thought long about dropping the [Projects](/projects/) page from my list for the initial launch of the new design because I had worked on the project for a long time. But then I decided to do it and invest in the two additional weeks because now is always the right time to do things. I not only created a Projects page but showcases for selected projects.
|
I thought long about dropping the [Projects](/projects/) page from my list for the initial launch of the new design because I had worked on the project for a long time. But then I decided to do it and invest in the two additional weeks because now is always the right time to do things. I not only created a Projects page but showcases for selected projects.
|
||||||
|
|
||||||
While showing all my projects, I decided to move my [Sketchnotes](/sketchnotes/) to a dedicated section on the website.
|
While showing all my projects, I decided to move my Sketchnotes to a dedicated section on the website.
|
||||||
|
|
||||||
## Migrating the Content
|
## Migrating the Content
|
||||||
|
|
||||||
|
|||||||
@@ -51,7 +51,7 @@ My Haiku (short Japanese poems) collection was previously loveless, dumped on a
|
|||||||
|
|
||||||
### Sketchnotes
|
### Sketchnotes
|
||||||
|
|
||||||
I had a collection of my Sketchnotes hosted on a subdomain on Tumblr and wanted to move it back to my website and created my own [Sketchnotes](/sketchnotes/) section.
|
I had a collection of my Sketchnotes hosted on a subdomain on Tumblr and wanted to move it back to my website and created my own Sketchnotes section.
|
||||||
|
|
||||||
### The Traditional Color of Japan
|
### The Traditional Color of Japan
|
||||||
|
|
||||||
|
|||||||
@@ -35,7 +35,7 @@ I simplified the [Haiku](/haiku/) section and removed unnecessary sections. It
|
|||||||
|
|
||||||
### Sketchnotes
|
### Sketchnotes
|
||||||
|
|
||||||
The last [Sketchnote](/sketchnotes/) section didn’t get a lot of love. The relaunch brings a nice grid layout with a detail page for each item.
|
The last Sketchnote section didn’t get a lot of love. The relaunch brings a nice grid layout with a detail page for each item.
|
||||||
|
|
||||||
### Journal
|
### Journal
|
||||||
|
|
||||||
|
|||||||
@@ -97,7 +97,7 @@ After an RSS feed is published for your website, you need to make sure RSS Reade
|
|||||||
|
|
||||||
It is a good idea to provide multiple feeds if you provide different content types. That way, the readers can subscribe to the topics they are interested in.
|
It is a good idea to provide multiple feeds if you provide different content types. That way, the readers can subscribe to the topics they are interested in.
|
||||||
|
|
||||||
I provide a feed for my essays, one for my Haiku poetry, one for my sketch notes and one for my link recommendations:
|
I provide a feed for my essays and for my Haiku poetry:
|
||||||
|
|
||||||
```html
|
```html
|
||||||
<link
|
<link
|
||||||
@@ -113,20 +113,6 @@ I provide a feed for my essays, one for my Haiku poetry, one for my sketch notes
|
|||||||
title="Stefan Imhoff (Haiku)"
|
title="Stefan Imhoff (Haiku)"
|
||||||
type="application/rss+xml"
|
type="application/rss+xml"
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<link
|
|
||||||
href="https://www.stefanimhoff.de/sketchnotes.xml"
|
|
||||||
rel="alternate"
|
|
||||||
title="Stefan Imhoff (Sketchnotes)"
|
|
||||||
type="application/rss+xml"
|
|
||||||
/>
|
|
||||||
|
|
||||||
<link
|
|
||||||
href="https://www.stefanimhoff.de/feed-raindrop.xml"
|
|
||||||
rel="alternate"
|
|
||||||
title="Stefan Imhoff (Recommendations)"
|
|
||||||
type="application/rss+xml"
|
|
||||||
/>
|
|
||||||
```
|
```
|
||||||
|
|
||||||
## Conclusion
|
## Conclusion
|
||||||
|
|||||||
@@ -12,7 +12,7 @@ After five months of hard work, I'm proud to present my new personal website, bu
|
|||||||
|
|
||||||
## Information Architecture, Content, and Design
|
## Information Architecture, Content, and Design
|
||||||
|
|
||||||
I always start by thinking about the content and identifying pages to remove, add, or update. I wanted to improve my [sketchnotes gallery](/sketchnotes/) and add a new AI art gallery.
|
I always start by thinking about the content and identifying pages to remove, add, or update. I wanted to improve my sketchnotes gallery and add a new AI art gallery.
|
||||||
|
|
||||||
Previously, many pages were difficult to access, hidden on subpages. To make them easier to find, I added a footer containing all important links to all sections. I also slimmed down the main navigation to only three links: [About](/about/), [Journal](/journal/), and [Projects](/projects/). I reduced the social links to the three most essential ones: 𝕏, GitHub, and Instagram.
|
Previously, many pages were difficult to access, hidden on subpages. To make them easier to find, I added a footer containing all important links to all sections. I also slimmed down the main navigation to only three links: [About](/about/), [Journal](/journal/), and [Projects](/projects/). I reduced the social links to the three most essential ones: 𝕏, GitHub, and Instagram.
|
||||||
|
|
||||||
|
|||||||
@@ -125,7 +125,7 @@ We had a cluster offsite in the summer, spending several days at [Herrenhaus Gut
|
|||||||
alt="White two-story manor house situated behind a vast green lawn with a large, leaning tree on the left and small groups of people walking near the entrance under a cloudy sky"
|
alt="White two-story manor house situated behind a vast green lawn with a large, leaning tree on the left and small groups of people walking near the entrance under a cloudy sky"
|
||||||
/>
|
/>
|
||||||
|
|
||||||
In June, I joined a [sketchnotes](/sketchnotes/) workshop that a co-worker organized at the company, and I still enjoy sketching to this day.
|
In June, I joined a sketchnotes workshop that a co-worker organized at the company, and I still enjoy sketching to this day.
|
||||||
|
|
||||||
We had one of the biggest Prototyping Days I have ever attended at XING this summer. A stand-up comedian was hired to perform, and we enjoyed T-shirt painting and [Taiko](https://grokipedia.com/page/Taiko) drum sessions. The entire company participated in a drum polonaise on the rooftop, making sure the whole city could hear our music and drums. I was on the winning team, and each member received a brand-new Apple Watch (Model 0) as the prize. We couldn’t believe we won such a valuable reward.
|
We had one of the biggest Prototyping Days I have ever attended at XING this summer. A stand-up comedian was hired to perform, and we enjoyed T-shirt painting and [Taiko](https://grokipedia.com/page/Taiko) drum sessions. The entire company participated in a drum polonaise on the rooftop, making sure the whole city could hear our music and drums. I was on the winning team, and each member received a brand-new Apple Watch (Model 0) as the prize. We couldn’t believe we won such a valuable reward.
|
||||||
|
|
||||||
|
|||||||
@@ -1,14 +0,0 @@
|
|||||||
---
|
|
||||||
title: Sketchnotes
|
|
||||||
date: 2015-01-01
|
|
||||||
format: 50-end
|
|
||||||
sort: 180
|
|
||||||
categories: ["Illustration", "Writing"]
|
|
||||||
intro: One of my passions is Sketchnotes or also called Visual Notetaking. In Sketchnoting you use visual language to visualize ideas, notes, or thoughts. I create Sketchnotes since I first visited a workshop in 2015.
|
|
||||||
image:
|
|
||||||
src: /assets/images/projects/thumbnails/sketchnotes.webp
|
|
||||||
aspectRatio: 1.43
|
|
||||||
more:
|
|
||||||
text: See Sketchotes
|
|
||||||
link: /sketchnotes/
|
|
||||||
---
|
|
||||||
@@ -1,11 +0,0 @@
|
|||||||
---
|
|
||||||
title: Being a Good Listener
|
|
||||||
date: 2017-04-29
|
|
||||||
sort: 100
|
|
||||||
coverSize: medium
|
|
||||||
images:
|
|
||||||
- src: /assets/images/sketchnotes/being-a-good-listener.webp
|
|
||||||
aspectRatio: 1.35
|
|
||||||
---
|
|
||||||
|
|
||||||
Sketchnote of the video [Being A Good Listener](https://youtu.be/-BdbiZcNBXg) by **The School of Life**.
|
|
||||||
@@ -1,10 +0,0 @@
|
|||||||
---
|
|
||||||
title: Better Conversations
|
|
||||||
date: 2017-04-29
|
|
||||||
sort: 90
|
|
||||||
images:
|
|
||||||
- src: /assets/images/sketchnotes/better-conversation.webp
|
|
||||||
aspectRatio: 0.75
|
|
||||||
---
|
|
||||||
|
|
||||||
A Sketchnote I did of the TED Talk **Celeste Headlee** [10 ways to have a better conversation](https://www.ted.com/talks/celeste_headlee_10_ways_to_have_a_better_conversation).
|
|
||||||
@@ -1,17 +0,0 @@
|
|||||||
---
|
|
||||||
title: Bikablo Practice
|
|
||||||
date: 2017-04-29
|
|
||||||
sort: 80
|
|
||||||
coverSize: large
|
|
||||||
images:
|
|
||||||
- src: /assets/images/sketchnotes/bikablo-practice-1.webp
|
|
||||||
aspectRatio: 0.75
|
|
||||||
- src: /assets/images/sketchnotes/bikablo-practice-2.webp
|
|
||||||
aspectRatio: 0.75
|
|
||||||
- src: /assets/images/sketchnotes/bikablo-practice-3.webp
|
|
||||||
aspectRatio: 0.75
|
|
||||||
- src: /assets/images/sketchnotes/bikablo-practice-4.webp
|
|
||||||
aspectRatio: 0.75
|
|
||||||
---
|
|
||||||
|
|
||||||
I practiced the vocabulary from the [Bikablo books](https://bikablo.com/en/tools/).
|
|
||||||
@@ -1,10 +0,0 @@
|
|||||||
---
|
|
||||||
title: How to Speak So That People Want to Listen
|
|
||||||
date: 2017-04-29
|
|
||||||
sort: 70
|
|
||||||
images:
|
|
||||||
- src: /assets/images/sketchnotes/how-to-speak.webp
|
|
||||||
aspectRatio: 0.75
|
|
||||||
---
|
|
||||||
|
|
||||||
Sketchnote of the TED-Talk [How to speak so that people want to listen](https://www.ted.com/talks/julian_treasure_how_to_speak_so_that_people_want_to_listen#t-185141) by **Julian Treasure**.
|
|
||||||
@@ -1,25 +0,0 @@
|
|||||||
---
|
|
||||||
title: Random Sketches
|
|
||||||
date: 2017-04-29
|
|
||||||
sort: 60
|
|
||||||
coverSize: large
|
|
||||||
images:
|
|
||||||
- src: /assets/images/sketchnotes/random-sketches-1.webp
|
|
||||||
aspectRatio: 0.75
|
|
||||||
- src: /assets/images/sketchnotes/random-sketches-2.webp
|
|
||||||
aspectRatio: 0.75
|
|
||||||
- src: /assets/images/sketchnotes/random-sketches-3.webp
|
|
||||||
aspectRatio: 0.75
|
|
||||||
- src: /assets/images/sketchnotes/random-sketches-4.webp
|
|
||||||
aspectRatio: 0.75
|
|
||||||
- src: /assets/images/sketchnotes/random-sketches-5.webp
|
|
||||||
aspectRatio: 0.75
|
|
||||||
- src: /assets/images/sketchnotes/random-sketches-6.webp
|
|
||||||
aspectRatio: 0.75
|
|
||||||
- src: /assets/images/sketchnotes/random-sketches-7.webp
|
|
||||||
aspectRatio: 0.75
|
|
||||||
- src: /assets/images/sketchnotes/random-sketches-8.webp
|
|
||||||
aspectRatio: 0.75
|
|
||||||
---
|
|
||||||
|
|
||||||
A collection of random sketches where I tried different visuals and lettering styles.
|
|
||||||
@@ -1,11 +0,0 @@
|
|||||||
---
|
|
||||||
title: Self-Actualization vs. Self-Image Actualization
|
|
||||||
date: 2017-04-29
|
|
||||||
sort: 50
|
|
||||||
coverSize: medium
|
|
||||||
images:
|
|
||||||
- src: /assets/images/sketchnotes/self-actualization.webp
|
|
||||||
aspectRatio: 1.35
|
|
||||||
---
|
|
||||||
|
|
||||||
**Bruce Lee** on the difference between **Self-Actualization** and **Self-Image Actualization**. Most people pursue only the first and never find their true selves.
|
|
||||||
@@ -1,10 +0,0 @@
|
|||||||
---
|
|
||||||
title: The Art of Enough
|
|
||||||
date: 2017-04-29
|
|
||||||
sort: 40
|
|
||||||
images:
|
|
||||||
- src: /assets/images/sketchnotes/the-art-of-enough.webp
|
|
||||||
aspectRatio: 0.75
|
|
||||||
---
|
|
||||||
|
|
||||||
Sketchnote for the article [The Art of Enough](https://experiencelife.com/article/the-art-of-enough/), about consumption, spending mindful, and buying quality.
|
|
||||||
@@ -1,10 +0,0 @@
|
|||||||
---
|
|
||||||
title: The Wim Hof Method
|
|
||||||
date: 2017-05-28
|
|
||||||
sort: 10
|
|
||||||
images:
|
|
||||||
- src: /assets/images/sketchnotes/wim-hof-method.webp
|
|
||||||
aspectRatio: 0.75
|
|
||||||
---
|
|
||||||
|
|
||||||
Sketchnote of the **Wim Hof Method**. A breathing technique, which allowed him to hold 26 world records of the extreme kind: Walking on Mount Everest in shorts, buried in ice for hours.
|
|
||||||
@@ -1,13 +0,0 @@
|
|||||||
---
|
|
||||||
title: This is Water
|
|
||||||
date: 2017-04-29
|
|
||||||
sort: 110
|
|
||||||
coverSize: large
|
|
||||||
images:
|
|
||||||
- src: /assets/images/sketchnotes/this-is-water-1.webp
|
|
||||||
aspectRatio: 1.35
|
|
||||||
- src: /assets/images/sketchnotes/this-is-water-2.webp
|
|
||||||
aspectRatio: 0.70
|
|
||||||
---
|
|
||||||
|
|
||||||
I always wanted to do a Sketchnote for the Commencement Speech **This Is Water** to Kenyon College class of 2005 by the late **David Foster Wallace**.
|
|
||||||
@@ -1,10 +0,0 @@
|
|||||||
---
|
|
||||||
title: Title Lettering
|
|
||||||
date: 2017-04-29
|
|
||||||
sort: 30
|
|
||||||
images:
|
|
||||||
- src: /assets/images/sketchnotes/title-lettering.webp
|
|
||||||
aspectRatio: 1.35
|
|
||||||
---
|
|
||||||
|
|
||||||
Title lettering in one of my Sketchnote books.
|
|
||||||
@@ -1,11 +0,0 @@
|
|||||||
---
|
|
||||||
title: Weight Idea
|
|
||||||
date: 2017-04-29
|
|
||||||
sort: 20
|
|
||||||
coverSize: medium
|
|
||||||
images:
|
|
||||||
- src: /assets/images/sketchnotes/weight-idea.webp
|
|
||||||
aspectRatio: 1.35
|
|
||||||
---
|
|
||||||
|
|
||||||
Some ideas I had about how to visualize weights for my training diary.
|
|
||||||
@@ -15,10 +15,6 @@
|
|||||||
{
|
{
|
||||||
"title": "Haiku",
|
"title": "Haiku",
|
||||||
"url": "/haiku/"
|
"url": "/haiku/"
|
||||||
},
|
|
||||||
{
|
|
||||||
"title": "Sketchnotes",
|
|
||||||
"url": "/sketchnotes/"
|
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
"misc": [
|
"misc": [
|
||||||
|
|||||||
@@ -132,12 +132,6 @@ const webManifest = isProduction && {
|
|||||||
title: 'Stefan Imhoff (Haiku)',
|
title: 'Stefan Imhoff (Haiku)',
|
||||||
href: site.url + '/rss-haiku.xml',
|
href: site.url + '/rss-haiku.xml',
|
||||||
},
|
},
|
||||||
{
|
|
||||||
rel: 'alternate',
|
|
||||||
type: 'application/rss+xml',
|
|
||||||
title: 'Stefan Imhoff (Sketchnotes)',
|
|
||||||
href: site.url + '/rss-sketchnotes.xml',
|
|
||||||
},
|
|
||||||
],
|
],
|
||||||
meta: [
|
meta: [
|
||||||
{
|
{
|
||||||
|
|||||||
@@ -13,7 +13,7 @@ I’m _Stefan Imhoff_, a Senior Web Developer from Hamburg, Germany.
|
|||||||
|
|
||||||
I find inspiration in a wide variety of media, from reading challenging and heterodox [books](https://goodreads.com/kogakure) about philosophy, science, and economics to listening to [podcasts](https://raindrop.io/kogakure/podcasts-24118384), watching [TV shows](https://www.themoviedb.org/u/kogakure/favorites/tv) and [movies](https://www.themoviedb.org/u/kogakure/favorites), and indulging in [Korean](https://www.themoviedb.org/list/8216385-korea?view=grid) and [Japanese](https://www.themoviedb.org/list/106001-japan?view=grid) dramas on Netflix.
|
I find inspiration in a wide variety of media, from reading challenging and heterodox [books](https://goodreads.com/kogakure) about philosophy, science, and economics to listening to [podcasts](https://raindrop.io/kogakure/podcasts-24118384), watching [TV shows](https://www.themoviedb.org/u/kogakure/favorites/tv) and [movies](https://www.themoviedb.org/u/kogakure/favorites), and indulging in [Korean](https://www.themoviedb.org/list/8216385-korea?view=grid) and [Japanese](https://www.themoviedb.org/list/106001-japan?view=grid) dramas on Netflix.
|
||||||
|
|
||||||
As a passionate enthusiast of storytelling, I am convinced that humans understand the world and find meaning through narratives. This fascination has led me to contribute to the propagation of impactful ideas through my writing. Whether I am crafting [essays](/journal/), [Sketchnotes](/sketchnotes/), or [Haiku](/haiku/), I aim to use the power of storytelling to communicate messages that resonate with readers. I have even written a free [book about Ninja and Ninjutsu](https://www.kogakure.de/en/).
|
As a passionate enthusiast of storytelling, I am convinced that humans understand the world and find meaning through narratives. This fascination has led me to contribute to the propagation of impactful ideas through my writing. Whether I am crafting [essays](/journal/), sketchnotes, or [Haiku](/haiku/), I aim to use the power of storytelling to communicate messages that resonate with readers. I have even written a free [book about Ninja and Ninjutsu](https://www.kogakure.de/en/).
|
||||||
|
|
||||||
In my spare time, I enjoy exploring nature through activities such as [walking and cycling](https://hamburg.stefanimhoff.de/), and doing [Calisthenics](/calisthenics/). I have a keen appreciation for the beauty of everyday life and find joy in the small things. Whether it’s the peacefulness of a forest, the vastness of the sea, or the grandeur of a mountain, I am constantly inspired by nature’s magnificence. I enjoy both the power of thunderstorms and the warmth of sunny days.
|
In my spare time, I enjoy exploring nature through activities such as [walking and cycling](https://hamburg.stefanimhoff.de/), and doing [Calisthenics](/calisthenics/). I have a keen appreciation for the beauty of everyday life and find joy in the small things. Whether it’s the peacefulness of a forest, the vastness of the sea, or the grandeur of a mountain, I am constantly inspired by nature’s magnificence. I enjoy both the power of thunderstorms and the warmth of sunny days.
|
||||||
|
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
---
|
---
|
||||||
layout: ../layouts/PageLayout.astro
|
layout: ../layouts/PageLayout.astro
|
||||||
title: Now
|
title: Now
|
||||||
updated: 2025-12-15
|
updated: 2026-01-25
|
||||||
description: This is my Now page, listing the things I currently do.
|
description: This is my Now page, listing the things I currently do.
|
||||||
intro: This is my Now page, a website with the content of what I am focused on at this point in my life.
|
intro: This is my Now page, a website with the content of what I am focused on at this point in my life.
|
||||||
backLink: /
|
backLink: /
|
||||||
@@ -15,8 +15,6 @@ The concept of a [Now](https://nownownow.com/) page is an idea by [Derek Silvers
|
|||||||
- 👨💻 Looking for a new job
|
- 👨💻 Looking for a new job
|
||||||
- 🦉 Learning 🇯🇵 Japanese and 🇪🇸 Spanish on [Duolingo](https://www.duolingo.com/profile/kogakure) and with [Anki](https://apps.ankiweb.net/)
|
- 🦉 Learning 🇯🇵 Japanese and 🇪🇸 Spanish on [Duolingo](https://www.duolingo.com/profile/kogakure) and with [Anki](https://apps.ankiweb.net/)
|
||||||
- ⌨️ Learning to type on my new [ZSA Voyager](https://www.zsa.io/voyager) split keyboard and at the same time learning to type [Colemak Mod-DH](https://colemakmods.github.io/mod-dh/) keyboard layout
|
- ⌨️ Learning to type on my new [ZSA Voyager](https://www.zsa.io/voyager) split keyboard and at the same time learning to type [Colemak Mod-DH](https://colemakmods.github.io/mod-dh/) keyboard layout
|
||||||
- 🖌️ Learning sketching with ink and watercolor and posting my art on [Instagram](https://www.instagram.com/kogakure.art/)
|
|
||||||
- 🪢 Learning to tie [knots](https://www.animatedknots.com/)
|
|
||||||
- 📝 Creating and reviewing highlights with [Readwise](https://readwise.io/i/stefan805) every day
|
- 📝 Creating and reviewing highlights with [Readwise](https://readwise.io/i/stefan805) every day
|
||||||
- 🗃️ Connecting ideas with the [Zettelkasten](https://grokipedia.com/page/Zettelkasten) note-taking method, using [Obsidian](https://obsidian.md/)
|
- 🗃️ Connecting ideas with the [Zettelkasten](https://grokipedia.com/page/Zettelkasten) note-taking method, using [Obsidian](https://obsidian.md/)
|
||||||
- 📚 Always reading at least two or three [books](https://www.goodreads.com/kogakure) at the same time
|
- 📚 Always reading at least two or three [books](https://www.goodreads.com/kogakure) at the same time
|
||||||
|
|||||||
@@ -1,27 +0,0 @@
|
|||||||
import rss from '@astrojs/rss';
|
|
||||||
import { getCollection } from 'astro:content';
|
|
||||||
|
|
||||||
import { site } from '../data/site';
|
|
||||||
import { sortBySortKey } from '../utils';
|
|
||||||
|
|
||||||
export async function get(context) {
|
|
||||||
const sketchnotes = await getCollection('sketchnotes');
|
|
||||||
sketchnotes.sort(sortBySortKey).reverse();
|
|
||||||
|
|
||||||
return rss({
|
|
||||||
stylesheet: '/rss.xsl',
|
|
||||||
title: `${site.title} (Sketchnotes)`,
|
|
||||||
description: 'This is a collection of Sketchnotes I’ve drawn.',
|
|
||||||
site: context.site,
|
|
||||||
items: sketchnotes.map((item) => ({
|
|
||||||
title: item.data.title,
|
|
||||||
pubDate: item.data.date,
|
|
||||||
customData: '<language>en-us</language>',
|
|
||||||
link: `/sketchnotes/${item.slug}/`,
|
|
||||||
content: `<div>${item.data.images
|
|
||||||
.map((img) => `<img alt="${item.data.title}" src="${img.src}" />`)
|
|
||||||
.join('')}</div>`,
|
|
||||||
})),
|
|
||||||
customData: `<language>en-us</language>`,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
@@ -1,73 +0,0 @@
|
|||||||
---
|
|
||||||
import type { CollectionEntry } from 'astro:content';
|
|
||||||
type Sketchnotes = CollectionEntry<'sketchnotes'>;
|
|
||||||
import { getCollection } from 'astro:content';
|
|
||||||
|
|
||||||
import { sortBySortKey } from '../utils';
|
|
||||||
|
|
||||||
import GridLayout from '../layouts/GridLayout.astro';
|
|
||||||
import Image from '../components/Image.astro';
|
|
||||||
import Link from '../components/Link.astro';
|
|
||||||
import PageTitle from '../components/PageTitle.astro';
|
|
||||||
import { Content as Intro } from '../text/sketchnotes/intro.mdx';
|
|
||||||
|
|
||||||
import { mapping } from '../mdx-components';
|
|
||||||
|
|
||||||
const allSketchnotes: Sketchnotes[] = await getCollection('sketchnotes');
|
|
||||||
allSketchnotes.sort(sortBySortKey);
|
|
||||||
|
|
||||||
const title = 'Sketchnotes';
|
|
||||||
const description = 'This is a collection of Sketchnotes I’ve drawn.';
|
|
||||||
---
|
|
||||||
|
|
||||||
<GridLayout title={title} description={description} grid="wide" backLink="/" class="grid" innerGrid>
|
|
||||||
<PageTitle grid="wide" innerGrid>Sketchnotes</PageTitle>
|
|
||||||
|
|
||||||
<article
|
|
||||||
class="col-start-1 col-end-17 grid md:col-start-4 md:col-end-12 xl:col-start-5 xl:col-end-11 print:block"
|
|
||||||
>
|
|
||||||
<Intro components={mapping} />
|
|
||||||
</article>
|
|
||||||
|
|
||||||
<nav
|
|
||||||
aria-label="Sketchnotes"
|
|
||||||
class="col-start-1 col-end-18 w-full md:col-start-1 md:col-end-16"
|
|
||||||
data-pagefind-ignore
|
|
||||||
>
|
|
||||||
<ol
|
|
||||||
class="gap-[max(25px,_2vw)] md:grid md:grid-flow-row-dense md:auto-rows-[50px] md:grid-cols-[repeat(auto-fit,_minmax(50px,_1fr))] md:grid-rows-[50px] print:block"
|
|
||||||
>
|
|
||||||
{
|
|
||||||
allSketchnotes.map(({ slug, data }: Sketchnotes) => (
|
|
||||||
<li
|
|
||||||
class:list={[
|
|
||||||
{
|
|
||||||
'md:col-span-3 md:row-span-2':
|
|
||||||
data.images[0].aspectRatio > 1 && data.coverSize === 'small',
|
|
||||||
'md:col-span-2 md:row-span-3':
|
|
||||||
data.images[0].aspectRatio < 1 && data.coverSize === 'small',
|
|
||||||
'md:col-span-4 md:row-span-3':
|
|
||||||
data.images[0].aspectRatio > 1 && data.coverSize === 'medium',
|
|
||||||
'md:col-span-3 md:row-span-4':
|
|
||||||
data.images[0].aspectRatio < 1 && data.coverSize === 'medium',
|
|
||||||
'md:col-span-6 md:row-span-5':
|
|
||||||
data.images[0].aspectRatio > 1 && data.coverSize === 'large',
|
|
||||||
'md:col-span-5 md:row-span-6':
|
|
||||||
data.images[0].aspectRatio < 1 && data.coverSize === 'large',
|
|
||||||
},
|
|
||||||
]}
|
|
||||||
>
|
|
||||||
<Link title={data.title} href={`/sketchnotes/${slug}/`}>
|
|
||||||
<Image
|
|
||||||
alt={data.title}
|
|
||||||
class="h-full mbe-10 md:w-full md:object-cover md:!mbe-0 [&_img]:!block [&_img]:!h-full [&_img]:border-solid [&_picture]:!block [&_picture]:!h-full"
|
|
||||||
loading="eager"
|
|
||||||
src={data.images[0].src}
|
|
||||||
/>
|
|
||||||
</Link>
|
|
||||||
</li>
|
|
||||||
))
|
|
||||||
}
|
|
||||||
</ol>
|
|
||||||
</nav>
|
|
||||||
</GridLayout>
|
|
||||||
@@ -1,57 +0,0 @@
|
|||||||
---
|
|
||||||
import type { CollectionEntry } from 'astro:content';
|
|
||||||
type Sketchnotes = CollectionEntry<'sketchnotes'>;
|
|
||||||
import { getCollection } from 'astro:content';
|
|
||||||
|
|
||||||
import { sortBySortKey } from '../../utils';
|
|
||||||
|
|
||||||
import BaseLayout from '../../layouts/BaseLayout.astro';
|
|
||||||
import PageHeader from '../../components/PageHeader.astro';
|
|
||||||
import Pagination from '../../components/Pagination.astro';
|
|
||||||
import GalleryDetail from '../../components/GalleryDetail.astro';
|
|
||||||
|
|
||||||
import { mapping } from '../../mdx-components';
|
|
||||||
|
|
||||||
export async function getStaticPaths() {
|
|
||||||
const sketchnotesEntries: Sketchnotes[] = await getCollection('sketchnotes');
|
|
||||||
const numberOfPages = sketchnotesEntries.length;
|
|
||||||
sketchnotesEntries.sort(sortBySortKey).reverse();
|
|
||||||
|
|
||||||
return sketchnotesEntries.map((entry, index) => ({
|
|
||||||
params: { slug: entry.slug },
|
|
||||||
props: {
|
|
||||||
entry,
|
|
||||||
next:
|
|
||||||
index + 1 === numberOfPages
|
|
||||||
? { slug: null, data: null }
|
|
||||||
: sketchnotesEntries[index + 1],
|
|
||||||
prev: index === 0 ? {} : sketchnotesEntries[index - 1],
|
|
||||||
},
|
|
||||||
}));
|
|
||||||
}
|
|
||||||
|
|
||||||
const { entry, prev, next } = Astro.props;
|
|
||||||
const { Content } = await entry.render();
|
|
||||||
|
|
||||||
const title = entry.data.title;
|
|
||||||
const description = `The sketchnote for "${entry.data.title}."`;
|
|
||||||
---
|
|
||||||
|
|
||||||
<BaseLayout title={title} description={description} header={false} footer={false}>
|
|
||||||
<div class="grid h-full grid-cols-18">
|
|
||||||
<PageHeader
|
|
||||||
class="z-10 col-span-full row-start-1 bg-transparent !mbe-0 dark:bg-transparent"
|
|
||||||
navigation={false}
|
|
||||||
backLink="/sketchnotes/"
|
|
||||||
/>
|
|
||||||
<GalleryDetail entry={entry}>
|
|
||||||
<Content components={mapping} />
|
|
||||||
</GalleryDetail>
|
|
||||||
<Pagination
|
|
||||||
nextText={'Next'}
|
|
||||||
nextUrl={next.slug && `/sketchnotes/${next.slug}`}
|
|
||||||
previousText={'Next'}
|
|
||||||
previousUrl={prev.slug && `/sketchnotes/${prev.slug}`}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</BaseLayout>
|
|
||||||
@@ -1,4 +1,3 @@
|
|||||||
export * from './haiku';
|
export * from './haiku';
|
||||||
export * from './journal';
|
export * from './journal';
|
||||||
export * from './projects';
|
export * from './projects';
|
||||||
export * from './sketchnotes';
|
|
||||||
|
|||||||
@@ -1,18 +0,0 @@
|
|||||||
import { defineCollection, z } from 'astro:content';
|
|
||||||
|
|
||||||
export const sketchnotes = defineCollection({
|
|
||||||
schema: z.object({
|
|
||||||
title: z.string(),
|
|
||||||
date: z.date(),
|
|
||||||
sort: z.number().optional(),
|
|
||||||
coverSize: z.enum(['small', 'medium', 'large']).default('small'),
|
|
||||||
images: z.array(
|
|
||||||
z.object({
|
|
||||||
src: z.string(),
|
|
||||||
aspectRatio: z.number(),
|
|
||||||
})
|
|
||||||
),
|
|
||||||
noindex: z.boolean().optional(),
|
|
||||||
nofollow: z.boolean().optional(),
|
|
||||||
}),
|
|
||||||
});
|
|
||||||
@@ -1,5 +1,5 @@
|
|||||||
- I do [Calisthenics](/calisthenics/) (Body Weight Training), like walking long distances, and regularly do Meditation to keep my body and mind fresh and stay in a growth mindset.
|
- I do [Calisthenics](/calisthenics/) (Body Weight Training), like walking long distances, and regularly do Meditation to keep my body and mind fresh and stay in a growth mindset.
|
||||||
- I do [Sketchnotes](/sketchnotes/) and love _Visual Thinking_. With these skills, I collect and visualize my ideas to deepen my understanding.
|
- I do sketchnotes and love _Visual Thinking_. With these skills, I collect and visualize my ideas to deepen my understanding.
|
||||||
- I have a passion for **writing**. Besides writing essays, I wrote a [book](https://www.kogakure.de/en/) and follow the _[Zettelkasten](/zettelkasten-note-taking-devonthink/)_ method of note-taking with [Obsidian](https://obsidian.md/).
|
- I have a passion for **writing**. Besides writing essays, I wrote a [book](https://www.kogakure.de/en/) and follow the _[Zettelkasten](/zettelkasten-note-taking-devonthink/)_ method of note-taking with [Obsidian](https://obsidian.md/).
|
||||||
- I have a high interest in **design and art**, and related topics such as architecture, interior design, and typography.
|
- I have a high interest in **design and art**, and related topics such as architecture, interior design, and typography.
|
||||||
- I’m a regular reader and love **[books](https://www.goodreads.com/kogakure/)**. Whenever possible I read books about philosophy, science, history, or related topics. My library has around 1,000 books.
|
- I’m a regular reader and love **[books](https://www.goodreads.com/kogakure/)**. Whenever possible I read books about philosophy, science, history, or related topics. My library has around 1,000 books.
|
||||||
|
|||||||
@@ -1 +1 @@
|
|||||||
I’m a Web Developer from Hamburg, Germany. I love design and art, reading books, listening to podcasts, creating Sketchnotes, taking photos, and writing Haiku.
|
I’m a Web Developer from Hamburg, Germany. I love design and art, reading books, listening to podcasts, creating sketchnotes, taking photos, and writing Haiku.
|
||||||
|
|||||||
@@ -1 +0,0 @@
|
|||||||
I started learning Sketchnotes in 2015. Sketchnotes are a way to visualize notes with text and images. I use them to take notes at conferences, meetings, and when I’m reading books. I’ve found that they help me to remember things better, and they are more fun to look at than a page full of text.
|
|
||||||
Reference in New Issue
Block a user