Twitter profile image of Rauno Freiberg

Rauno Freiberg@raunofreiberg

Design engineer at Vercel. Creating software that makes people feel something. Trying to paint with code. Relentlessly devoted to fine, detailed polish.

What do you do?

Trying to create software with tiny details that feel exciting to build, experience, and remix. Ever discovered a website that you can’t stop playing with and obsessing over? You can just sense the thoughtfulness and quality.

Working on the intersection of design and engineering. These two don’t feel separate to me. Talking less, building more. Working in high fidelity and close to the final medium as early as possible. Moving quickly, without compromising on exceptional quality. Exploring alone, shipping with a team.

A designer whose medium is code. Polishing interfaces with a strong interest and taste for creative branding and striking wordplay. Specializing in interaction design and crafting details.

What led you into design and code?

Unsupervised access to computers and a strong visual sense. Grew up in the era of cracking Photoshop and taking part of signature battles on old-school forums. In 2016, started playing around with Adobe XD for fun as I enjoyed the visual aspect of building software.

Eventually found myself adjusting random code on CodePen and that felt really immediate and engaging. Had no idea what I was doing but it was fun. I probably spent around 15 hours a day writing code. Found it easier to get hired by learning software engineering. At that point, I kinda lost the urge or confidence to design something myself.

Wound up working very closely with designers over the coming years and always gravitated more towards front end. Tried to bring to life all the details and magic that would otherwise sometimes get written off by engineers for their innate complexity or big time investment.

Over time I leaned deeper into design and built up the confidence to design something on my own. I do remix a lot of prior work from myself and others though.

What’s your design process?

This is a question I see a lot of fuss around and to me it seems like everyone has a rigorous ritual to facilitate productivity and manifest quality. I’m not sure I’m the best person to talk about this considering my main Figma design file is literally called “asdf” but I’ll give it a shot.

My approach depends on the thing I’m building. Sometimes I’ll come back from a walk and have a concrete visual for an experiment I want to build. I jump straight to code and shape the aesthetics of it as I go along. A lot of it is spaghetti code though. I’ve embraced this as a natural part of the design process and treat certain code inherently as throwaway.

Like to spend less time in Figma as I feel like a lot of the details come to life through actual implementation and consideration of nuances that I just don’t encounter working with static vectors. However, for larger projects or those involving collaboration with others I might spend more time with design tools beforehand to make sure we would learn something from higher fidelity.

I work pretty fast so even prototypes that are more intricate might take me only a few days to dial it very close to the feeling of production. At this stage, I don’t consider making it production ready in terms of code quality or testing. The only thing I’m concerned with here is making it feel like the real thing. Frankly, this is my happy place in making software.

A key part is sharing my exploration as soon as possible in the form of tiny videos and demos. Besides gauging interest, this also keeps me going and gives me validation.

What pieces of work are you most proud of?

I have recently put up all of my experiments and other interesting designs that I’ve built over these past years.

Next.js poster

Some of Rauno's work, see more at rauno.me/craft

Where do you go to get inspired?

Away from the screen, doing something completely unrelated. Running, walking, cycling, shopping for groceries, travelling. Coming back after an outing gets me excited to sit behind my desk and try to make something. Sometimes I’ll have a few ideas in progress so I’d often procrastinate and juggle between them as inspiration comes and goes. Talking to my fellow designer nerds gets the gears turning as well.

What do you like more, design or code?

The first couple of years of building I found code to be intrinsically interesting. Spent a lot of time learning full stack engineering and cutting edge tech for the sake of it.

It’s only over the past year that I’ve actually spent more time as a designer. It has changed how I think about code. It feels less interesting to me just as-is. A means to an end. I look to leverage new tools only if they enable me to build something novel that I couldn’t before.

I’m less anal about perfect code. I still care about quality but there’s always a trade-off between things you are doing and could be doing. Lately I feel like I’d rather spend more time breaking new ground instead of making sure all of my CSS is written consistently and that every surface of UI leverages the design system. Love throwing a random 6px border radius on things to make it feel right.

How did you enjoy travelling and working at the same time?

By staying in places for a long time. I’ve never enjoyed the general backpacker culture where one would stay in locations for a week or so. In that case I feel pressured to explore and don’t really get any time to live in said location. I visited Brazil for 3 months which made me eventually feel that the environment is actually my home and I don’t have to feel bad for working hard some days. I would have enough time to explore and build at the same time.

Picture of Rauno's place in Brazil
Picture of Rauno's place in Brazil
Picture of Rauno's place in Brazil

Rauno's creative space in Brazil

Can you tell us a bit more about what you do as a design engineer at Vercel?

The Design Engineering team is part of Design and currently it consists of me, Emil, and Joe. I can talk about how I’ve internalised the function of this team for myself.

  1. We provide the Design team with Engineering firepower to lead and ship our own projects end-to-end on the initiative of Design. Recent examples would be the Vercel Design Team website and exploring dashboard navigation improvements.
  2. We support teams by dipping in and out of projects that have high-impact design polish to be implemented, such as complex interactions, animations, details, and UI elements. Recent examples would be the marketing websites for Next.js Conf and Preview Comments, and a new filtering combobox for monitoring logs.

I feel very fortunate to be able to fluidly move across the two disciplines which usually tend to be strictly distinct. Recently I’ve observed a mentality shift for a lot of companies with regards to this though which is great.

How does your setup look like?

16” MacBook Pro, Studio Display, Sony XM4, AirPods 2, iPhone 14 Pro, Sony A7 III.

Rauno's workplace

Do you have any advice for ambitious designers or engineers?

Build, build, build.

Key Takeaways

  • A lot of the details come to life through actual implementation and consideration of nuances.

  • I'm sharing my exploration as soon as possible in the form of tiny videos and demos. Besides gauging interest, this also keeps me going and gives me validation.