No items found.
No items found.
Wall of Love

CF #24: Learn design through redesigns

Key points


  • Inductive learning (starting with an example, and concluding with theory) is, in my opinion a more engaging and effective way of learning visual design. Subscribe to the redesign newsletter to learn visual design through real examples
  • Deliberate sizing & spacing of your elements creates rhythm. Pick a base unit (like 8) and make all sizing and spacing in your layout a multiple of that base unit
  • Become more creative by leveraging divergent thinking (coming up with as many different solutions/ideas as possible) followed by convergent thinking (consider limitations, combine ideas, and test ideas to narrow options)

A better way of mastering visual design (through real examples), the importance of using a spatial system, divergent and convergent thinking for creativity

Creatorfuel helps you master high-value skills of the digital era. Learn more.

weekly creatorfuel
Actionable tips & tools for creative minds.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
“I'm floored by how much content you deliver in these emails. Again, thank you!” -Lindsey O.
weekly redesigns
Learn design through redesigns
Every Tuesday, I redesign something you send me and explain my exact thought process
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
“I'm floored by how much content you deliver in these emails. Again, thank you!” -Lindsey O.

1 useful tool

Learn Design Through Redesigns (By Creatorfuel)

Learn design through redesigns example

I've just launched yet another free resource to help you refine your design process and creativity.

It's a very simple newsletter.

Here's how it works:

You send me something that you think I should redesign.

I redesign it and share my exact thought process with everyone.

Every single step.

Redesign newsletter preview

I've published 3 examples on the website to give you an idea:

  1. I redesigned a luxury candle business' homepage
  2. I redesigned a moving company's homepage
  3. I redesigned a local cupcake shop's homepage

I used to do these for Flux Academy's Instagram stories (see highlights) in 2020 and 2021.

They were a smash hit.

Between 15,000 and 20,000 people would tune in every week!

I think people liked the raw thought process and loved discovering the techniques & tools used on a real layout.

A nice breath of fresh air from the usual "Top 7 web design tools of 2021" or "Never make these 8 web design mistakes".

Anyway, subscribe to get redesigns in your inbox.

Website redesign examples

Got something I should redesign?

Reply to this email with your submission (I'll take any type of layout – web design, mobile, marketing design, poster design etc).

You can also submit anonymously here.

First redesign coming next Tuesday!

1 effective tip

How to actually size & space everything in your layout

"How do I know what size to make elements?"

"How do I know exactly how much to space them out?"

"What's a grid and how do I size it?"

Let's answer these questions.

Deliberate sizing & spacing of your elements creates rhythm.

That rhythm and order creates visceral appeal and subconscious satisfaction.

Visceral appeal = "I'm not sure why, but this is nice!"

Here's what I mean:

Spatial system demo
Via Elliot Dahl (

Look closely.

The form on the right just looks and feels better doesn't it?

Now, how do we come up with the specific pixel numbers?

Well, it all starts with a spatial system.

Of course, this is after we've positioned our content, seen how it falls on the canvas, and settled on a layout & mood.

Now, establishing a spatial system simply involves picking a base unit and having all spacing and sizing numbers be multiples of that base unit.

Example: If we’re designing a website layout, we can pick a base unit of 8pt, and then decide to make all button heights 64pt (64 is divisible by 8).

Spatial system demo moving company
From my new redesign newsletter

All this does is create internal rules for your layout. It creates visual consistency, rhythm, and less decision-making / guesswork for designers.

8pt is the most popular because it’s an even number meaning you won’t be splitting pixels when centering elements and it gives you a good amount of sizing options (8, 16, 24, 32, 64 etc) that are distinct enough.

A smaller base unit like 4pt gives you more options. Do you need the extra spacing/sizing options (4, 8, 12, 16, 20, 24, 28, 32 etc)?

A bigger base unit like 16pt gives you fewer options and the sizing and spacing differences may be too big (16, 32, 48, 64, 80, 96 etc).

Now, what's a grid and how does it relate to all of this?

Grid demo

Grids are just a set of lines used to position content consistently. That's it.

Look at your layout and ask yourself:

“How am I dividing my space horizontally?”

"What flexibility do I want to have if this layout grows (more sections, more pages)?"

The 12-column grid is typically more than enough when you need consistent horizontal spacing for any digital and print project (web, app, posters, magazine, etc).

The 12 columns let you divide space into halves, thirds, fourths, sixths, which is plenty of options.

Column grid dividing space

Now, let's tie in the idea of a spatial system:

Simply put, your grid's side-margin and gutter sizes should be multiples of your spatial system's base unit.

It seems that Bite Toothpaste chose a base unit of 8pt, a gutter size of 24pt and a margin of 40pt (24 and 40 are both divisible by 8!).

Side-margins and gutters

Remember, there are no hard rules in design. Take these concepts and make them yours.

1 idea to think about

Divergent thinking + Convergent thinking = Creativity

You already know how to do this.

I'm simply going to make you aware of it so that you can consciously and habitually call upon this ability when needed.

Any and all creative ideas require divergent and convergent thinking to occur.

Let's look at divergent thinking first.

Divergent Thinking = Solving a problem by coming up with as many different solutions/ideas as possible. Like brainstorming or a mind map.

Divergent thinking is just idea generation & exploration with minimal evaluation.

We're not trying to connect the dots just yet.

Some of the ideas can and should be quite unusual and far-fetched.

Divergent thinking illustrated

The best divergent thinkers are incredibly good foragers, tinkerers, researchers or observers.

"How so?" you ask.

Well, because you need readily available information (either already in your head or discoverable by you) to come up with ideas.

Even better is the divergent thinker that knows the context and rules beforehand.

In other words, you can't come up with decent ideas for a topic you don't understand.

And you certainly can't come up with novel "rule-breaking" solutions for a topic you don't understand.

This is why they say "The best creators know the rules before breaking them."

Example of divergent thinking in visual design:

Stimulus: Design a homepage hero section for a moving company.

Divergent thinking: Quickly sketching 8 different possible layouts. Some wild, some not-so-crazy. Let your mind wander. Move fast.

Convergent Thinking = Considering limitations, combining ideas, and testing ideas to narrow options down to a singular solution.

Convergent thinking

Convergent thinking involves reviewing the "rules", constraints, and contextualizing to see which ideas (and which parts of which ideas) are viable and meaningful.

After all, creativity isn't simply producing something that is new.

Creativity is producing something that is new AND meaningful.

Meaningful = Useful or delightful

For something to be considered creative, it needs to "click" in the mind of the audience. It needs to reveal something.

A door knob shaped like a frog is not creative. It's just new and different. It's not useful or all that delightful. It doesn't clearly reveal anything significantly meaningful.

Frog door knob

On the other hand, a self-sanitizing door handle that harnesses kinetic energy from the door's movement is creative because it connects the dots in a novel and valuable way:

Self-sanitizing door handle

The door's movement is being used in a new way to generate energy and clean something that we typically view as dirty. This is new and useful. Useful creativity.

A door knob shaped like an open hand is also creative:

We open a door to enter a new space, so the door knob is acting as a handshake welcoming us into the space. This is creativity that delights.

Hand door knob

Again, creativity makes us connect the dots.

Side-note: Innovation is just applied creativity. Creativity that has been brought to life.

Shower thoughts

1) Walking around with your belt unbuckled feels inappropriate, but removing it completely makes it okay again.

2) If your food says "Enjoy" at the end of the cooking instructions, you can't complain to the company if you didn't like it, since you technically didn't follow the instructions.

