Nicholas Pavkovic

I’m Nicholas Pavkovic, a designer and developer.

In my three decades of experience as a design technologist, I have consistently worked to combine traditional design principles with cutting-edge technologies.

My career has spanned digital print publication design, UX/UI design, and front-end web development projects.

My journey has included crafting print and digital experiences for leading brands like Ziff-Davis, UCLA, Oracle, Numi, and LendingTree, where I’ve stood at the intersection of design and technology.

Screenshot of svgs-to-icons demo interface showing interactive color options and generated CSS classes for icon styling — SVGs to Icons
A command-line tool that converts SVG files into easy-to-use CSS icon classes.
Sometimes the best tools are born from solving your own problems. I needed a simple way to convert a folder of SVG files into CSS classes that could be styled with color and size properties. The result is a Node.js CLI that optimizes SVGs, generates clean CSS with mask-based rendering, and creates interactive demo pages for testing. Published on NPM and used by developers worldwide, it bridges the gap between design assets and developer-friendly code. View on GitHub
Node.js | CLI | NPM Package

Photo of four members of the Agentic Council: a product manager, a designer, a developer, and a business analyst. — The Agentic Council
An AI council of advisors for a startup, built with Langgraph.

Image showing summary of the foundational library contents, with each book tagged. — The Foundational Library
Vectorized texts for the agents to reference.
The Council draws from a foundational library of more than a hundred processed business, design, and engineering books, enabling knowledge-grounded recommendations. Each agent’s perspective is shaped not just by their persona, but by principles extracted from seminal texts like “Good Strategy Bad Strategy,“ “The Design of Everyday Things,” and “The Pragmatic Programmer.” As a solo founder, this system amplifies my decision-making by simulating the diverse expertise of a full product team.
Python | Langgraph | Gradio

Screenshot of the result of a Council deliberation about a new “focus” feature for the goal management app GoalMinder. — Should we add a “focus” feature?
A POC deliberation of the Agentic Council.
One of the purposes of the Council is to provide a multi-perspective analysis of feature requests, in part because devs often spin their wheels when adding non-essential features. Here the project is GoalMinder, an app that manages goals and notes. During deliberations, the Council has access to a variety of documents, including the current project status, the proposed feature list, the current roadmap, the vision statement, and more. Kenji, the systems engineer, has a condensed summary of the state of the codebase. Priya frames the discussion, which is then taken up by the other agents in turn.
Python | Langgraph | Gradio

LendingTree

As a staff engineer on the Spring team, I promote excellence in front-end code and graphic standards for LendingTree’s flagship financial app. As a liaison between the creative, engineering, and product teams, my cross-functional insights help shape product strategy.

I’ve been a primary source of engineering expertise during the development of the LendingTree design system, and have implemented or architected many of its components for the Spring team. I’ve also developed internal design tools to help bridge the gap between creative and engineering.

My full-stack work has included the end-to-end development of enterprise apps at LendingTree, and my Eleventy-based landing page system hosts marketing pages that get millions of monthly views.

Financial dashboard showing project metrics with a bar chart comparing expected versus actual performance over multiple time periods. The chart includes color-coded bars and a detailed data grid below. — Boulder Manager
An app for LendingTree executives, offering a deep-dive into major initiatives and their metrics.
Working with operations and finance, I built this app to give upper management a comprehensive overview of major corporate initiatives, including timelines, milestones, OKRs, and staffing. The Financial Drivers section was a rotating carousel of bar charts that compared expected and actual outcomes. Robust filtering allowed users to pinpoint issues in specific initiatives. I was the sole engineer for this project; the UI was developed in collaboration with LendingTree Creative.
Vue | Vuetify | Firebase

A Gantt project timeline displaying multiple initiatives as horizontal bars on a timeline grid. Each bar is color-coded to indicate status, with dates spanning multiple quarters. — Boulder Manager
An app for LendingTree executives, offering a deep-dive into major initiatives and their metrics.
Working with operations and finance, I built this app to give upper management a comprehensive overview of major corporate initiatives, including timelines, milestones, OKRs, and staffing. The Financial Drivers section was a rotating carousel of bar charts that compared expected and actual outcomes. Robust filtering allowed users to pinpoint issues in specific initiatives. I was the sole engineer for this project; the UI was developed in collaboration with LendingTree Creative.
Vue | Vuetify | Firebase

