17 Ways to Get Design Inspiration from Other Websites

As you peruse the WPMU DEV blog, you’ll find that many of the articles include example screenshots from websites that execute a particular design technique well. After all, what better way to demonstrate a point than by providing a real-life example of a web design strategy or technique?

But WordPress blogs aside, there are many places to draw upon for inspiration around the web. It’s simply a matter of knowing where to find it. The better acquainted you are with resources that are most likely to provide inspiration (and that match a style that fits your own), the more quickly you’ll be able to adapt those web design techniques and trends into your workflow.

If you’re not currently using websites for inspiration and motivation, let’s take a look at why that needs to change. Then, I’ll give you 17 ways to get design inspiration from other websites.

Website Inspiration and Motivation: Why You Need It

As a WordPress designer, you spend a lot of time working on your own. Outside of initial kickoff and exploratory discussions with clients, how much external input and inspiration is typically injected into your workflow?

Perhaps not much at all.

Which isn’t always a bad thing. After all, too many distractions can slow your progress. Too many cooks in the kitchen can create an unclear vision. And too much unwieldy feedback can lead you down the path of scope creep. If you want to stay focused, remain productive, and spend less time on reworks, it’s often easier to block everyone and everything out until the exact time you’ve designated for collaboration and feedback.

That said, it’s not reasonable or even all that practical to work completely on your own. After awhile, every new WordPress job you get is going to look a lot like the others that came before it. The last thing you want to do is get stuck in a rut where you’re designing the same website over and over again.

This is exactly why you should be on the lookout for inspiration from other websites. You can learn more about what’s happening in terms of design, you can discover cool new ways to tackle something you might not have otherwise considered, and you can do all of this on your own time.

Here are some of the ways in which outside inspiration can help:

Discover New Trends

Using inspirational websites and resources that aggregate inspirational web designs allows you to more easily discover cooler and newer design methods.

Work Faster

If you have a reliable set of resources and websites you know where to draw inspiration from, you can work faster during the brainstorming, wireframing, and prototyping parts of your process.

Think Less

Inspirational websites take some of the work out of your process as you’ll spend less time researching or experimenting with underlying techniques and more time putting them into practice.

Boost Creativity

Always being on the lookout for inspiration allows you to absorb the material and give it time to marinate. That period of reflection can give your brain the space to make that inspirational design something that’s uniquely yours or to apply it when it’s most relevant to a client’s project (rather than trying to force it).

Motivate Yourself

When you pay attention to what other websites are doing, it can be a great way to keep you from getting bored. Being inspired by them could realistically motivate you to create better work and be more creative.

Improve Communication

Inspirational websites don’t just need to be for your eyes only. If you stumble across something rave-worthy or it’s given you an idea of something you’d like to use on a current project, why not bring the website to the attention of your team or your client? Having something tangible to show them will decrease the chances of there being any miscommunication about what you intend to do.

Just remember that this isn’t about stealing other people’s work (unless you’ve purchased/downloaded a template meant for licensing and repurposing). Looking for inspiration is about finding somewhere to start with your own work. Or getting yourself unstuck when you’re not sure how to pull off something that’s been itching at the corners of your brain, but you can’t seem to materialize it on the screen.

17 Ways to Get Design Inspiration from Other Websites

As I mentioned, if you can find a good set of inspirational websites and keep those handy, it’ll do wonders for your WordPress workflow. So, in this list of inspiring websites, I’m going to start there. But I would encourage you to keep reading as there are many other places to get design inspiration from. You just need to be open to accepting inspiration from the most unlikely of places.

1. Use Behance’s Curated Galleries

Behance Curated Galleries

Behance has a feature called Curated Galleries. While there isn’t a category specifically for “Websites”, you’re likely not trying to be inspired by an entire website anyway. Instead, you’re looking for something more specific that you can drill down into. That’s why categories for things like illustrations, advertising, and game design can give you unique insights into what you could be doing with your own design work.

2. Check Out Dribbble’s Most Viewed

Dribbble Most Viewed

Dribbble is a great resource for inspiration and templates, in general. However, it’s the “Most Viewed” setting that web designers should be using when trying to envision what would work well for a current project.

I wouldn’t even suggest clicking into any of the boards to start. Just take a bird’s eye view at what’s catching people’s attention right now. Are illustrations more popular? Is there a certain color that shows up over and over again? Is there a concept you had previously considered but threw out because you weren’t sure if it would work well? Look at what the masses find the most appealing and draw your inspiration from that.

3. Use Abduzeedo’s Categories


Abduzeedo is a website that’s known for its inspirational material. The nice thing about how the site is structured is that you can choose how to navigate it in order to find that inspiration. You can subscribe and have it delivered to your inbox. You can sift through collections (like what Behance does). Or you can use categories to dig even further when you’re looking for something specific.

4. Pay Attention to Awwwards’ Winners

Awwwards Winners

There are a number of ways to use the Awwwards’ website. Like some of the resources above, you can use collections to get a good mix of inspiration on parts of a website that you’re focused on (e.g. contact pages, product pages, animation, etc.)

Of course, Awwwards is a website that gives out daily awards to websites (hence, the name). Search by category or just glance through recent winners to get a sense for what’s leading the pack in terms of design these days.

5. Use Inspiration Grid for Branding Inspiration

Inspiration Grid

Although Inspiration Grid has design samples of all types, I would suggest using this site specifically for branding inspiration. Designing a WordPress site is a major undertaking in and of itself. But being asked to design a logo and other branded elements? It can be difficult starting from-scratch if your client doesn’t have any idea what they want to do. This could give both them and you some ideas.

6. Bookmark Pinterest Boards

Pinterest Masonry

