dennisthiessen/thiessen.io
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Tone down hero name, crop new avatar, drop em-dashes
My Gatsby Deployment pipeline / build-and-deploy (push) Successful in 3m46s
Details

Browse Source 
Make the name a quiet heading and let the one-line thesis lead the hero.
Replace the portrait with a center-cropped 4:5 version of the new photo
(downscaled 1.2 MB -> 91 KB) and drop the now-pointless grayscale hover.
Remove em-dashes from copy (restructured prose; en-dashes for year ranges;
mid-dot in the page titles).

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
Dennis Thiessen
2026-06-28 17:24:10 +02:00
parent 8856e7c273
commit 4525837081
4 changed files with 25 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/assets/images/avatar.jpg
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.2 MiB

After

Width:  |  Height:  |  Size: 91 KiB

src/assets/style.css
+11 -15
View File
@@ -1,5 +1,5 @@
/* /*
thiessen.io — personal site thiessen.io personal site
Swiss-minimal direction. Display: Space Grotesk · Body: Hanken Grotesk · Mono: Space Mono. Swiss-minimal direction. Display: Space Grotesk · Body: Hanken Grotesk · Mono: Space Mono.
One accent (signal cobalt), used only for links and the live timeline node. One accent (signal cobalt), used only for links and the live timeline node.
*/ */
@@ -138,22 +138,22 @@ a { color: inherit; }
.hero__name { .hero__name {
font-family: var(--font-display); font-family: var(--font-display);
font-weight: 600; font-weight: 500;
font-size: clamp(3rem, 9.5vw, 7rem); font-size: clamp(1.5rem, 2.6vw, 1.9rem);
line-height: 0.92; line-height: 1.1;
letter-spacing: -0.035em; letter-spacing: -0.005em;
margin: 0; margin: 0;
} }
.hero__lead { .hero__lead {
font-family: var(--font-display); font-family: var(--font-display);
font-weight: 400; font-weight: 500;
font-size: clamp(1.35rem, 2.7vw, 2rem); font-size: clamp(1.5rem, 3.2vw, 2.35rem);
line-height: 1.18; line-height: 1.16;
letter-spacing: -0.01em; letter-spacing: -0.015em;
color: var(--ink); color: var(--ink);
max-width: 30ch; max-width: 26ch;
margin: 1.75rem 0 0; margin: 1rem 0 0;
} }
.hero__meta { .hero__meta {
@@ -194,12 +194,8 @@ a { color: inherit; }
object-fit: cover; object-fit: cover;
border-radius: 6px; border-radius: 6px;
border: 1px solid var(--mist); border: 1px solid var(--mist);
filter: grayscale(100%) contrast(1.02);
transition: filter 0.4s ease;
} }
.portrait img:hover { filter: grayscale(0%); }
/* ---------- profile ---------- */ /* ---------- profile ---------- */
.prose p { .prose p {
src/pages/404.js
+1 -1
View File
@@ -7,7 +7,7 @@ const NotFoundPage = () => (
<Layout> <Layout>
<Helmet> <Helmet>
<html lang="en" /> <html lang="en" />
<title>Not found — Dennis Thiessen</title> <title>Not found · Dennis Thiessen</title>
</Helmet> </Helmet>
<div className="wrap notfound"> <div className="wrap notfound">
<p className="eyebrow">Error 404</p> <p className="eyebrow">Error 404</p>
src/pages/index.js
+13 -13
View File
@@ -4,26 +4,26 @@ import { Helmet } from 'react-helmet'
import Layout from '../components/layout' import Layout from '../components/layout'
import avatar from '../assets/images/avatar.jpg' import avatar from '../assets/images/avatar.jpg'
const SITE_TITLE = 'Dennis Thiessen — Data, Analytics & AI Engineer' const SITE_TITLE = 'Dennis Thiessen · Data, Analytics & AI Engineer'
const SITE_DESCRIPTION = const SITE_DESCRIPTION =
'Dennis Thiessen is a Staff Data, Analytics & AI Engineer in Bern, Switzerland, building the data pipelines and ML infrastructure that production systems run on.' 'Dennis Thiessen is a Staff Data, Analytics & AI Engineer in Bern, Switzerland, building the data pipelines and ML infrastructure that production systems run on.'
const EMAIL = 'dennis@thiessen.io' const EMAIL = 'dennis@thiessen.io'
const LINKEDIN = 'https://www.linkedin.com/in/dennis-thiessen' const LINKEDIN = 'https://www.linkedin.com/in/dennis-thiessen'
// Career as a pipeline — most recent first. Each node is a role. // Career as a pipeline, most recent first. Each node is a role.
const ROLES = [ const ROLES = [
{ {
year: '2023 — PRESENT', year: '2023 – PRESENT',
company: 'Swisscom', company: 'Swisscom',
location: 'Bern, CH', location: 'Bern, CH',
title: 'Staff Data, Analytics & AI Engineer', title: 'Staff Data, Analytics & AI Engineer',
description: description:
'ETL and streaming pipelines in Python, Kafka and SAP BODS feeding a Teradata warehouse — and migrating the legacy stack onto AWS (Glue, Redshift, Lambda, Step Functions, Airflow).', 'ETL and streaming pipelines in Python, Kafka and SAP BODS feeding a Teradata warehouse, while migrating the legacy stack onto AWS (Glue, Redshift, Lambda, Step Functions, Airflow).',
live: true, live: true,
}, },
{ {
year: '2020 — 2023', year: '2020 – 2023',
company: 'Bosch Semiconductor', company: 'Bosch Semiconductor',
location: 'Dresden, DE', location: 'Dresden, DE',
title: 'Senior Data Engineer', title: 'Senior Data Engineer',
@@ -31,7 +31,7 @@ const ROLES = [
'Containerised ML inference (Docker, Kubernetes, Ansible) into 24/7 semiconductor production lines, and built Python, Java and C# data services over Oracle and Hadoop/Impala.', 'Containerised ML inference (Docker, Kubernetes, Ansible) into 24/7 semiconductor production lines, and built Python, Java and C# data services over Oracle and Hadoop/Impala.',
}, },
{ {
year: '2018 — 2020', year: '2018 – 2020',
company: 'Fraunhofer CML', company: 'Fraunhofer CML',
location: 'Hamburg, DE', location: 'Hamburg, DE',
title: 'Research Software Engineer', title: 'Research Software Engineer',
@@ -39,7 +39,7 @@ const ROLES = [
'Optimisation-based crew-scheduling decision support in C#/.NET, plus research microservices and a Jenkins CI/CD pipeline with quality gates.', 'Optimisation-based crew-scheduling decision support in C#/.NET, plus research microservices and a Jenkins CI/CD pipeline with quality gates.',
}, },
{ {
year: '2017 — 2018', year: '2017 – 2018',
company: 'Vizrt', company: 'Vizrt',
location: 'Bergen, NO', location: 'Bergen, NO',
title: 'DevOps Engineer', title: 'DevOps Engineer',
@@ -47,7 +47,7 @@ const ROLES = [
'A distributed video-transcoding backend in Python and C++, with automated audio/video integration testing for reliable releases.', 'A distributed video-transcoding backend in Python and C++, with automated audio/video integration testing for reliable releases.',
}, },
{ {
year: '2015 — 2017', year: '2015 – 2017',
company: 'Generali', company: 'Generali',
location: 'Hamburg, DE', location: 'Hamburg, DE',
title: 'Software Engineer & IT Consultant', title: 'Software Engineer & IT Consultant',
@@ -105,7 +105,7 @@ const IndexPage = () => (
I build the pipelines and platforms that move data and run models in production. I build the pipelines and platforms that move data and run models in production.
</p> </p>
<p className="hero__meta"> <p className="hero__meta">
<strong>Staff Data, Analytics &amp; AI Engineer at Swisscom</strong> — based in Bern, <strong>Staff Data, Analytics &amp; AI Engineer at Swisscom</strong>, based in Bern,
Switzerland, with 8+ years across data engineering, ML infrastructure and DevOps. Switzerland, with 8+ years across data engineering, ML infrastructure and DevOps.
</p> </p>
<nav className="actions"> <nav className="actions">
@@ -124,9 +124,9 @@ const IndexPage = () => (
<h2 className="section__label">Profile</h2> <h2 className="section__label">Profile</h2>
<div className="prose"> <div className="prose">
<p> <p>
I work where <strong>software engineering meets operations</strong> — designing ETL/ELT I work where <strong>software engineering meets operations</strong>. I design ETL/ELT and
and streaming pipelines, containerising ML inference, and turning monolithic data streaming pipelines, containerise ML inference, and turn monolithic data processes into
processes into event-driven, serverless systems. event-driven, serverless systems.
</p> </p>
<p> <p>
Right now I&apos;m at Swisscom in Bern, moving a legacy Teradata and Oracle stack onto Right now I&apos;m at Swisscom in Bern, moving a legacy Teradata and Oracle stack onto
@@ -176,7 +176,7 @@ const IndexPage = () => (
<h2 className="section__label">Contact</h2> <h2 className="section__label">Contact</h2>
<div> <div>
<p className="contact__intro"> <p className="contact__intro">
Open to interesting problems in data, ML and platform engineering — in Switzerland or Open to interesting problems in data, ML and platform engineering, in Switzerland or
remote. Email is the fastest way to reach me. remote. Email is the fastest way to reach me.
</p> </p>
<a className="contact__email" href={`mailto:${EMAIL}`}> <a className="contact__email" href={`mailto:${EMAIL}`}>