DuckTales, Woo-oo! Web design inspiration from ’90s cartoons

If you’ve looked at my portfolio recently, you might have noticed that I’ve developed a niche for working with film, TV, and video game composers. I love working with creatives because they’re engaged and always push me to do better work. They want designs that fit their personal brands and reflect their interests, which is challenging, but boy-oh-boy, it can be a lot of fun.

Today, I’ll take you through the process of designing a website recently for Emmy-award-winning game composer Mike Worth. Along the way, we’ll see how different formats (in this case, ’90s cartoons) can give us creative inspiration for building websites with more personality.

A friend introduced me to Mike Worth a few months ago, and we instantly clicked. Mike was looking for a website design to showcase his previous work and, most importantly, the type of work he wanted. And he had a particular design style in mind.

Mike loves ’90s cartoons—particularly Disney’s DuckTales and other animated series. He challenged me to find a way to incorporate their retro ’90s style into his design without making it a pastiche. One month later, the design and prototypes were done. 

Here’s a brief look at the final design I implemented in HTML and CSS. The home page invites visitors to join Mike’s adventure. The website also includes a page about the man, his work, FAQs, news and reviews, and a contact page.

Every page includes a scene from a self-contained story about Orango Jones, an orangutan adventurer I created for Mike and his website. Following Orango’s tale takes someone on a journey through Mike’s pages.

The question I get most is, “How do I go from a blank screen to a website design like Mike’s?” So, let’s rewind and talk about my process. I go through several stages, which, loosely speaking, are:

For now, I’ll concentrate on getting the right vibe, my creative concepts, and the graphics and illustrations.

My friend told me:

That sounded like something I’d enjoy. Then, in his first email, Mike told me:

Most of my clients have minimal visual identity beyond their logo, so I regularly help them find a design style that feels right for them and their brand. Mike couldn’t have been more different. He had a vision and had already spent time collecting examples and making mood boards to help him communicate it to me.

If Mike had been fixed on his ideas and unwilling to explore anything different, this might have been a problem. Luckily, he was open to ideas and very willing to collaborate.

Mike loves ’90s animation, and when we talked, he explained how he wanted to incorporate its style into his design without it becoming a pastiche. But what is that style?

Mike had already written his introduction, and it sums up this style perfectly:

Disney’s DuckTales is one of Mike’s favorites. Unsurprisingly, my taste in cartoons stretches back a little further to Hanna-Barbera shows from the 1960s like The Perils of Penelope Pitstop, Scooby-Doo, Top Cat, Wacky Races, and my favorite, Dastardly and Muttley in Their Flying Machines.

I wish they’d made more than 17 episodes of Dastardly and Muttley, but I’m also glad Warner Bros. didn’t spoil my memories with an unnecessary reboot.

Pretty much every reference to web design in the ’90s—when I designed my first website—talks about Warner Brothers’ Space Jam from 1996.

So, I’m not going to do that.

This was a time when designers took up David Siegel’s ideas on creating “killer websites” with their sliced-up graphics, which, I have to say, still have far more personality than most websites I see today.

Brands like Nintendo used their home pages to direct people to their content while making branded visual statements. Cheestrings combined graphics with navigation in ways that make me wonder why we don’t see designs like this today. Goosebumps typified this approach by combining cartoon illustrations and brightly colored shapes into a functional and visually rich banner, proving that being useful doesn’t mean being boring.

Media companies like Disney and Pixar included their most famous characters in their designs. And it was on websites designed to promote movies like Toy Story 2, where the combination of colors, shapes, and typography brought the design to life.

While on The Simpsons’ website, visitors to Springfield were frustratingly forced to find their own way around by pressing on links hidden in the illustrations, links on the Disney Channel were fun-looking and gradient-filled, creating a distinctive design language.

Layouts on Nickelodeon were more structured, using borders and boxes to create islands of content. Cartoon Network—now home to Hanna-Barbera’s cast of characters—was more complex still, with a grid layout made more interesting by angled boxes full of animated graphics and an eclectic mix of typefaces and styles.

There are plenty of ways I could recreate this ’90s aesthetic and apply it to a design for Mike.  For a while, I experimented with a Goosebumps-inspired navigation graphic:

But I constantly needed to remind myself that my brief wasn’t simply to create a ’90s-inspired design but to design a website that embodied the style and spirit of ’90s animations. I might use strong outlines, then add flat-color backgrounds and minimal shading to boxes:

I could create a palette with punchy colors for foreground elements and less-saturated colors for backgrounds, borders, and boxes:

Or I might use irregular shapes and then rotate and skew them to create movement in the design.

Then, I could create graphic backgrounds to add energy.

With so many possibilities, I needed to know whether my understanding of the ’90s aesthetic matched Mike’s. So, I made a series of sketches that contain what I call a design’s “atmosphere.” These sketches are collections of colors, shapes, textures, and typography, and they let Mike tell me whether they “felt” right for him and his brand.

I spend a significant amount of time designing color palettes. I needed several sets of colors for Mike’s design: a desaturated set for backgrounds and borders, colors that unify the character illustrations across every page, and, of course, those 90s-inspired accent colors.

Shades and tints are invaluable for helping designs feel cohesive and their elements connected. Tints are lightened with white, while shades darken a color by mixing it with black. There are plenty of tools online for creating shades and tints, but Michael Edelstone’s Tint & Shade Generator has lasted the longest in my bookmarks.

I also created highlight colors that change throughout the day, which I adapted from the ’90s cartoon image Mike provided.