3) As AI art becomes more and more indistinguishable from regular art, the most respected artists will end up being the ones who record themselves in the process.

Via Reddit

weekly creatorfuel
I share tips & tools every creator should know.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
“I'm floored by how much content you deliver in these emails. Again, thank you!” -Lindsey O.
weekly redesigns
Learn design through redesigns
Every Tuesday, I redesign something you send me and explain my exact thought process
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
“I'm floored by how much content you deliver in these emails. Again, thank you!” -Lindsey O.

Fresh Youtube videos



Have you forgotten about the fundamentals?

I’ve learned that no amount of coaching, fancy apps, “creativity hacks & tips” etc, will make up for:

  • Subpar sleep
  • Low vitamin D3 (lack of direct sunlight exposure)
  • Lack of movement (sports, resistance training, cardio)
  • Poor diet (macro and micronutrients)
  • Nonexistent stress management

Get these right first.

They are the highest impact things you can do.

Ignoring these is like a student ignoring the fundamental concepts needed to ace an exam and instead focusing on color-coding their notes, using fancy study apps, and organizing their study space with intricate decorations.

Master the basics. Everything else falls into place. full post
Aug 15, 2023

Nonfiction books are too long

Most nonfiction books should've been 1000-word articles.

I find myself abandoning a lot of books right around the 25-30% mark.

Not because they're bad, but because I fully get the gist by that point and it's right around when the repetition of examples and ideas begins.

I'm okay with abandoning a book midway now. Just a couple years ago, I would power through the whole thing in fear of missing out on some crucial ideas in the later chapters.

Now, I just have fun with it. If it piques my interest, great – I'll buy it, read the chapters that seem interesting, get what I came for and move onto the next one.

I think a lot of these authors are just trying to meet some sort of quota. I dunno.

There's elegance in brevity. full post
Aug 14, 2023

A note on this weird cold plunge trend

So many of these "gurus" telling us to take cold showers and cold plunges 😂 😂

If you’re tired all the time:

  • Go get your bloodwork done and see what you’re deficient in
  • Get outside. Get some damn sun
  • Sleep well
  • Use your mind to build something – It'll energize you

Stick to high-impact basics. These little micro-optimizations aren't going to change anything.

Enjoy your hot showers 🔥🚿 full post
Jul 21, 2023