Dashboard view with circular progress indicators for goals in a minimal, clear design. — Priorities Manager
An OKR management app that fosters strategic alignment and transparency at LendingTree.
LendingTree needed a centralized system to track company and departmental Objectives and Key Results (OKRs). I was responsible for all aspects of this project, including user research, UX and UI design, front- and back-end development, stakeholder management and testing/support. Above, you’ll see a high-visibility OKR dashboard displayed on monitors throughout headquarters ensures that strategic priorities remained top-of-mind for all employees. There’s also detailed OKR breakdown for a specific initiative. Integrated status updates with date tracking and percentage completion allowed for real-time progress monitoring.
Vue | Vuetify | Firebase

Detailed OKRs view showing completion percentages with subtle progress indicators. — Priorities Manager
An OKR management app that fosters strategic alignment and transparency at LendingTree.
LendingTree needed a centralized system to track company and departmental Objectives and Key Results (OKRs). I was responsible for all aspects of this project, including user research, UX and UI design, front- and back-end development, stakeholder management and testing/support. Above, you’ll see a high-visibility OKR dashboard displayed on monitors throughout headquarters ensures that strategic priorities remained top-of-mind for all employees. There’s also detailed OKR breakdown for a specific initiative. Integrated status updates with date tracking and percentage completion allowed for real-time progress monitoring.
Vue | Vuetify | Firebase

Visualization of career progression with circular nodes and a clear, responsive layout. — Career Paths
A breakthrough way for LendingTree employees to visualize and plan their careers.
I collaborated with HR and LendingTree Creative to develop the Career Paths app, designed to empower employees to explore and plan their professional development. The app visually maps out roles, responsibilities, required skills, and potential career trajectories. It’s been used across the company by employees and managers before and during performance reviews. Above you can see both the user view and the authenticated editor view.
Vue | Vuetify | Firebase

Admin view with editing controls for career paths in a structured, clear design. — Career Paths
A breakthrough way for LendingTree employees to visualize and plan their careers.
I collaborated with HR and LendingTree Creative to develop the Career Paths app, designed to empower employees to explore and plan their professional development. The app visually maps out roles, responsibilities, required skills, and potential career trajectories. It’s been used across the company by employees and managers before and during performance reviews. Above you can see both the user view and the authenticated editor view.
Vue | Vuetify | Firebase

Admin interface listing landing pages with metadata in a clean, organized layout. — Landing Page System
An optimized system for generating marketing landing pages and viewing their metadata.
The static site generator Eleventy is at the heart of the landing page system I developed for LendingTree Marketing. It uses a variety of NPM packages to reorganize the architecture of the page during the build and improve compression. Other features include the server-side rendering of dynamic interest rates, and the ability to quickly implement headline A/B testing through a JSON configuration file or dynamically with query parameters. From 2018-2021, I designed and built scores of lean landing pages with this system, improving page quality, loading times, and the marketing team’s velocity.
Eleventy | Html | Css | Javascript

Landing page for auto lease loans featuring a hero image, app screenshot, and clear call-to-action. — Landing Page System
An optimized system for generating marketing landing pages and viewing their metadata.
The static site generator Eleventy is at the heart of the landing page system I developed for LendingTree Marketing. It uses a variety of NPM packages to reorganize the architecture of the page during the build and improve compression. Other features include the server-side rendering of dynamic interest rates, and the ability to quickly implement headline A/B testing through a JSON configuration file or dynamically with query parameters. From 2018-2021, I designed and built scores of lean landing pages with this system, improving page quality, loading times, and the marketing team’s velocity.
Eleventy | Html | Css | Javascript

Responsive layout tool with a two-column design and clear viewport guides. — Design Tools | 1
Visualization tools to help break the shackles of static breakpoints.

Typography demo showing dynamic font sizes and responsive headline scaling. — Design Tools | 1
Visualization tools to help break the shackles of static breakpoints.

Design Tools | 2

A custom icon browser and a POC for a design token manager.

UX | UI | Web Development

Since the early days of the web, I’ve taken on various roles in the online space, tackling information architecture, UX design, front- and back-end development. Focusing on work executed before the introduction of frameworks and apps, this section showcases everything from conceptual sketches to complex WordPress projects.

Two-panel Numi Tea site with a product grid and promotional photography; elegant and refined design. — Numi Tea
A Wordpress instance for the brand site of this nationally-known tea company.

Two-panel layout for an airline rewards site with organized offers and SkyMiles info in a dense but orderly design. — Megamiles
A UI for an upscale airline miles website.

Digital asset review interface showing an iPad advertisement with an active commenting session. The interface features a clean, professional design with navigation tabs. — Meeting Room
A digital asset management system for advertising.

Terrace Software

Identity development, design, and web engineering for a noted SF technology integrator.

