[{"title":"DIY Automatic Headlights","summary":"Turns out old dogs can learn new tricks too","date":"July 17, 2025","image":"/posts/automatic-headlights/circuit.jpg","categories":["projects","3d-printing","automotive"],"slug":"automatic-headlights","readTime":"4 min read","content":"Introduction Letting sleeping dogs lie on a 20-year-old car sounds like the ideal choice, but a base-trim antique as senior as mine lacks many creature comforts that have become commonplace in the 2020s—most annoyingly, automatic headlights. Sure, I could've just swapped in a higher-trim switch module and have had my onboard computer reprogrammed, but I would miss the change to dig into the inner workings of a taken-for-granted piece of equipment. Understanding the Original Circuit The first step in the process was understanding the wires I needed to tap into to keep myself safe while including a backup switch. Because wiring diagrams were not readily available, I used a multimeter to understand which pinouts were closed during different lighting states. Choosing Components Once I had a rough understanding of the wiring, I proceeded to the next step: devising a suitable strategy to integrate a microcontroller using onboard power. I chose an ESP32, as per usual, due to its conveniences: widespread availability, cheap to buy and replace, and (although not applicable to this project) wireless connectivity. In my inexperience, I bought a pack of two car starter relays, not knowing that the ESP32 was unable to deliver the required voltage. Thankfully, I stumbled across an old electronics kit that had a 5-volt dual-relay board, one for the headlamps and one for the parking lamps. Included in my order were TEMT6000 ambient light sensors, which provide more consistent and accurate readings than typical photoresistors. Debounce and Margin Logic Ready to begin programming, I plugged in the semi-soldered circuit together. I began with a simple conditional loop: if the sensor reads above a certain threshold, turn both relays off, and vice versa. Taking my contraption for a drive, I realized that the range of the TEMT6000 was offset too high to capture the threshold where I wanted the lights to switch on. I quickly fixed this by 3D printing a small enclosure to hold the light sensor and covered the top with Sharpie-covered tape. With the threshold correctly identified, I needed to implement margin and debounce conditionals to allow variance around the threshold and prevent rapid flickering, respectively. The debounce was set to five seconds, coincidentally meaning that the lights would turn on for five seconds on startup. The limited range of the light sensor required a fairly large margin, considering the output was being read with a resolution of eight bits (0-255): The next step was to get stable power. Ideally, resistors would have provided power to the circuit; unfortunately, both the power draw and the voltage from the car's battery fluctuated, so I bought a pack of LM2596 buck converters. The ESP32 chip itself runs on 3.3V, although 5V can be provided as input through its built-in voltage regulator. In the interest of avoiding stress on the regulator, I used two buck converters to step the car's 12+ volts down to both 5V and 3.3V. Letting the circuit run for two hours in the heat and adding a backup switch was assurance enough that it would be within an acceptable margin of safety. Additionally, the wiring needed some level of protection, coming in the form of a rather shoddy 3D printed case and plenty of hot glue to dampen the vibrations (especially for the relays). Then came the most difficult part of the project: splicing together the old and the new. Making sure to fully disconnect the car's battery, I tensely troubleshooted the Frankenstein-esque circuit. After the power, relays, microcontroller, and manual switch were all wired together, I connected the battery cables to the terminals and started the old girl up, lights sparking to life. The biggest thing some may have taken away from a project like this would be that it was wholly unnecesarry—just use the switch. I, on the contrary, took away something much more important: a sharpened skillset and a new perspective."},{"title":"Making a Personal Website","summary":"An interactive personal portfolio website with an integrated blog system","date":"March 3, 2025","image":"/posts/personal-website/hero.jpg","categories":["projects","web","programming"],"slug":"personal-website","readTime":"5 min read","content":"Creating a personal website had been on my to-do list for far too long. I needed an interactive space to showcase my work, interests, and skills—something that visitors would genuinely enjoy exploring rather than just skimming through. Planning & Goals Before diving into code, I established clear objectives: Create an immediately striking landing page that hooks viewers Implement a highly responsive design optimized for both mobile and desktop Develop a custom blog system with search, filtering, and sorting capabilities Ensure fast loading times leveraging Svelte's pre-rendering features For the landing page, I drew inspiration from mesh gradients—a growing trend in modern web design. My approach uses a vibrant color palette that becomes more subdued as content density increases, creating visual hierarchy while maintaining engagement. Technology Stack I selected technologies that would deliver both performance and developer experience: **SvelteKit**: High-performance, component-based framework with excellent SSR **Tailwind CSS**: Utility-first styling without context switching **MDsveX**: Markdown processing with Svelte component integration **Embla Carousel**: Smooth, accessible image carousels **Font Awesome**: Consistent iconography SvelteKit was the obvious choice given its file-based routing, excellent SSR capabilities, and rapid development cycle. More importantly, it's the framework I'm most proficient with, allowing me to focus on features rather than fighting the tooling. Key Implementation Details Animated Gradient Background The animated mesh gradient on the landing page creates a subtle lava lamp effect using coordinated CSS and JavaScript: This creates a captivating background with subtle movement that adds depth without being distracting. Responsive Navigation System The navigation adapts seamlessly between mobile and desktop experiences. On mobile, it transforms into a full-screen overlay with smooth animations: Desktop users see a traditional horizontal navigation with hover effects, while the transition between configurations happens automatically based on viewport size. Blog System Architecture MDsveX enables a powerful combination of Markdown simplicity with Svelte component flexibility. Each post lives as a separate Markdown file in with structured frontmatter: A server endpoint processes these files, extracting metadata and content to power the blog listing, individual post pages, and search functionality. Content Management Features The blog includes comprehensive content management: **Search**: Full-text search across titles and content with term highlighting **Filtering**: Category-based filtering with shareable URLs **Sorting**: Multiple sort options (date, alphabetical, relevance) All filtering states persist in URL parameters, making specific views bookmarkable and shareable. Performance Optimizations Performance was prioritized throughout development: Lazy-loaded images with intersection observer Page prerendering on link hover RequestAnimationFrame for smooth animations Efficient bundle splitting via SvelteKit These optimizations, combined with Svelte's compile-time optimizations, deliver excellent performance across the board. Notable Challenges Safari Theme Color Management Implementing smooth transitions in Safari required additional logic in scroll event handlers to maintain visual continuity across different page sections. SEO Implementation I created a reusable metadata component to ensure consistent SEO across all pages: This component handles both static and dynamic metadata generation throughout the site. Deployment Strategy I chose Vercel for hosting due to its seamless GitHub integration and excellent SvelteKit support. Every git push triggers an automatic deployment to my custom domain lars.patkowa.com, ensuring the live site stays current with development. Reflection & Future Plans This project reinforced my web development skills while revealing areas for growth. I now have a polished platform for showcasing projects and sharing insights. The development process was particularly rewarding—seeing months of planning and iteration culminate in a functional, beautiful website. **Planned enhancements:** Light/dark mode toggle with system preference detection Interactive comment system for blog posts Analytics integration for visitor insights Automatic table of contents generation for longer posts Building a personal website proved to be more than just a portfolio project—it became a comprehensive exercise in modern web development, user experience design, and content management."},{"title":"3D Printed Car Seat Recliner","summary":"Custom-designed 3D printed seat recliner handle for a 3rd Generation Ford Explorer","date":"March 2, 2025","image":"/posts/car-seat-recliner/seat_recliner.jpg","categories":["projects","3d-printing","automotive"],"slug":"car-seat-recliner","readTime":"2 min read","content":"When I got my 2005 Ford Explorer, I quickly discovered it was missing the driver's side seat recliner handle. For nearly a year, I endured the embarrassment of using pliers every time I needed to adjust my seat. During a flash of productivity, I decided to put my 3D modeling skills to work and create a replacement myself—saving both my dignity and the $3 a new handle would cost. The Challenge My first instinct was to take the proper engineering approach: meticulously model each gear tooth to create an exact replica of the original handle. However, I quickly learned that translating the complex geometry of those tiny gear teeth from physical measurements into CAD software was far more challenging than anticipated. The precision required for proper gear tooth profiles, pitch calculations, and clearances would have turned this simple fix into a semester-long engineering project. The Pragmatic Approach Instead of getting bogged down in gear theory, I chose a more practical route. Using Fusion 360, I modeled the handle's external shape while taking a deliberately simple approach to the gear interface. Rather than modeling individual teeth, I sized the inner diameter to slip over the existing gear with some clearance, planning to use hot glue to fill the gaps and create the necessary grip. This \"brute force\" method offered unexpected advantages: the hot glue would provide additional structural strength and create a custom fit that perfectly matched the worn gear's unique characteristics. The Build and Installation I printed the handle on my Ender 3 V2, though Murphy's Law struck immediately—my usual gray filament had run out, leaving me with only bright pink PLA. Aesthetics aside, the print quality was excellent. The installation process was refreshingly hands-on: I heated up my hot glue gun, filled the handle's bore with adhesive, and used a rubber mallet to firmly seat it onto the gear mechanism. After allowing the glue to cure, I finally retired the pliers that had been living in my door pocket for months. The finished product works flawlessly, and I've made the model available on Thingiverse for anyone facing a similar predicament. Lessons Learned This project illustrates the value of practical problem-solving over perfection. While my solution won't win any engineering awards, it successfully transformed a daily annoyance into a source of satisfaction. More importantly, it instilled a key principle: the best solutions are often the simplest."}]