Jeff Zych

I found this antique pitcher

The antique pitcher I found

I found this antique pitcher outside an apartment building today. It was amongst some discarded books and knick-knacks, most of which was junk, but then there was this pitcher. I normally would have just left it, but this pitcher held my attention.

I felt myself coming up with all the reasons I should just leave it: “I don’t need it.” “It’s old.” “It’s discarded junk.” But then I stopped myself and decided to take it home.

Why did I do this? Two threads came together to inspire me: the first was Justina Blakeney’s book, Jungalow. In this interior design book, she talks about finding old stuff at markets, swamp meets, antique fairs, etc., and giving them new life. Re-using them, remixing them, incorporating them into home decor, and so on.

The second was a note I keep on my desk, which I saw in The Creative Act by Rick Rubin (the best book Ive read on creativity in a long time): “Base decisions on the internal feeling of being moved. Notice what holds your interest.”

This pitcher was holding my interest! I didn’t really know why, but that’s not the point. The point is I should base decisions off of this feeling, without the need to rationalize it. I both noticed this was holding my interest, and also noticed that my old thought patterns were telling me all the reasons to discard that thought. So I did the opposite and followed what held my interest.

These two threads came together to change change my behavior. The pitcher is now more than a pitcher – it’s a symbol of my ongoing journey to reach my creative potential.

Taking the next step in my career: building a company of one

I recently decided to leave LaunchDarkly and take the next step in my career: starting a company of one. I’m going to be a freelance product designer, focusing on design of technical and developer tools. This is a niche that requires specific skills and experience, both of which I have: I have a CS degree, was formerly an engineer, a generalist product design background, and I’ve worked on technical tools for over 10 years now. And there are a lot of developer tools out there with terrible UX, and founders who value good design, so I want to work with those people.

In addition to that, I’m also doing fractional design leadership as well. This could take the form of creating the hiring process for product designers (especially technical product designers, like myself and the ones I hired at LaunchDarkly). It could mean helping companies adopt a user-centered design process. It could also start as IC work, and I transition into helping my clients hire a designer and onboard them and hand off my work to them and integrate them into the company’s product development process.

I’m also very passionate about designing interfaces that have a unique personality and stand out from the crowd. I take a lot of inspiration from branding projects, which have really interesting visual assets and evoke emotional responses in people. I’d like to find projects where I can bring a branding perspective to product design by defining a unique visual language, tone of voice, and core components and patterns (like a design system, but more strategic).

I also have some interest in doing actual branding. More specifically, logos for technical products. I’ve done logo design for friends and side projects a few times and find it really fun. Doing logo design for developer and technical tools would be really rewarding. And because I have a CS degree and a product background, I could bring that unique advantage over general brand designers to this market.

Why a company of one?

So why a company of one? Why not just a freelancer or contractor or something? Freelancing is the starting point, but I want to build up multiple revenue streams and sell more than just my time, like courses or design resources or something. I’m not sure what that is just yet, but I will be paying attention to the work I’m doing as a freelancer to see what could be spun out as a sellable resource.

I also want to approach this venture as a business that I put intention and effort behind finding consistent revenue streams, rather than looking at freelancing as a holdover until the next thing (such as going back in-house or something).

Additionally, the biggest motivating factors is to mold my career around my life, rather than the other way around. As Paul Jarvis says in Company of One:

“If you’re a company of one, your mind-set is to build your business around your life, not the other way around.” (p. 9)

I want my life to be my first priority, and to be in control of how I use my time, rather than feeling like the company I work for has first dibs on my time.

Jarvis also says, “A company of one is simply a business that questions growth.” (p. 6) After working at startups my whole career, where growth is the goal and anything that doesn’t scale is seen as not worth doing, I want to be out of that environment. I want to focus on quality and building relationships over growth and scaling and profit. I don’t want to compromise my values or do things that feel unnatural that you’re required to do when employed by someone else.

Could this expand into some sort of studio or agency in the future where I do take on a few employees, or have partners I work with? I wouldn’t rule it out. But I’d only do that if I feel like I’ve really nailed the services I’m offering, and the market I’m serving, and expanding would help me deliver better services to my clients. But for now I need to focus on making this successful for just me.

If you want to read more about companies of one, then I highly recommend the book I quoted above, Company of One by Paul Jarvis. Another great resource is the Zebra’s Unite Coop, which bills itself as “A founder-led, cooperatively owned movement creating the culture, capital & community for the next economy.” They fund companies that value quality and service over growth and profit.

So that’s where I’m at. I’m very excited about how this will evolve, and already have some clients in the mix. And if you know of any technical tools that need design help, then HMU jlzych@gmail.com

2022 Reading List