Case study landing page with a hero banner and detailed project background in a two-column layout. — Terrace Case Studies
Infrastructure work for the (local) skincare giant Rodan+Fields.

Process page with skincare photography and a three-step infographic in coral-colored boxes. — Terrace Case Studies
Infrastructure work for the (local) skincare giant Rodan+Fields.

Investment platform interface displaying startup profiles and a feed of investor activities in a blue-white design. — Seedchange
Identity development and prototyping for an angel investing startup.
Seedchange was an online platform that simplified early-stage investing by connecting investors with vetted startups and presenting investment information in a clear, concise format. Their goal was to democratize access to angel investing and make it more efficient for both investors and startups. In addition to working on their identity and information architecture, I developed a clickable prototype of the site’s interface, written in Rails.
Rails | HTML | CSS | Javascript

Homepage with a vintage, letterpress look featuring a hand-drawn illustration on a paper background. — Deviled Tongue
Assembled in a weekend, this website’s look borrowed from wood type and broadsheets.

Print Design

My interest in visual design began when I was very young, as a hobby photographer with a keen eye for composition. Later, as a designer, I became fascinated with the power of typography, which I’ve since enjoyed using to craft emotive, reader-centered designs.

My work in print has spanned a diverse range of media, each with unique challenges and objectives — textbooks, lifestyle and technical magazines, corporate materials, book covers, posters.

Collaboration is a cornerstone of my process. I find inspiration in working with writers, editors, photographers, and illustrators to fulfill the vision of the text.

Oracle

As a visual designer at Oracle, I contributed to the print designs of the flagship Oracle magazine as well as Profit magazine (a business/lifestyle publication) and the hybrid online/print magazine, Java.

Minimalist opening magazine spread with a mosaic of portraits representing the public cloud. — Opener Sketches
Initial ideation for the stories that comprised the Public/Private Cloud feature.

Minimalist opening magazine spread with a large keyhole showing a cloud through it, representing the private cloud. — Opener Sketches
Initial ideation for the stories that comprised the Public/Private Cloud feature.

Barriers to the cloud are represented by an ethereal hand attempting to grasp a cloud that’s shielded by a cube. Around the cube, small infographics illustrate obstacles to the adoption of cloud architecture. — Datawatch
In Oracle’s *Profit* magazine, the Datawatch column put business infographics in artistic and occasionally playful contexts.

Steps to innovation shows seven concepts for spurring innovation using an old-fashioned dance step diagram. — Datawatch
In Oracle’s *Profit* magazine, the Datawatch column put business infographics in artistic and occasionally playful contexts.

A collage of elements related to the IoT, including smart money, a connected garbage truck, and a connected POS system. — Embedded Everywhere
This issue of *Java* highlighted applications of embedded Java in everything from smart money to garbage trucks.

Java magazine cover with a green tree emerging from code, symbolizing organic growth in a minimalist design. — Java Diplomacy
*Java* magazine builds bridges to the Java community.

Cover with a speech bubble formed by tiny figures; a minimal design representing community voice. — Java Diplomacy
*Java* magazine builds bridges to the Java community.

Ziff-Davis Verlag

Arriving in Munich in 1994 for a short redesign assignment at Ziff-Davis Verlag, I stayed on through 1997, serving as Art Director and, later, Creative Director. Publications included PC Professionell (analogous to PC Magazine in the U.S.) and the launch of pl@net, an internet culture magazine. My staff included junior art directors, a layout department and a photo studio.

Pl@net magazine cover with a stark B&W handgun image and neon green headline; bold, dramatic design. — Hand over your money!
*pl@net* was Germany’s first internet culture magazine.

Typographic spread from pl@net with censored CompuServe groups overlaid on a light background; statement design. — Table of Contents
*pl@net* enumerates censored user groups.

Zombies are one of the visual metaphors for the internet’s future in the illustration for the opening spread of this article. — Visions of the Internet’s Future
A feuilleton explores the myths and realities shaping the internet’s evolution and speculates regarding its future.

Pl@net spread with a burgundy gothic title and zeppelin illustration; weathered, historical design. — The Disruption of Censorship
Early coverage of censorship from within and outside of the internet — and the vehement response from “netizens.”

Pl@net spread on pale green with two text panels in a constructivist style; minimal, geometric design. — Anxiety and Paranoia
Opener for a series of articles on conspiracy theories, cryptography, and PGP (pretty good privacy).

