No items found.
No items found.
Wall of Love
Roadmap

CF #14: What makes a layout "look good"?

Key points

Topics

  • VAS by 3M is an AI tool that gives you feedback on your layout's visual hierarchy
  • Intentional alignment (using grids), scannability, and clear visual hierarchy make a layout "look good"
  • A web page's layout should clearly convey the following 3 things in 3 seconds or less: 1) What the page is about 2) Why the user should care 3) Where they should go next
  • Apply what you learn by sharing it on social and setting a deadline for doing so
  • People are under the misconception that some are born with an "eye" for design. Raw talent. Your "eye" is honed, not inherent.

My new layout design course, an incredible visual hierarchy tool, what makes a layout "look good", two steps to applying what you learn and much more.

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.

3 useful tools

1) Typographic Posters

Posters are designed to draw you in and move you with a message as quickly as possible.

This is why Typographic Posters is one of my favorite places to get unique layout inspiration (for any type of project).

Screenshot of Typographic Posters website

2) Visual Attention Software by 3M (Predicts how people will view your layout at a 92% accuracy)

Sometimes you've been staring at your work for too long to be objective.

Want to see what your audience sees? As in, which elements they'll see first, second, third? Give it a shot. It just might surprise you.

Screenshot of 3M

3) Figma

Long time Figma user here.

Can't believe I haven't recommended this one before.

It has become an underrated all-in-one tool that many can benefit from: Designers, generalists, marketers, solopreneurs. Everyone.

What I create in Figma:

  • Web design
  • Slideshow presentations
  • Social media posts
  • Youtube thumbnails
  • Brainstorming and planning
  • I even write some documents in Figma
Screenshot of Figma's user interface

3 effective tips & techniques

1) What makes a layout "look good"?

Our example:

Print layout covering coffee

#1: Aligned to a grid for visual consistency:

Coffee print layout showing good use of alignment

#2: Spacious type for scannability:

Coffee print layout showing good use of white space

#3: Clear visual hierarchy to facilitate comprehension

Coffee print layout showing good use of visual hierarchy

2) 70% of online retailers fail this visual hierarchy test

EyeQuaint ran the 3 W's test on 43 of the biggest eCommerce websites in the world.

The 3 W's test is quite simple.

A web page's layout should clearly convey the following 3 things in 3 seconds or less:

  1. What the page is about
  2. Why the user should care
  3. Where they should go next

The results were fascinating.

Out of 43 websites, 30 failed the test, including Walmart, GAP, and Office Depot.

Screenshot of Office Depot's website showing that their offer is not immediately visible

Best Buy and H&M did very well on the other hand:

Screenshot of Best Buy and H&M's websites showing that they passed the visual hierarchy test

3) How to apply the things you learn in two steps

STEP 1: Commit to sharing what you learned with others (Instagram, Twitter, Blog, Youtube).

Make this your first instinct. Always.

Example: If you just learned a new piece on the piano, commit to recording yourself playing so you can post it on Youtube and Instagram.

STEP 2: Give yourself less time

Set a deadline for sharing what you've just learned.

Give yourself just enough time to do it right but not enough time to sit there and second guess yourself.

Convert what you learned into something real.

3 ideas to think about

1) Visual design can be boiled down to using layout, color, and typography to fulfill the requirements of a project.

“I create shapes and stuff in Figma and they pay me for it. Unbelievable.” -brianmoyano on Reddit

2) There is a high likelihood that most layout templates on the internet have not been tested for usability.

3) People are under the misconception that some are born with an "eye" for design. Raw talent. Your "eye" is honed, not inherent.

Shower thoughts

1) Humans invented machines to save some effort and now go to the gym to make up for the saved effort. We’re weird.

2) 200 years ago, people would never have guessed that humans in the future would communicate by silently tapping on glass.

3) If everything goes smoothly, you probably won't remember today.

Via Reddit

Tell me, what was the #1 thing you took away from this email? How will you apply it to your life/career/business?

Reply to this email with your answer. I'll be sure to get back to you!

Much love

-Izzy

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

Random

Reflections

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.

...read 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.

...read 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 🔥🚿

...read full post
Jul 21, 2023