{"id":75023,"date":"2025-05-02T03:29:41","date_gmt":"2025-05-01T17:29:41","guid":{"rendered":"https:\/\/elements.blog-cms.envato.net\/?p=62184"},"modified":"2025-11-24T12:40:05","modified_gmt":"2025-11-24T01:40:05","slug":"90s-cartoons","status":"publish","type":"post","link":"https:\/\/elements.envato.com\/learn\/90s-cartoons","title":{"rendered":"DuckTales, Woo-oo! Web design inspiration from ’90s cartoons"},"content":{"rendered":"\n

If you\u2019ve looked at my portfolio recently, you might have noticed that I\u2019ve developed a niche for working with film, TV, and video game composers. I love working with creatives because they\u2019re 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.<\/p>\n\n\n\n

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.<\/p>\n\n\n\n

The brief: A modern website with ’90s cartoon inspiration<\/h2>\n\n\n\n

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.<\/p>\n\n\n\n

Mike loves ’90s cartoons\u2014particularly Disney\u2019s DuckTales and other animated series. He challenged me to find a way to incorporate their retro \u201990s style into his design without making it a pastiche. One month later, the design and prototypes were done. <\/p>\n\n\n\n

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

\"Design<\/figure>\n\n\n\n

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\u2019s tale takes someone on a journey through Mike\u2019s pages.<\/p>\n\n\n\n

The question I get most is, \u201cHow do I go from a blank screen to a website design like Mike\u2019s?\u201d So, let\u2019s rewind and talk about my process. I go through several stages, which, loosely speaking, are:<\/p>\n\n\n\n

    \n
  1. Getting the right vibe with color, graphical style, and typography<\/li>\n\n\n\n
  2. Designing creative concepts<\/li>\n\n\n\n
  3. Sketching someone\u2019s journey or wireframing<\/li>\n\n\n\n
  4. Working with content, editing, organizing, and writing it<\/li>\n\n\n\n
  5. Creating graphics and illustrations<\/li>\n\n\n\n
  6. Prototyping using HTML and CSS (and, once in a while, with Figma)<\/li>\n<\/ol>\n\n\n\n

    For now, I\u2019ll concentrate on getting the right vibe, my creative concepts, and the graphics and illustrations.<\/p>\n\n\n\n

    My friend told me:<\/p>\n\n\n\n

    \n

    “Mike\u2019s looking for a super cool website full of personality.\u201d <\/p>\n<\/blockquote>\n\n\n\n

    That sounded like something I\u2019d enjoy. Then, in his first email, Mike told me:<\/p>\n\n\n\n

    \n

    \u201cCan\u2019t wait to show you my reference images and style influences.\u201d <\/p>\n<\/blockquote>\n\n\n\n

    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\u2019t 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.<\/p>\n\n\n\n

    \"Mike<\/figure>\n\n\n\n

    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.<\/p>\n\n\n\n

    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?<\/p>\n\n\n\n

    \"90s<\/figure>\n\n\n\n