Mike was keen to capture the ’90s vibe and had already picked out a typeface, SF Fedora, which was derived from the Indiana Jones logo design. SF Fedora is a fun-looking typeface, but although I knew it would make a cameo appearance somewhere in my design, it didn’t feel like the correct choice for a wider typographic design.

So Mike and I explored Comicraft’s collection of comic book typefaces, and we settled on Danger Girl for its characterful letterforms. Even Comicraft’s description—“Ancient Evil! Nazi Spies! High Adventure!”—suited our theme.

We chose Danger Girl for Mike’s branding, headlines, and other typographic design details because of its personality, but we needed another typeface for the body copy. Usually, when I choose a typeface as opinionated as Danger Girl, I try to balance it with a neutral typeface.

But the intentionally unopinionated Aktiv Grotesk and more characterful Bankside Sans and Venn weren’t good partners. Bisbee, Caraque, and Tondo made our shortlist, but none of these otherwise excellent typefaces felt right for Mike’s design.

So, we returned to Comicraft and explored several of their fonts before settling on CC Wildwords for its personality, legibility, and readability.

When evaluating a typeface, it’s important to study its letterform designs closely, so I create type sheets with letters of several sizes, from very large to extremely small.

No matter how small they might be, every typographic element in a design is an opportunity to develop a visual identity. That’s why studying a typeface’s numerals and other special characters is essential, and CC Wildwords contains an ampersand, @-symbol, and question mark, which all ooze personality.

Without color, graphics, or layout, type sheets can still convey the character of a design, so I combine typographic elements and ask my clients if they feel right for them and their brand.

This combination of headlines set in Danger Girl and body copy set in CC Wildwords gave Mike’s design the personality he was hoping for.

After letting the inspiration sink in and deciding on the colors and typography that give Mike’s design its ’90s vibe, I wireframed his content hierarchy, page layout, and site structure. For me, wireframing is less about making perfect, polished layouts and more about sketching someone’s journey through a website. I think of it like storyboarding scenes in a cartoon—getting composition, flow, and interactions right before I work on design details.

Depending on the project, I sketch wireframes by hand or build them digitally. If I’m working on something playful, like Mike Worth’s site, I’ll often sketch on paper first.

Quick, loose drawings let me explore ideas quickly and figure out where content should go without getting distracted by aesthetics. Wireframing isn’t about making things look pretty—it’s about ensuring the experience feels right.

Designing buttons, graphics, and icons for Mike Worth’s website wasn’t just about making them functional—it was about capturing the bold, high-energy spirit of ’90s animation.

To add to the fun and connect Mike’s navigation to his story, I turned Mike’s drop-down menu into a large stone tablet, using strong outlines, flat colors, and minimal shading.

I gave his portfolio images a glossy sheen to make his logomark and added thick outlines to create consistency.

I also made animated scrolls that unroll to show Mike’s news stories and add a fun interaction to someone’s experience.

Back in the ’90s, buttons weren’t just rounded rectangles with text; they had personality. Shadows, outlines, and chunky shapes made them feel tactile, so I took inspiration from those ’90s design elements and made buttons and social media icons that looked carved from stone.

Most importantly, every button, graphic, and icon had to feel fun. When clicked or hovered, they react with playful animations to reinforce the energy that typifies ’90s animation and Mike’s music.

In the ’90s, the web was an experimental playground. Designs were frequently loud, and they could be weird and often whimsical, but above all, they were full of life. Buttons begged to be clicked, animated graphics flashed to attract someone’s attention, and websites had a personality. Sure, designs were sometimes chaotic, often over-the-top, but they were delightful.

Somewhere along the way, we lost that joy. Websites are now polished and professional but also uniform and safe. Flat design stripped away the playful touches and quirks, leaving us with a web full of commodity designs where creativity has taken a back seat to convention.

Accessibility has improved somewhat, and websites are now responsive and more user-focused. But have those improvements come at the expense of fun?

Bringing back that whimsy doesn’t mean abandoning sound design principles or forgetting all the lessons we’ve learned over the past decades. It does mean bringing back personality with designs that forge connections with people and make them smile.

These days, with millions of websites vying for people’s attention, simply being good-looking, functional, and easy to use isn’t enough. Products and websites must stand out to achieve what their owners want: to succeed.

Working on Mike Worth’s website design was a journey back to the playful, high-energy aesthetics of ’90s animation. By blending bold outlines, punchy colors, and dynamic typography with modern design principles, I’ve crafted a distinctive, fun experience that reflects Mike’s personality.

Beyond nostalgia, this project was about recapturing the spirit of creativity that I feel used to define the web—where design was as expressive as the people behind it.

In a landscape often dominated by safe designs and uniformity, I hope Mike Worth’s website can demonstrate that personality still matters. After all, the best designs don’t just function—they tell a story and leave a lasting impression.

Often referred to as one of the pioneers of web design, Andy Clarke has been instrumental in pushing the boundaries of web design and is known for his creative and visually stunning designs. His work has inspired countless designers to explore the full potential of product and website design.

Andy has written several industry-leading books, including Transcending CSS, Hardboiled Web Design, and Art Direction for the Web. He’s also worked with businesses of all sizes and industries to achieve their goals through design.

Visit Andy’s studio, Stuff & Nonsense, and check out his Contract Killer, the popular web design contract template trusted by thousands of web designers and developers.

Up for a bit more ’90s cartoon goodness? Check out our article on the mechanics of comics, learn how to draw in a creepy ’90s cartoon style, or bring yourself up to date (?) with ’90s graphic design trends. Check out Andy’s other articles on taking web design inspiration from music magazines, movie posters, and fanzines.