I read 25 books in 2022, which is actually 1 more than in 2021. I definitely thought I read fewer then last year since we welcomed our daughter to the world this year (welcome Poppy!), but it turns out I maintained my reading pace.

Of note: I read 33% fewer fiction books this year (only 2 this year, down from 3 hah). Most of the books I read continue to be art and design related. Only 8 were by women, and 1 by a person of color. I did a much worse job at reading perspectives of under-represented peoples compared to prior years. This is also a reflection that most art and design books are written by white people.

Some faves

  • Understanding Comics by Scott McCloud: This has been on my reading list for years, and is recommended in basically every list of “X books every designer should read,” and I’m glad I finally did. It’s full of great principles of storytelling and visual communication.
  • How Buildings Learn: What happens after they’re built by Stewart Brand: Yet another book that’s been on my list for years, and is also on every recommended reading list for designers. But I see why – it’s a super interesting read about buildings and how they learn and adapt to use (or don’t). It lowered by respect for architects since it describes them as “stylists” and people who care more about awards and getting in magazines over listening to what the building inhabitants want (this is a broad brush, and I’m summarizing what was said in the book, but I know not every architect is like this). Especially surprising to me was to learn that post-occupancy evaluations (POEs), which is when architects talk to their building’s inhabitants to learn how well it works for them in day-to-day use, is rare. This is unthinkable to me as a designer since my bread and butter is talking to the users of the products I design to understand if they work for them or not, and using that to improve the product.
  • Creative Doing: 75 practical exercises to unblock your creative potential in your work, hobby, or next career by Herbert Lui: I love books about creativity, the creative process, and exercises to become more creative. This book has all 3. Now if only I had more time to do the creative exercises…
  • Barbarian Days: A Surfing Life by William Finnegan: This is part memoir, as told through stories of surfing. I didn’t expect to enjoy this as much as I did. It starts slow, but then finds its groove as the author takes us through his surfing adventures he’s had all over the world. Learning about what makes for the perfect wave, the conditions to look for, the type of coastline, and so on, was surprisingly interesting. And he weaves into that the spiritual side of surfing, why he does it, and what drives him to keep doing it as he ages.
  • The Passage of Power (part 4 of The Years of Lyndon Johnson) by Robert Caro: And of course, Robert Caro’s last published volume of the LBJ biography makes this list. Yet another fascinating read about the man himself, presidential power, and how our government actually runs. This volume features the assassination of JFK and Lyndon’s ascension to the presidency, during which time a lot was happening behind the scenes that I had never heard about before (since most historical records focus on the assassination itself): multiple scandals closing in on LBJ, his incredibly smooth assumption of power and continuation of JFKs agenda despite being almost completely excluded from his predecessors administration, and the very short amount of time he had to break the logjams in Congress and show the American people he was a president who could get things done (and therefore get re-elected the following year). Really good read, and now I’m eagerly awaiting the 5th (and supposedly final) volume to be released, except Caro is in his 90s so… 😬

Full reading list

As always, you can view the full list and follow along with my current list in Notion.

  • Color Scheme: An Irreverent History of Art and Pop Culture in Color Palettes by Edith Young
  • The Overstory by Richard Powers
  • A Roomful of Hovings by John McPhee
  • White Fragility by Robin DeAngelo 👍
  • The ABC of Lettering by Ivan Castro 🖌
  • Understanding Comics by Scott McCloud 👍
  • Cribsheet: a data-driven guide to better, more relaxed parenting, from birth to preschool by Emily Oster 👨‍👩‍👧
  • Accelerate: Building and scaling high performing technology organizations by Nicole Forsgren, Jez Humble, and Gene Kim
  • Design: Type. A seductive collection of alluring type designs by Paul Burgess 👍
  • 1000 Record Covers by Michael Ochs
  • New Retro: Graphics and logos in retro styles, Designed and published by Victionary 🎨
  • Not All Diamonds and Rosé by Dave Quinn
  • About Face: The essentials of interaction design (4th edition) by Alan Cooper, Robert Reimann, David Cronin, Christopher Noessel 👍
  • Severance by Ling Ma
  • Creative Doing: 75 practical exercises to unblock your creative potential in your work, hobby, or next career by Herbert Lui 💯
  • Drunk: how we sipped, danced, and stumbled our way to civilization by Edward Slingerland 🍻
  • Graphic Design: The New Basics by Ellen Lupton & Jennifer Cole Phillips 🎨
  • Palette Perfect 2 by Lauren Wager 🎨
  • The Visual Display of Quantitative Information by Edward Tufte 📈
  • Barbarian Days: A Surfing Life by William Finnegan
  • The Pyramid Principle: Logic in Writing and Thinking by Barbara Minto 👍
  • The World According to Color by James Fox 🌈
  • Envisioning Information by Edward Tufte
  • How Buildings Learn: What happens after they’re built by Stewart Brand 👍
  • The Passage of Power (part 4 of The Years of Lyndon Johnson) by Robert Caro 👍