Newspaper-style cover with a bold TRUE LIES! headline; striking and minimal design. — Redirection & Redesign
In 1997, *pl@net* became *Internet Pro*, with considerable changes to form and content.
*True Lies*’ hyperbolic exploration of the web’s potential for misinformation embodies *pl@net*. After the transformation to *Internet Pro*, the content and design of the publication changed, targeting the growing number of professional web developers and designers that emerged in the late 90s. In the inaugural issue of *Internet Pro*, *Killer Websites* focused on website building using interactive enhancements enabled by early-web technologies.
QuarkXPress | Adobe Photoshop

Grid of six illustrated websites, reflecting a clean layout for practical web development. — Redirection & Redesign
In 1997, *pl@net* became *Internet Pro*, with considerable changes to form and content.
*True Lies*’ hyperbolic exploration of the web’s potential for misinformation embodies *pl@net*. After the transformation to *Internet Pro*, the content and design of the publication changed, targeting the growing number of professional web developers and designers that emerged in the late 90s. In the inaugural issue of *Internet Pro*, *Killer Websites* focused on website building using interactive enhancements enabled by early-web technologies.
QuarkXPress | Adobe Photoshop

A collaged overview of current internet news and trends. — The Scene
*pl@net* lived on as a cultural section after the 1997 rebrand.

Technical spread from Internet Pro 2001 with text, diagrams, and code in highly legible, dense design. — Internet Pro 2001
The 2001 redesign — the third iteration — was all business.

Technical illustration of e-commerce software with annotations; a structured, compact design. — Internet Pro 2001
The 2001 redesign — the third iteration — was all business.

Pulp Magazine

Founded in 1988 with photographer/illustrator Francisco Caceres, Pulp came into being during the final flowering of print magazines and zines, just before the digital era reshaped the media landscape. The DIY publication gave me space to spread my wings as a publication designer and writer and was a valuable outlet for creatives of all types in Chicago.

A dramatic B&W portrait of three figures in a triangular layout with bold lighting; an artistic design. — Design Logic
*Pulp* interviewed influential artists, designers and architects, and musicians from the Chicago area.

Two-page spread with a bomb/missile image and artistic text layout; a contemplative design. — Consider
A set of very short stories that mused on contemporary politics, the Bomb, and AIDS.

Magazine layout featuring a B&W portrait by Robert Drea with a clean, documentary style. — Self, portraits
A collection of portraits and text by Robert Drea, noted documentarian and fine art photographer.

Stacked advertising rate cards for Pulp Manifesto on wood; bold, DIY sans-serif design. — Media Kit

Cubist Absolut Vodka ad with fragmented bottle shapes. — Absolut Cubism
A breakthrough advertising opportunity from Absolut.
*Pulp*’s advertising was largely local. But Michel Roux from Absolut Vodka gave us our first win on the national front: he was a strong supporter of indie publications, and allowed us to develop our own artwork. My partner Francisco Caceres brought an Absolut bottle into the darkroom and created a photogram for one of the ads; I created the artwork above using an early version of Photoshop.
Adobe Photoshop

Covers & Miscellania

Design storytelling begins with a careful consideration of the content and the broad functional context — aesthetic goals, business objectives, user expectations. Here are some examples from various media, including book covers, posters, and personal projects.

Initial cover: vintage map split diagonally with a colorful old Paris and B&W modern grid; elegant design. — Speaking for Marcel
A book cover for a collection of poems and photographs inspired by Proust.

Final cover: flowing script and soft halftone background; dreamy, nostalgic design. — Speaking for Marcel
A book cover for a collection of poems and photographs inspired by Proust.

Book cover with a silhouetted figure in light blue on deep green; minimalist and expressive design. — Curmudgeon
...in which the protagonist shares a litany of complaints about modern air travel.

Book covers with a stencil-like title on warm yellow; handmade, artistic texture. — Eight Figments
Speculative cover for a book to be published by Deviled Tongue.

Concert poster with an ornate botanical frame in Art Nouveau style and elegant red script. — My Spirit Sang All Day

Poster for a performance of Sredni Vashtar, a chamber opera based on the celebrated short story by Saki. — Sredni Vashtar
A poster for a performance of *Sredni Vashtar*, a chamber opera based on the celebrated short story by Saki.

Hot Air Music Festival

Logo development for a local music festival.

Four slides on Dutilleux: minimalist title, musical analysis, Mondrian grid, and a vintage engraving; clean design. — Métaboles
A presentation on Henri Dutilleux’s orchestral masterwork.

Slide with a 1930s portrait of Ernst Toch and a vintage playbill; historical, contextual design. — Der Fächer
Ernst Toch’s 1930 opera skewered the follies of contemporary politics and technology.

