Design Engineering at Vercel: Bridging the gap between pixels and production
The Design Engineer role sits at the intersection of aesthetics and engineering. At Vercel, this team blends visual sensibility with technical skill to understand a problem, then design, build, and ship a complete solution. The team is intentionally multidisciplinary, with members coming from varied backgrounds, which lets them push the boundaries of what's possible on the web through constant experimentation with new tools and mediums.
What drives the work
Beyond the polished visuals, Design Engineers at Vercel focus on the full spectrum of user experience. Their priorities include:
- Delightful interactions and clear affordances
- Building reusable components and primitives
- Page speed and performance
- Cross-browser support
- Support for touch, pointer, and other input modes
- Respecting user preferences
- Accessibility for users of assistive technology
These concerns extend beyond visual appeal, ensuring that every layer of the experience is handled with care.
How the team works
Design Engineers at Vercel operate across branding, marketing, product development, and the internal design system. Their workflows fall into three main modes of collaboration.
Partnering with designers
The team works directly with designers, replacing the traditional handoff with an iterative loop. Instead of receiving a finished design, a Designer brings a rough start and collaborates with a Design Engineer in Figma or code to reach the final product. This partnership begins at ideation and runs through production.
Throughout this process, Design Engineers consult on implementation cost versus experiential impact, whether a component should be a one-off or built for reuse, and provide guidance grounded in web practices. They also prototype explorations that are more effective in code than in Figma—animations, keyboard controls, and touch interactions often make more sense when tested directly in the browser.
Communication flows through Slack messages, screenshots, videos, preview links, and Zoom calls.
Embedded in product teams
For larger features that span over a month, Design Engineers embed with a product team. When a Designer accompanies them, the Design Engineer takes on UI implementation while the product team handles API and infrastructure. Without a Designer, the Design Engineer produces the initial sketch and gathers feedback from both Designers and Engineers—never working in isolation.
Owning features independently
For targeted fixes tied to user pain points, Design Engineers take ownership from start to finish over days or weeks. They sketch in Figma or code, socialize the change, incorporate feedback, and ship. Being part of the Design team gives them autonomy to tackle items that would otherwise languish in an engineering backlog.
This space allows the team to invest in excellence: polished interactions, zero dropped frames, consistent behavior across browsers, and accessibility. Examples of these design-led efforts include:
- Vercel's Geist font, complete with an interactive playground to explore every glyph
- The company's design system documentation, an interactive playground used across engineering teams
- The Design Team homepage, which doubles as a testbed for new web techniques
- Delightful micro-interactions within the Vercel Dashboard
The team prioritizes quality over quantity, accepting that shipped work is rarely perfect. Following Vercel's principle of Iterate to Greatness, they balance business goals with craft through continuous improvement, avoiding the trap of perfectionism.
The collective toolkit
No single Design Engineer is expected to master everything. The team's strength lies in the diversity of its members' origins and accumulated taste. Together, they can execute ambitious designs because collectively they can:
- Design in Figma and directly in code
- Write production-grade code
- Debug browser performance issues
- Write GLSL shaders
- Craft copy
- Build 3D experiences with Three.js
- Create 3D models and scenes in Blender
- Edit videos using CGI and practical camera effects
Members collaborate on everything, leveraging unique backgrounds and skills. While everyone can execute independently, the best work emerges from collaboration. The team is not process- or tool-driven—outcomes matter more than the path taken to reach them.
Evidence across Vercel
The team's output is visible throughout the company's properties:
- Building and maintaining components for the internal design system, used on Vercel.com, the Vercel Toolbar, and Next.js documentation
- Creating sites like the Next.js Conf website and Vercel's product pages
- Contributing product work and documentation for both Vercel and Next.js
- Developing proof of concepts for branding and marketing
- Improving accessibility across all Vercel web properties
Design Engineering at Vercel shifts the focus from owning a specific stage of product development to owning results. The company is actively hiring for the role, open to candidates who have never held the Design Engineer title—as there's no single correct background or skill set for this kind of work.