Unlike many social media platforms that give you one feed to scroll through, Pinterest’s boards and masonry layouts make creating inspirational feeds much easier for web designers. And you can draw inspiration from whatever you like. You can look specifically for WordPress websites. You can pin images from your target industry. You can even look for inspiration in off-topic pins. You never know what might spark an idea.

7. Look at Websites Built for Web Designers

Websites that sell a product or service specifically meant for the web designer or developer should be on your list of inspirational resources.

Webflow:

Webflow

InVision:

Atom:

Atom

These kinds of software websites tend to have forward-thinking and tech-minded people behind them, which means they’re going to be on the cutting edge of design. Even if you can’t find a way to use the clean, yet bold styles of these websites in your work, you can use them as a way to keep your own WordPress site looking modern.

8. Watch for Changes in WordPress Blogs

WordPress blogs are another type of website you should pay close attention to. As these design experts redesign their sites and add different elements to them (remember when everyone suddenly had an exit-intent pop-up?), that’s a good sign a big change is coming to the field.

For example, you’ve noticed WPMU DEV’s latest redesign, right?

WPMU DEV

Now, compare it to other websites from WordPress experts, like:

Elegant Themes:

Elegant Themes

And Kinsta:

Kinsta

Notice the trend here?

Any time WordPress blogs start adapting to a similar trend, note it down and make use of it in your work with clients.

9. Subscribe to WordPress Blogs

Of course, don’t forget to subscribe to your favorite WordPress blogs, too. The ones that focus more on technical tutorials (like WPBeginner) might not be best for this, but ones that cover web design roundups (like WPMU DEV) definitely would be.

For instance, here are a few recent blogs that include screenshots of websites that provide context as well as serve as inspiration:

10. Read Other Web Designer’s Blogs

Reading other web designer’s blogs–even if they focus on a different niche or are at a different level of their career than you–can be a good way to get inspired. You know they’re going to write about things you think about on a regular basis, so you can use these blogs for design inspiration as well as for educational purposes.

Their website, in general, might be a good way to stoke the friendly fires of competition, too, if you catch a glimpse of an enviable update they recently made to it. And you should pay attention to their portfolios. Their site and blog might not do it for you, but the work they’ve created for other clients might.

11. Subscribe to Industry Blogs

These days, most of us have a niche industry we specialize in. Which means you should also be looking for inspiration outside of web design and WordPress websites. Find industry-specific websites and blogs that you enjoy. Even if you don’t have time to read every post, you’ll have a regular reminder to visit the website. And you never know what kind of inspiration you’ll find there.

12. Watch Adobe Tutorials

Creative Cloud Tutorials

WordPress and web design tutorials sometimes focus a little too much on the implementation of a WordPress plugin or the usage of code in web design. That’s a good thing, but there’s not much there to be inspired by. That’s why a resource like Adobe is a good one to have on-hand.

Specifically, look into its Creative Cloud tutorials. While these are meant to show you how to use design software and work with stock imagery, the tutorials use real-life examples that could give be the jumping-off point you need in your next project.

13. Check in on Google

Obviously, the Google home page isn’t going to inspire much in the way of web design aside from how well it uses minimalism.

Google Home

That said, if you are a Google user and log into its other properties–like Maps, Google+, Gmail, Drive, etc.–or you’re an avid follower of Material Design, keep an eye on changes going on there.

Google Drive actually just underwent a subtle design change:

Google Drive

It’s a small tweak made to the button in the top-left, but it’s one worth noting. In general, if you’re curious about UI elements, Google is a good source to take inspiration from.

14. Monitor for Trends in App Design

Even if you don’t design mobile apps, you can still seek out inspiration from them–especially now that mobile design needs to be prioritized. Since mobile app design can’t rely on scrolling, it’s important to watch for what those designers do to streamline and improve the user experience.

I would suggest watching for changing trends in any mobile apps you log into on a regular basis. If you’re noticing a change in how CTAs are handled, if new fonts are emerging, or anything else that catches your eye that wasn’t there before or maybe was considered a taboo previously, make note of it. It may give you a new idea on how to approach an upcoming design project.

15. Visit Stock Photography Websites


Even if you’re opposed to using stock photography in your design creations, they’re still worth taking a gander at if your goal is to be inspired from a variety of sources and design types.

Take iStock, for instance. The photograph currently on the home page is probably not something you’d ever think to use on any of your websites (see screenshot above). However, did you notice the gradient created by the natural light and shadow? Gradients have proven themselves a very popular element in web design in 2018, so it’s interesting to see that reflected within a stock photo.

I guess what I’m saying is that stock photos don’t necessarily have to be something used when you don’t have the time or budget to create a custom design or take your own photographs. If you see something innovative in a picture or notice a new style trending in a variety of them, use it to improve your own custom work.

16. Read a Lot of Case Studies

In general, marketers use case studies to help sway prospective customers during the buying process. If they can provide proof that their solution or product worked well for a similar type of customer, then it should be easy to convince the potential customer, too.

That said, I think case studies present a great opportunity for inspiration, too. Think about it: every case study paints a before-and-after picture. If you can find the right case studies–typically, ones that focus on A/B testing of websites–you can use those contrasting shots and redesign techniques to improve your own workflow.

17. Engage with Every Website You Visit

Also, don’t forget to take more time to engage with the websites you visit. Even if it’s just the local restaurant’s website you and your spouse are looking at as you weigh tonight’s dining out options. You never know what sort of surprising trigger or animation or just a general experience you might find.

Wrapping Up

If you’re not in the habit of doing so yet, start training yourself to keep your eyes open as you visit other websites, whether you’re mid-project or you’re browsing the web in your off hours. Really take in what you’re seeing, spend time thinking about it, and then use that inspiration later to create unique and innovative designs for your clients.

Brenda Barron
Over to you: What are your favorite places for inspiration offline?