Breaking Down Technology

Editorial Design / Illustration

Brief

As a self initiated project, I worked on the visual identity and UX & UI for a new platform to help non-geeks understand, buy and use all the tech.

Concept

Today's world is full of tech that makes it a wonderful yet scary place to live in. Help for those too embarrassed to say they’re lost is hard to find. Tech sites look like Greek (if geeks were Greeks) and robots have replaced humans.

In this world, I wanted a site that appeals to the silent majority to step out of the shadows and embrace the tech world with confidence.

Solution

This material needed to be accessible in a whimsical and humorous approach to draw people in. My solution, the TechVoodoo platfrom, leverages Web3 trends and a quirky character to achieve this.

Scroll Through
Screen

A Touch of Humour

As a result to my research, I found that humour is key to engaging people (there’s not a lot of that in the tech sites I found). TechVoodoo is about seeing tech as magic, and situating it in the popular view of Voodoo.

It’s not intuitive, but the Grim Reaper is often portrayed as a focal point for humour.

I used Dall-E to generate some ideas, and crafted a cartoon strip to introduce the concept.

Gaming-Inspired & Wireframe

Gaming-Inspired & Wireframe

Gens Y and Z are often big gamers. I took inspiration from that culture to select my typeface and colour palette.

In the spirit of the tech neophyte (dictionary sites are not as impenetrable as tech ones!) I wireframed my solution using one of the oldest technologies known to man - pen and paper.

Gens Y and Z are often big gamers. I took inspiration from that culture to select my typeface and colour palette.

In the spirit of the tech neophyte (dictionary sites are not as impenetrable as tech ones!) I wireframed my solution using one of the oldest technologies known to man - pen and paper.

Logo Creation

Logo Creation

The Grim reaper is the pivot of my solution, so I again used AI (Dall-E) to design a goofy character that I could integrate into the site and its logo.

I put Reaper elements into the text of the logo (turning the T of TechVoodo into the Grim Reaper’s scythe) and turned the character himself into that eternal photobomber, encrusting himself into the logo by treating two of the O’s as glasses.

Website Prototype

Website Prototype

I used Figma to protoype my solution. My work follows the latest Web3 trends in modern web design.

I kept the site as simple as possible, with easy navigation. There are only two generic page types - lists and articles.

I envisaged using animation (such as glowing links when you hover over them), which is increasingly employed in immersive UX design.

I used Figma to protoype my solution. My work follows the latest Web3 trends in modern web design.

I kept the site as simple as possible, with easy navigation. There are only two generic page types - lists and articles.

I envisaged using animation (such as glowing links when you hover over them), which is increasingly employed in immersive UX design.

Final Design

I was only going to use a gradient background when I started, however the grid I used for alignment gave me a surprising 3D effect that I liked, so I decided to keep it as an element in my solution.

The final design emphasises simplicity and transparency of navigation.

I was only going to use a gradient background when I started, however the grid I used for alignment gave me a surprising 3D effect that I liked, so I decided to keep it as an element in my solution.

The final design emphasises simplicity and transparency of navigation.

The final design shows how I played with typeface and layout to ensure maximum readability.

I wanted the audience to feel at ease and, of course, it’s up to the Voodoo experts to continue that line with funny and easy to understand articles.

Discover My Other Projects: