The 15 WordPress Sites That Are Changing the Design Game

Have you ever come across a website and thought “Wow, how did they do that?” I know I have. New websites are popping up all the time that challenge convention and push the limits of what a website can (and should be).

But what about sites built on WordPress in particular? Because so many people use themes, there’s a reputation that follows this CMS around like it can’t be used to create truly remarkable things. But I’ve got news for the naysayers: WordPress sites can have just as much wow factor.

I’ve spent some time digging through best-of lists, award sites, and asking for input from various WordPress groups to come up with a list as good as I can make it of the best WordPress sites out there right now. Mind you, these sites aren’t just good (if they were, the list would be quadruple its current length); they’re also unique and push boundaries with regard to design, navigation, UX, UI, effects, or content. They are, quite simply, must-see.

Amalthea Catering Services

The website for Amalthea Catering Services is based on the Vigor theme by Edge Themes. This in conjunction with the LayerSlider plugin creates an interesting effect upon scroll.

As you scroll down, two images slide together like puzzle pieces. What makes this especially effective is the selection of bold, high-quality images. And they don’t just feature food—they feature people interacting with food in bizarre ways—a woman acting as though she’s about to eat a huge raw fish, for instance.

Scrolling through the Amalthea website is fun.

Again, the site itself isn’t all that unique but the combination of features creates a visually stunning look that’s hard to forget and a pleasure to browse.

Stupid Studios

Stupid Studios is a Danish design and branding agency that has added a few extra design touches to its site to add visual appeal, of course, but also to create an element of interactivity.

The site looks fairly standard, though well-conceived, at first glance.

It combines parallax effects with a layered slider and traditional portfolio site for a unique effect that acts as a solid branding tool.

You can then browse the case studies in the main slider by clicking and dragging them to the left.

There’s nothing revolutionary happening here, but it’s the combination of effects that works so well.

Also, large typography attracts immediate attention and ensures each section of this one-pager can stand on its own two feet.

A Waste-Less Journey at AO.com

Horizontal-scrolling sites are certainly increasing in popularity but it’s always going to be effective if done right.

AO.com has an excellent example of side-scrolling in their Waste-Less Journey page that offers up tips for grocery shopping in such a way so as to prevent food waste.

During the “journey” you follow a shopping cart through the store until you get to checkout, and there are plenty of shopping tips offered up along the way.

The whole thing is built on a custom WordPress theme, making it obvious that whatever limitations people have previously ascribed to this CMS are quickly falling by the wayside.

Midori Aoyama

Here’s another example of a WordPress site that piques visitor interest by including subtle animation effects and visual elements.

Geometric lines, like constellations, float around DJ Midori Aoyama’s name and turn blue on hover. Upon scrolling, the visitor is shown news items then provided full width images with large but sparse text.

The next section is grid-style with five columns of three blocks, the top is blank until the user hovers over the text in the second. The third block features a relevant animation. It’s a fairly simple site in structure and content, but the execution is where it really shines.

Wanda Print

The productions and creative studio pulls no punches on the Wanda Print website. Sure, it has traditional navigation options so visitors can find out more about the studio, its approach to work, and how to get in touch, but it saves all of that for an expandable, mobile-style menu tucked up into the lefthand side of the screen.

Wanda Print showcases its portfolio as a stunning and interactive slideshow.

This way, the entirety of the visitor’s focus is placed on the prominent, full-width portfolio pieces. And there’s a lot of them. You can keep scrolling and scrolling and you’ll uncover 32 different advertisements or campaigns to consider.

It’s impressive in how immersive it is and affords us another opportunity to appreciate the versatility of WordPress.

I Shot Him

A super fun site for a super good cause. Creative studio I Shot Him has since merged with Cultivated Wit, but the original site design is well-worth noting.

The bold header image draws the visitor in and the portfolio work is left to speak largely for itself.

Typographical choices are equally bold, the copywriting is personal and endearing, and the site itself is built on a custom theme.

The small details here are what I appreciate most.

From hover text that reveals a less-than motivational motto, to design flourishes that bring a smile, I Shot Him shows that you can use WordPress to be as creative and fun as you want, and still walk away with a fully-functional website.

Cultivated Wit

Speaking of this site, Cultivated Wit is actually a great example of a game-changing WordPress site in its own regard.

For starters, the logo is interactive in the larger header image. Scrolling reveals large about text then a background video to increase interest. The content is funny, of course, and engaging. And once you’ve hit section four of the page, you enter into a realm of an interactive joke where you’re asked a series of oddball questions, just because.

