For years, I treated design as a secondary concern. Something to “get right later”. Functionality came first, visual refinement came if there was time. But recently, while redesigning my own site, I realized how much design principles have evolved. Modern web design in 2025 isn’t about gradients, glass effects, or cramming color everywhere. It’s about restraint, structure, and systems thinking.
This redesign became less about “making it pretty” and more about clarity—building a UI that communicates professionalism and calm confidence.
1. Starting with Purpose
The first thing I asked myself was what the site needed to say before thinking about what it needed to show. I wanted something that reflected how I work: thoughtful, technical, and dependable. That meant simplifying the layout, cutting unnecessary visual noise, and focusing on hierarchy. The page needed to read like a well-engineered system—balanced, predictable, and resilient.
2. Designing from the Tokens Up
Instead of chasing random color palettes, I built a set of design tokens. Colors, spacing, motion, and typography were all defined in one place, using OKLCH values for consistency across light and dark modes. The new palette draws inspiration from Minnesota - evergreen, copper, and lake teal. It feels organic and grounded but still modern.
This approach made it easier to keep everything coherent. When spacing or radius values change, the entire site adjusts automatically. It’s a subtle but powerful shift: treating design like infrastructure.
3. A New Philosophy on Color and Contrast
The old design leaned hard on bright accent colors and gradients—exactly the kind of visual noise that ages quickly. In the new version, color is used sparingly. Accent colors only appear when they serve a function: links, focus states, or interactive elements. Everything else relies on thoughtful contrast and whitespace.
Modern design rewards restraint. The more intentional you are with color, the more impact it carries.
4. Rethinking Layout and Scale
Spacing was one of the biggest differences between “then” and “now.” Older designs tended to cram sections together or overcompensate with large gaps. I switched to fluid spacing using clamp() so margins and padding scale smoothly with viewport size. It’s a simple change that keeps the layout proportional across devices.
I also revisited how rounded corners and shadows were used. Most modern interfaces rely on subtlety: smaller radius values, softer shadows, and lighter surfaces. It creates depth without distraction.
5. Making Typography the Hero
Good typography is half the design. I moved to a modern pairing of Space Grotesk for headlines and Inter for body text. Both are variable fonts with great optical balance and legibility. Combined with increased line height and consistent rhythm, the result feels lighter and easier to read, especially in dark mode.
6. Designing for Systems, Not Pages
Each part of the site, the hero, timeline, summary cards—was rebuilt with reusable components and consistent spacing logic. I focused on composability: every section should look like it belongs, but also stand confidently on its own. This systemized approach makes future updates easier and keeps visual drift from creeping in.
7. Lessons Learned
The biggest takeaway is that design and engineering aren’t separate disciplines anymore. A modern developer’s toolkit should include an understanding of visual hierarchy, rhythm, and accessibility. The best interfaces feel effortless not because they lack detail, but because every detail is intentional.
In the end, this redesign wasn’t just a facelift—it was an audit of how I think about building things.
The code is cleaner, the visuals are calmer, and the experience reflects the kind of engineering I care about: scalable, sustainable, and human.