Layouts

Advice for crafting layouts and structure that can create a clear, original web design. Break the mould, and build a unique layout!

Figma to WordPress: Tips, Tools & Advice

Graphics / 19 Apr 2024

Figma to WordPress: Tips, Tools & Advice

Making your own WordPress themes used to be a complex process that only the most skilled web developers were able to do. But, when using Figma, this process becomes just as simple as setting up a WordPress website.

One of the most powerful features of Figma is its third-party plugin support. There’s so much you can do with them, including the ability to convert your designs into fully functional WordPress themes without even having to write code.

Today, we take a closer look at the process of taking your designs from Figma to WordPress and see how it works. We also lined up some useful tips, suggestions, and a quick guide on how to get started.

Let’s dive in.

35 Beautifully Designed Shopify Themes for 2024

Shopify Themes / 16 Apr 2024

35 Beautifully Designed Shopify Themes for 2024

There are over 3.7 million online stores built on Shopify. If you were to explore some of these stores, they would mostly look the same since many of these stores still use the default free themes.

The key to building a successful Shopify store that drives continuous sales is to use a high-quality and professional theme that makes your shop look more authoritative and memorable. Today, we’ll help you achieve that goal.

In this post, we showcase some of the best and most beautifully designed Shopify themes you can use to setup an online store that stands out from the crowd.

The visual appeal of the theme design is important but we also made sure these themes have proper layouts that boost engagement and responsive designs that look great across various devices and platforms. Rest assured, you can’t go wrong with any of these Shopify themes.

10 Rock Solid Website Layout Examples

Layouts / 26 Jan 2024

10 Rock Solid Website Layout Examples

Layout can both be one of the easiest and one of the trickiest facets of web design. Sometimes a designer can bust out an amazing layout in minutes and sometimes that same designer can struggle for the better part of day with the same task.

Each project is unique and calls for a unique solution, but I’ve found it helpful to keep a few rock solid and incredibly versatile alignments in mind that I can bust out when I get stuck.

The ten layouts below should be enough to get you through even the worst cases of designer’s block when you can’t figure out the best way to arrange the content on your page.

10 Crucial Elements for Any Website Design

Layouts / 26 Oct 2023

10 Crucial Elements for Any Website Design

While every designer may have a different plan when it comes to building a website, they do have a common checklist. No matter how you try to avoid it, there are a few elements every website should (and usually does!) include.

From plenty of whitespace and great images, to search functionality and clear calls-to-action, these common elements are the things that users expect when it comes to using a site with ease.

Today we’re taking a look at ten elements you should prioritize on your website, perfectly designed examples of each, and tips on how to use each in your next website design project. As the saying goes, “the devil is in the details.”

The Golden Ratio in Design: Examples & Tips

Layouts / 20 Oct 2023

The Golden Ratio in Design: Examples & Tips

This might feel like a math lesson but hang in there. The golden ratio combines a little bit of math, a little bit of nature, and a lot of practical application for designers. Let’s take a look at what the golden ratio means for design, and a few tips for using it in your design projects.

The golden ratio has been used throughout history to create design elements that have an ideal visual appeal. Because the shape is rooted in nature and mathematics, it’s the perfect combination of balance and harmony. And it’s a superb tool to have up your sleeve as a designer.

15+ Creative Website Header Design Examples + Tips

Layouts / 4 Jul 2023

15+ Creative Website Header Design Examples + Tips

The website header, also referred to as the above the fold section, is arguably the most important part of a website. Mainly because it’s the first part of the website visitors see when they arrive on the website.

When it comes to websites, first impressions matter a lot. And the header section plays a major role in it. In fact, according to a study, the majority of website visitors only stay about 15 seconds on a website before they leave.

The header design of your website will play a key role in whether you can convince a visitor to stay longer than 15 seconds.

With the right header design, you can influence visitors to keep browsing the website. You can also design a header in a way that persuades visitors into taking action as well.

To help you find inspiration and learn a few tricks about effective header design, we handpicked some of the best website header design examples for your inspiration. These designs will surely help you make your own headers stand out from the crowd.

Brutalism: A New Trend in Web Design

Graphics / 23 May 2022

Brutalism: A New Trend in Web Design

Some designs aren’t polished and clean. They are rough, jarring and ragged. Yet they still work and communicate effectively. This class of websites makes up the raw trend called brutalism.

While it is somewhat new to web concepts, it’s been around for decades as a popular technique for posters and art in the 1950s, 60s and 70s. Today’s brutalism is starkly different from what you are used to seeing … and that’s why it’s likely to catch your attention. Let’s take a look at what it is (and I’ll share why I’m already over it!)

15 Tips for Creating a Great Website Footer

Layouts / 25 Mar 2022

15 Tips for Creating a Great Website Footer

One of the most important locations on your website is the footer. Yes, seriously. It may not be the area of the greatest design or most impressive content but it is a place where users frequently look for information. So it is vitally important that you don’t neglect this area when planning a web design project.

But what elements should you include? How can you keep the footer organized and in line with your overall aesthetic without being obtrusive? You’ve come to the right place. Here we’ll look at tips for creating a great footer with examples of some websites that are doing it well.

How Many Wireframes Do You Need? (Guide to Effective Wireframing)

Layouts / 6 Dec 2021

How Many Wireframes Do You Need? (Guide to Effective Wireframing)

Too often new website design projects start with a little wireframe overload.

Creating dozens of wireframes to show a client at the start of the project doesn’t necessarily create better understanding; it can be downright overwhelming.

Like with many other aspects of design, wireframing is an art where, in many cases, less is more.

Here’s a look at how to wireframe more effectively and a guide to how many wireframes you actually need (plus, some ideas on which ones are the most important, and which you can probably miss!)

What’s a Logo Grid, and Why Should You Use One?

How to Design a Logo / 22 Oct 2021

What’s a Logo Grid, and Why Should You Use One?

So you need to design a logo. Where do you start? Shapes? Typography? A grid?

A logo grid or construction guide is a popular starting point for many designers looking to create a logo. The use of a grid system, especially for a design that might often render at extreme sizes – very large or small – can help you create something that has visual harmony, an organized aesthetic and purposeful design.

Are you in the middle of a logo design project? Learn about logo grids, typography, logo types and more in our in-depth guide on how to design a logo!

7 Ways to Design for the Unexpected

Graphics / 11 Oct 2021

7 Ways to Design for the Unexpected

What just happened? Why doesn’t that work? Does this look funny to you?

These are all questions you don’t want users to ask when interacting with your website design. But inevitably, they will. The unexpected happens all the time online. From users changing settings on their devices to slow browsing speeds, your role is to expect these unexpected challenges and offer a design solution… before they happen!

From dark mode to people taking an unexpected path through your website or app, we’re exploring lots of unexpected scenarios so you can plan for them in advance!

7 Reasons You Need to Be Using Landing Pages

Layouts / 19 Aug 2021

7 Reasons You Need to Be Using Landing Pages

You’ve come across them everywhere: Landing pages that take you to a website but aren’t the homepage.

It’s a great strategy that helps get visitors directly to the information they want to see from a marketing source – social media, advertising, etc. – and is generally designed for a specific goal.

If using landing pages isn’t already part of your website strategy, it’s time to consider them. Here, we’ll look at seven reasons you need to be using landing pages to help drive the right kind of conversions on your website.