Theatrical slide with red velvet curtains and vintage interior photos; evokes modernity and politics. — Der Fächer
Ernst Toch’s 1930 opera skewered the follies of contemporary politics and technology.

Creative Coding

Sometimes technology itself is the inspiration for creative visual ideas.

Tellus | 1

Animated logos for a literary journal.

I'm a perpetual student, and Tellus is the annual literary journal of one of the schools I attend, Cuesta College in San Luis Obispo, California. The journal's logo gets redesigned annually via a competition, and the challenge appealed to me. While ultimately destined for print, my designs were developed in code and animated. This was a great opportunity to pursue delight for its own sake — pushing web technologies in a more artistic direction. Swipe left for more.

Tellus | 2

Inspired in some part by Daniel Lagin’s stunning book covers for works by physicist/philosopher Carlo Rovelli.

Tellus | 3

This was just a happy accident. Inadvertent constructivist homage to Duchamp, Feininger, Jack Stauffacher, etc.

Pulp Modern

Designed in 1988, this font served as the logotype for Pulp magazine.

Orbits

A personal project. I’ve always been fascinated with transparency and layering in design.

Semicircular data visualization of midyear sales with curved bars and clear measurements; geometric design. — Infographic: 1987
The introduction of Postscript was a game-changer for the creation of complex graphics.

Résumé

My résumé covers a selection of my design and engineering work. Download it here.

You can reach me at nicholas at pavkovic dot com, or find me on LinkedIn.

SVGs to Icons

A command-line tool that converts SVG files into easy-to-use CSS icon classes.

The Agentic Council

An AI council of advisors for a startup, built with Langgraph.

The Foundational Library

Vectorized texts for the agents to reference.

Should we add a “focus” feature?

A POC deliberation of the Agentic Council.

LendingTree

Boulder Manager

An app for LendingTree executives, offering a deep-dive into major initiatives and their metrics.

Priorities Manager

An OKR management app that fosters strategic alignment and transparency at LendingTree.

Career Paths

A breakthrough way for LendingTree employees to visualize and plan their careers.

Landing Page System

An optimized system for generating marketing landing pages and viewing their metadata.

Design Tools | 1

Visualization tools to help break the shackles of static breakpoints.

Design Tools | 2

A custom icon browser and a POC for a design token manager.

UX | UI | Web Development

Numi Tea

A Wordpress instance for the brand site of this nationally-known tea company.

Megamiles

A UI for an upscale airline miles website.

Meeting Room

A digital asset management system for advertising.

Terrace Software

Identity development, design, and web engineering for a noted SF technology integrator.

Terrace Case Studies

Infrastructure work for the (local) skincare giant Rodan+Fields.

Seedchange

Identity development and prototyping for an angel investing startup.

Deviled Tongue

Assembled in a weekend, this website’s look borrowed from wood type and broadsheets.

Print Design

Oracle

Public Cloud. Private Cloud.

Oracle embraces the Cloud.

Opener Sketches

Initial ideation for the stories that comprised the Public/Private Cloud feature.

Datawatch

In Oracle’s Profit magazine, the Datawatch column put business infographics in artistic and occasionally playful contexts.

Embedded Everywhere

This issue of Java highlighted applications of embedded Java in everything from smart money to garbage trucks.

Java Diplomacy

Java magazine builds bridges to the Java community.

Ziff-Davis Verlag

Hand over your money!

pl@net was Germany’s first internet culture magazine.

Table of Contents

pl@net enumerates censored user groups.

Visions of the Internet’s Future

A feuilleton explores the myths and realities shaping the internet’s evolution and speculates regarding its future.

The Disruption of Censorship

Early coverage of censorship from within and outside of the internet — and the vehement response from “netizens.”

Anxiety and Paranoia

Opener for a series of articles on conspiracy theories, cryptography, and PGP (pretty good privacy).

Redirection & Redesign

In 1997, pl@net became Internet Pro, with considerable changes to form and content.

The Scene

pl@net lived on as a cultural section after the 1997 rebrand.

Internet Pro 2001

The 2001 redesign — the third iteration — was all business.

Pulp Magazine

Liberty

Fashion spreads in Pulp were often humorous escapades.

Design Logic

Pulp interviewed influential artists, designers and architects, and musicians from the Chicago area.

Consider

A set of very short stories that mused on contemporary politics, the Bomb, and AIDS.

Self, portraits

A collection of portraits and text by Robert Drea, noted documentarian and fine art photographer.

Media Kit

Absolut Cubism

A breakthrough advertising opportunity from Absolut.

Covers & Miscellania

Speaking for Marcel

A book cover for a collection of poems and photographs inspired by Proust.