When a lot of people think of WordPress, they envision a stale corporate site or a plain blog. This site definitely breaks those molds.

Letters, Inc

Letters, Inc is a design team based in Tokyo that’s offering something new to the world of WordPress.

The company’s portfolio site is a standard one-pager with parallax effects, but how those are executed makes for a sight to behold.

The design features dynamic lines and geometric designs that creep across the screen to create illustrations upon scrolling.

There’s a feature that allows you to change the color scheme of the site, and animation effects on both sides of the screen that give the entire thing a semblance of a heartbeat.

The stunning portfolio displays also give you the full perspective of how they created each design.

Letters, Inc is also the creative force behind Midori Aoyama’s site mentioned above.

Invisible Children

This dynamic (if not slow-loading) site, Invisible Children, offers a multitude of things to look at and experience while absorbing information about a very serious topic.

Some features include a fullscreen background video, icon-overlaid portfolio images, very large service-style buttons, a masonry-style blog, and a hover on scroll donate button.

The site has a clear message and uses WordPress to effectively relay that information.

Typographica

This site marries form and function most beautifully. It appears to be built on a default WordPress theme, but the execution is really quite interesting.

Not only is it nice to look at it, but it also uses the typographic elements it holds as a focus in every element of the site. It uses several typefaces as headers, body text, and special links.

One of my favorite features is how the typeface used for the nameplate is swapped out each month.

Right now, it sports ATF Wedding Gothic but who knows what could be next?

Design the Planet

The Design the Planet website doesn’t look all that different from other sites at first glance. That is until you realize it scrolls up instead of down.

This little design gimmick falls right in line with the site’s shuttle launch theme.

The layout is very similar to most one-page sites, but there’s an air of whimsy that sets this site apart.

The site is chock full of interactive sliders for browsing their partners and branding work.

Again, this isn’t the most attractive site in the world or even the most innovative, but I love how the brand is seamlessly integrated into the content and how the user interacts with the site.

University of Mary Washington

The University of Mary Washington’s website looks like most other college sites. It offers up a slider with the essential info new and returning students need to know. It has separate sections for faculty, staff, and students. It also has guidelines for those planning a visit to the campus.

But what I think makes this site stand out is its use of prominent accessibility buttons.

On the lefthand side of the screen, you’ll see two overlaid buttons. The first allows you to toggle the site’s color scheme for high contrast (also referred to as inverted), making it easier to read by those who are color blind. The second increases the text size considerably for the visually impaired.

The seamless integration of accessibility here is definitely worth noting.

AMC

The site for the television network, AMC, is very simple. It features large images, only the essential text, and a few navigation options in the upper right corner. It also has a drop-down menu that offers up all of the network’s current shows so you can click through to watch full episodes right there.

The layout is simple, but it scales beautifully and acts as a good example of how WordPress can be used by high-profile clients with rich multimedia needs.

Velvet Hammer

The music and management group’s website is really well done. For starters, you can pick your Velvet Hammer soundtrack in the upper-right hand corner, then scroll down to experience each section of this one-pager site.

The layout is straightforward – you scroll to view their clients, about and contact information, offices, etc – but the presentation is intuitive, immersive and restrained without being too in your face.

While blasting Romantic Dreams by the Deftones, I was able to browse the site distraction-free.

My favorite part is the “Clients” section. You’re presented with an image of AFI and a right arrow. You can browse through images of each band on Velvet Hammer’s roster here but if you click the center of the image, the page scrolls up to the top and brand new overlaid pop-up page appears with everything you could ever possibly want to know about that artist.

Con Gas

Here’s yet another one-page portfolio site, but it captures your attention by greeting you with an 8-bit style character first thing.

This character will walk to wherever you click on the screen and will drop a yo-yo when you click a link.

It’s a gimmick, to be sure, but an effective one, because it captured my attention right away and added some personality to a site that could have been standard fare.

Con Gas appears to be a child theme of the parent theme, Starkers. (Editor Note: links removed as the site and theme are no longer active)

Wrapping Up

While I’m certain there are many, many more excellent WordPress sites out there that challenge design convention, hopefully these fifteen selections will show you there are no limits to what you can accomplish with this CMS.

Now I want to hear from you. What do you like about the sites featured here? Or do you think they're meh at best? What are some sites you've come across that you think should've made the list? Share your suggestions below.

Tags:

• design
• branding
• marketing