Experimenting with layering, filtering, and masking in CSS

I’ve recently been doing some experiments with layering, filtering, and masking in CSS. The language has come a long way in the past few years, with properties like filter, mask-image, mix-blend-mode, additional gradient types like radial-gradient, and more, opening the door for Photoshop-like effects that weren’t possible before.

I did these in CSS, as opposed to Figma or Photoshop (where they are usually trivial), partly to see if I could, and partly because CSS provides a lot of advantages over graphics programs: they can scale and be responsive to browser/device sizes, dark and light modes can be controlled via CSS variables (which I didn’t do but it’s possible), they can respond to mouse movement (which I also didn’t experiment with but it’s possible), and they can have scroll effects like perspective scrolling (which I did experiment with).

I followed some tutorials and tweets (which I’ll link to), and pushed some of those in new directions.

Adding noise via SVG filters

I was inspired by this Tweet by Fons Mans, where he suggests adding noise to gradients to give them an extra level of polish and pop. This got me wondering how I could do this on the web, and I remembered seeing a tutorial on CSS-Tricks ages ago about how to add noise to backgrounds programmatically via SVG filters. Actually it turned out it was two articles: Grainy gradients by @jimmmy, and Creating patterns with SVG filters by @finnhvman.

I decided to add some noise to a couple of gradients on my site — the background of the main layout, and the header of the writing page. It’s subtle, but interesting.

Before and after images of my site's background gradient

Before and after images of my writing page's header gradient

It was a fun project to figure out how to do it in code. The tl;dr is I generated a noise filter with SVG, and applied it to an :after element and set mix-blend-mode to overlay.

Blobby background gradients with noise

Fons’ tweet also shows how to layer, blur, and blend elements together to make interesting background gradients in Figma, which I also did in CSS:

See the Pen Background gradient blobs with noise by Jeff (@jlzych) on CodePen.

I also created these stage lights in CSS from a picture I saw in the NY Times:

See the Pen Stage lights by Jeff (@jlzych) on CodePen.

One last one inspired by the design on one of my wife’s purses:

See the Pen Blobby gradient background by Jeff (@jlzych) on CodePen.

Halftone patterns

I saw this cool tutorial on creating halftone patterns in CSS alone, so I followed that tutorial first to create this:

See the Pen CSS Halftone pattern by Jeff (@jlzych) on CodePen.

Then I extended that idea to do scan lines:

See the Pen CSS Scan Lines pattern by Jeff (@jlzych) on CodePen.

Then I extended that idea to do circles radiating out of Frank Zappa’s eye (which was inspired by a photo in the record Absolutely Free:

See the Pen Radiating circles overlay by Jeff (@jlzych) on CodePen.

Zoomed in picture of radial gradient on Zappa's eye in Absolutely Free

All of those inspired me to do a motion blur type pattern by blurring SVG noise in one direction, and layering that on top of some stripes. It didn’t quite come out how I had envisioned (I wanted to get it to look more like putting some paint on a canvas and scraping it down), but it’s kinda cool in its own way:

See the Pen Motion blur experiment by Jeff (@jlzych) on CodePen.

Trippy pop art

All of those led me to create some trippy pop art that uses layering and blending to get different colors, and perspective for different scroll speeds so each layer moves across each other at different rates. Scroll within each of these Codepen embeds to see what I mean.

See the Pen Trippy pop art stuff by Jeff (@jlzych) on CodePen.

See the Pen Trippy pop art with fade by Jeff (@jlzych) on CodePen.

See the Pen Trippy pop art waves by Jeff (@jlzych) on CodePen.

This one’s my favorite 😄

Card with fancy border

The last thing I did was create this card with a fancy gradient border, inspired by a design I saw somewhere else (I can’t remember exactly where), which uses some layering and blending techniques from above but isn’t nearly as experimental or “out there” as some of the previous stuff.

See the Pen Card with fancy border by Jeff (@jlzych) on CodePen.

Fin

That’s all I’ve got for now. They’re fun to make, and I feel like I could make a lot more of these since each one inspires new ideas. Plus I’m a lot more attuned to seeing gradients and layers in the world now – lights, shadows, clothing, purses, etc. – which makes me want to figure out how to recreate them in CSS.

Bon appétit!

Ingredients for a great product design case study

While I was the Head of Product Design at LaunchDarkly, I hired 12 people in a year and a half. In that time I looked at a lot of case studies from product designers (on the order of 100s, I’m sure) and saw examples of great ones and terrible ones and everything in between. I’d like to share more case studies of my work, so I wrote down what makes for great case studies and bad case studies to guide me when I start writing them.

The best case studies I’ve read…

  • Are short and scannable, but had enough depth to answer questions I had while scanning, and enough detail to show me your skills.
  • Have plenty of pictures, from screenshots of the final work to process shots during the project (sketches and wireframes, the team at a whiteboard, etc.).
  • Provide enough context for me to understand the product, business context, users & customers, problem, goals, constraints, etc. (but kept just to the bare minimum so I can understand the work).
  • Also include context about your role, and what you did.
  • Are well-written and easy to follow. Writing the project like a story usually makes it more engaging (as opposed to just point-by-point saying the steps you went through. “First we did research. Then we…”).
  • Get me invested in the problem you’re solving and make me want to know how you solved it. This will hook me into reading the case study and pull me through to the end.
  • Have a clear impact that’s contextualized so I know if it’s actually impactful or just metrics theater.
  • Impress me with your craft and attention to detail.
  • Showcase projects with enough depth to highlight everything above, without being so sprawling and broad that they just skim the surface of what you can do. Some of the most interesting work I’ve seen in case studies (and in portfolio reviews) were smaller projects that went deeper into the decision making process and craft (but were still impactful).
    • That’s the advantage of smaller projects — they can go deeper on a narrower problem. Case studies of big projects can go too broad and lack the depth that really shows the level of care and detail a great designer will put into a project (of any size).
  • Ultimately, a great case study shows me how you work and your strengths, leaving me wanting to work with you.

The worst case studies…

  • Are confusing, long-winded, and hard to scan.
  • Don’t show me the work, or just have 1 or 2 screenshots with no explanation of what I’m looking at. (This can be especially bad in product design work where the thing you did might be a small piece of the screen it lives in, and/or more conceptual work like system design and information architecture.)
  • Converse of the above, some only have pictures, with no context explaining what they are, what the feature/product does, who the users are, etc.
  • Lack context. Who was this for? What does the product do? What problem were you solving? Why was it worth solving? Etc.
  • Don’t show me your process, how you got to the end result, or how you make decisions along the way. They just show the final product.
  • Don’t emphasize your strengths. If you say you do everything, I’m left thinking you’re not great at anything (no one can master every UX skill).
  • Leave me wondering what you did versus the rest of the team (especially if you worked with any additional designers)
  • Don’t tell me the impact. So you designed and shipped a thing. Did it matter? What was the impact to customers and the business?
  • Go way too deep on theory and idealized product design/discovery processes rather than telling me what you actually did.
  • Formulaic. They followed a template and just rotely filled in the details (sometimes incorrectly). These are an instant turn off and boring to read and you can smell them a mile away.
    • This is most common with case studies of designers coming out of bootcamps, and I don’t want to come down too hard on people trying to break into the field of product design. Templates are useful in these situations, and for entry-level roles I won’t give negative marks to anyone who follows a template. But once you have a few years of experience under your belt, it’s time for your case studies to grow up.

So where does that leave us? My ideal case study includes these ingredients (doesn’t need to be in this order):

  • Context: Help me understand what I’m looking at. Specifically, what’s the problem? Who is it a problem for? What are users trying to accomplish? What are their pain points? Is this an evolution of an existing feature or wholly new? What are the business goals and stakes? Why was this project important? Constraints? Scope? What’s the team team you worked with, and your role specifically?
  • Solution: Show me the designs! How did you solve the stated problem? Ideal case studies have a screenshot with a “wow!” factor that draws me in, but that favors visual design (or designers who work with good design systems), so this will depend on the nature of the project.
  • Process: How did you get to that solution? What alternatives were considered? Convince me that your solution was the right or best one given the context above. Also make sure to highlight:
    • Attention to detail: What details did you obsess over? What made it special/unique/yours? Give me an indication of your craft skills.
    • Strengths: Show off your strengths and how you applied them to this project.
  • Impact: What was the impact? Did it solve the problem? How did you measure that? Business impact? Customer impact? The best case studies have both business impact and customer impact, with both quantitative and qualitative measures (but not all projects have these, so at least one measure is better than nothing).

Great case studies include the ingredients above while minding these constraints:

  • Short as possible (for busy recruiters and hiring managers), while providing enough detail to answer questions they might have while scrolling through the work, and showcasing strengths, craft, and attention-to-detail.
  • Visual. Show at least one screenshot of the finished thing up top. Choose an image that looks appealing and makes me want to learn more. Include pictures throughout the case study to break up the text. Include in progress work, process shots, diagrams, the team together, etc.
  • Scannable. I should be able to scroll through it and have a good sense of your work without reading (pull quotes, captions, and bolding help here).

These ingredients resonated with me as a hiring manager and are what I’ll be aiming for with my own case studies. I hope they help you, too.