Archive for February, 2012

Smashing Special: WordPress Theme Trends For 2012


  

This special is the first in our series of Smashing Specials — extended articles and studies dedicated to a specific topic. The special features current WordPress theme trends for 2012, covering past trends, new developments in theme design and trends in the theme development.

2011 was a great year for WordPress, with some excellent new updates that saw the introduction of a drag-and-drop uploader, distraction-free writing, the HTML5 Twenty Eleven theme, and movement towards a fully responsive dashboard. As well as changes to WordPress core, theme development continued to evolve, as whispers of responsive design spread like wildfire across the WordPress community.

splash image

(image credit: Bowe Frankema)

Over the next year, some recent developments will become standards. Others, now just remote flickerings in the eyes of a few theme designers and developers, will start to take hold. Now that 2012 has properly started, let’s look at some trends that have emerged and are emerging.

Due to the length of this special, it was split into three parts:

Past Predictions

When thinking about future trends, it’s fun to look back and see what people predicted before to see whether any of their predictions came to fruition. Thankfully, with the power of Internet, combined with Ian Stewart’s “Future of WordPress Themes� posts (as well as WPCandy), doing this is very easy.

So, just what were people predicting when WordPress was growing up?

The Demise of the WordPress Premium Theme Market

At the start of 2008, when creating a premium WordPress theme was frowned upon, Ian Stewart wrote this in a post:

It’s prediction time: The premium WordPress theme phenomenon has approximately one year left before collapsing entirely, leaving a rather large hole between completely free WordPress themes and custom themes $1500 and up. If you’ve got a “premium� WordPress theme waiting in the wings, I advise releasing it sooner rather than later. As in, now.

We don’t really need to add a comment to that one.

“Cluttered and Pimped Out�

Here’s what Robert Ellis said about the future of WordPress themes in 2008:

The vast majority of themes will still be garish mutations of Kubrick, but more cluttered, more pimped out with widgets, scripts and effects. There will still be premium themes that push the envelope in terms of built-in options and quality, but the market will become saturated, setting off even more accusations of copying (as we’ve seen with magazine themes; though personally, I think most of them look like they were “inspired� by CNN).

This was more on the money, and we have seen amateur designers cram in a lot of different scripts and effects. This has diminished over time. Hopefully, our direction now is more Zen.

Early Niche Predictions

Justin Tadlock had this to say in 2008:

I do hear some talk of moving into designs for specific niches, so theme developers could cater to particular users. I think this is a great idea, which could be a nice trend as we’ve seen with magazine-styled themes. Users want something that works for them before unwrapping the packaging.

Justin was definitely prescient then, as niche themes became more popular in 2011. And we’ll see much more of them in 2012.

Everyone Loved Theme Options

In 2009, themes that allowed you to customize the layout and design started to appear. Here’s what Dougal Campbell had to say:

The main change I see happening here is with themes which provide some sort of customizing feature on the back end which lets you choose options like: header graphics; one, two or three sidebars, along with their positions; color schemes; They will also be pre-bundled with several plugins which allow you to pull in your content from other sources such as Twitter, Facebook, Flickr, etc. These kinds of themes already exist, but I think we’ll see the ease of customization rise to a new level.

By 2012, this trend towards adding options and customizations reached its zenith, and it will hopefully decline over the coming year.

Want to have fun reading past WordPress theme predictions. Check them out here:

A Trip Down Memory Lane

Let’s look at how theme design has changed over the past few years.

Free Themes: The WordPress Repository

Below are the most popular themes downloaded from the WordPress theme directory since 2009 (thanks to Otto for getting this information). You can see how WordPress themes have moved away from looking like blogs to a more professional appearance.

2009
image
iNove was the most popular theme in 2009, followed by Atahualpa and then Pixeled.

2010
image
Mystique was the most popular theme in 2010, followed by Atahualpa and then TwentyTen.

2011
image
Delicate was the most popular theme in 2011, followed by TwentyEleven and then Platform.

The Most Popular Themes in the Forest

To see how things have fared on the commercial theme front, we scoured the archive of ThemeForest. Below are the best-selling themes from the last quarter of each year.

Here were the top themes:

2008

Rockable Press WordPress Theme

Sharp was the top theme for the end of 2008.

2009
image
Twicet topped downloads for the last quarter of 2009.

2010
image
Striking was the most popular theme in the last quarter of 2010.

2011
image
The multi-optioned uDesign was the most downloaded theme in the last quarter of 2011.

What Happened In 2011?

Before getting to our predictions for what will take hold in WordPress themes this year, let’s quickly look at what has happened over the past year:

  • Theme frameworks
    Theme frameworks were everywhere in 2011. As someone who blogs regularly about WordPress, I found myself announcing the launch of three different frameworks in one week. WordPress staples such as Thematic, Thesis and Genesis continued to grow in popularity, but more and more frameworks appeared on the scene, including the likes of Wonderflux, Bones and Roots. Perhaps in 2011 we’ll see fewer new frameworks and more themes for existing ones.
  • Child themes
    Child themes took off in a big way in 2011. Once people grasped the concept that creating a child theme and making edits to it was better than hacking away at the parent, they started to have fun. Will we see child themes in the WordPress repository in 2012?
  • The “CMSâ€� theme
    At the start of 2011, everyone seemed to be calling their theme a “CMS� theme, implying that their awesome theme gave WordPress the characteristics of a CMS, as opposed to WordPress itself being a CMS. Thankfully, that trend petered out towards the end of the year, perhaps as it became less imperative to convince people that WordPress was a CMS.
  • Sliders everywhere
    Every theme seemed to have a slider on the home page. This might have been due to the gorgeousness of Nivo and other sliders that make it easy for anyone to include a jQuery slider in their theme. Hopefully, designers will be more inventive with their jQuery this year.
  • Tumblr themes
    All of a sudden, creating a Tumblog became easy. Designers first achieved this with the Woo Tumblog plugin, but the introduction of WordPress post formats made it possible to create a Tumblog with WordPress core functionality.
  • Custom post type mania
    As predicted by Brad Williams in WPCandy’s predictions for 2011, we saw loads of themes that made use of custom post types, including ones for job rollers, e-commerce websites, real estate websites, review websites and so on and so on. Not to mention a plethora of WordPress custom post type plugins.

Now we’ve got the past out of the way, let’s look at the future!

Smashing Special: A Three-Part Series

Due to the length of the series, it was split into three parts:

(al)


© Siobhan McKeown for Smashing Magazine, 2012.


Love in the Background: Valentine’s Day Wallpapers


  

With the season of love and romance nearly upon us, we thought that we should roll out the desktop decorations for our readers to get them in the ‘mood’, so to speak, for Valentine’s Day. So we have collected a lovely collection of wallpapers designed in the theme of the holiday. Some of these you have undoubtedly seen, but we are hoping that some of them may not have hit your radar before.

So take a look down through the decorative showcase of Valentine’s day wallpapers and load up on the goodness! We are sure that there will be something in this collection that tickles your fancy and entices you into redecorating your desktop with love.

The Wallpapers

Download Here

Download Here

Download Here

Download Here

Download Here

Download Here

Download Here

Download Here

Download Here

Download Here

Download Here

Download Here

Download Here

Download Here

Download Here

Download Here

Download Here

Download Here

Download Here

Download Here

Download Here

Download Here

Download Here

Download Here

Download Here

Download Here

Download Here

Download Here

Download Here

Download Here

Download Here

(rb)


A Craft Of Consequences: Reader, Writer And Emotional Design


  

Before the very first page of a book has been read, you’ve already analyzed it in countless ways without even noticing. The paper stock, the thickness of the binding, the aroma, the color of the type and even the texture of the cover; the very character of the book is being dissected by the hand and eye at every moment.

In this brief second there is a dialogue between the reader and the object. This conversation is subtle and complex, but for most people it is entirely subconscious. This is because we rarely think about these things  —  we feel them instead.

Before this dialogue can take place however, the ideas of the author must be given shape. By examining the relationship between the form of the book and the information contained within, we can begin to understand how these visual and sensory components work, but it will also teach us how to create long-lasting emotional bonds that we’ll want to keep forever.

Lost In Translation

I recently read The Greatest Show on Earth by Richard Dawkins. His book explores the wonder of evolution and scientific discovery in fabulous detail and also goes into explicit detail as to how these ideas better our society and affect our perspective of morality and philosophy. But its uncomfortable size and shape as well as its flimsy typesetting gives the book characteristics of apathy and exhaustion.

The object reveals much about the world in which it was made: a heartless, ignorant and illiterate world, filled with people that viewed the author and the reader as a stepping stone to the top of the New York Times bestseller list.

And yet, these aesthetic and ergonomic failures are more than skin deep as they interfere with the relationship between writer and reader. Dawkins’ evidence seems less empirical, less established and somehow less wonderful, as the book miserably fails to explain the poetry of its content.

The Greatest Show on Earth
Notice how jarring and uncomfortable it is as these glossy, brightly colored pages sit next to ordinary blocks of text.

Dawkins’ argument is damaged by these cluttered, noisy and mistreated illustrative pages. Whilst he describes the wonderful and unique beauty of life, his ideas feel ordinarily ugly. The images to the left of the spread, their jarring and chaotic arrangement, the tension built by their seemingly random position, fail to reflect the ideas of wonder, beauty and order that the writer so eloquently describes.

The broken pages of The Greatest Show on Earth
The ideas contained within have lasted centuries, yet this book has barely lasted a single reading.

Walk into any large, commercial bookstore and you’ll see thousands of books treated in a similar way  —  each with layer upon layer of unnecessary information that conflicts with the intent of the author. Something crucial is destroyed in this journey as the object disrupts vital information on transit.

To understand why these books are not working, we must first examine how information passes from writer to reader.

The Journey

For centuries, the book was a tool that existed for a single purpose; to transfer information from one mind to another. Although much has changed, there will always be a problem with this form of communication, and in our reliance on systems to safely relay data.

In bookmaking these systems are traditionally enforced by a publisher, as they have complete control over the quality of the binding, the typographic details, the use of color and the overall physical identity of the idea. All of these visual and sensory elements combine to produce the system by which the idea is given form. However, as in the case of the majority of books out there, this system poisons and infects it.

These systems comprise of an immense number of components, such as the combination of typefaces, the paper density, the use of color, the printing method, the measure, the width of margins, and other typographic details. But the problem with these systems is that they are incapable of reflecting the ideas of the writer with the form of the book. They act as a barrier that the information must travel through to be able to find the reader.

Idea, System, Form

Cheap paper, bad typesetting and an awkward binding cause confusion and disrespect to the author’s ideas. But if we understand how these elements work together we can make systems that provide useful signs to the reader, and also manage to safely transport the ideas of the writer at the same time.

Emotional Information

When a visual component accurately represents the ideas of the writer, it becomes a source of emotional information. This aids in the transferral of ideas, and promotes and persuades the reader that the content is worthy of their precious time.

It’s more than just a pretty cover, visual pun or marketing gimmick that creates emotional information. It’s everything from the size of the type to the texture of the page, because these components not only help to explain the content of the book but also continue to engage and stimulate the reader throughout.

Two versions of As I Lay Dying
The Vintage Classics edition of As I Lay Dying is almost lifeless, whereas Trevor Baum’s redesign provides the reader with an emotional experience as they must carry this dying woman in their hands, much like the characters in the novel.

A system can bind the ideas of the writer to the form of the book with these carefully chosen elements, but it’s when the form and the idea become inseparable that unique relationships begin to emerge.

Take for example Do You Know What It Means to Miss New Orleans? that was published by the Chin Music Press back in 2008. The book is focused primarily on the aftermath of Hurricane Katrina and the impact it had on the music, economy and spirit of the city.

Do You Know What It Means to Miss New Orleans? cover
The physical elements of the book act as a rhetorical device, directing the reader with subtlety and charm.

Nineteenth century engravings flourish beside carefully set blocks of text and each page has been lavishly printed on high quality paper. These components, amongst many others, combine to create a distinct sense of pace that sets itself apart from legions of other books. The idea of the book and the form of the book become one  —  they merge into an emotional cornucopia that is impossible to ignore.

Do You Know What It Means to Miss New Orleans? spread
The texture of the page, the subtle typographic details and the distinctive illustrations implies a specific tone and atmosphere.

This is emotional information and it coerces the reader to take notice of the subject and to read each page with as much attention and focus as those that designed and published it.

Another book that provides the reader with emotional information is the Book of war, mortification and love. The author, Ruud Linssen, investigates why people suffer voluntarily whether it be for love, war, religion or art. The blend of fiction and non-fiction, and the haunting accounts of depression and loneliness are only reinforced by the physical elements of the object.

The text also acts as a specimen for the typeface Fakir. This dark blackletter eloquently explains the subject and forewarns the reader of the book’s ghostly nature. It is even printed with the author’s own blood, the ink on the cover blends into the background as if the words are shaking with anxiety.

Book of war, mortification and love page
Texture, ink, type: three dimensions of emotional data that captures the spirit of the writer’s intent.

It’s these extra pieces of information, these tangible components of a unique sensory and visual language that must be pieced together in order to accurately reflect the author’s ideas. It is the format, the texture, and the combination of the printed word and the weight of the object that ignites this special relationship, and aids in the transfer of information between writer and reader. Ideally, these extra pieces of information provide the reader with the unspoken history, idea and argument of the book. Without them, the conversation between the book and the reader would be less interactive and engaging.

Of course, not every book can feel like Do You Know What It Means to Miss New Orleans?, or Book of war, mortification and love – but then why should they? Each book should be treated as a unique problem requiring a distinct and innovative solution.

Emotionless Systems

This is the problem with the current state of ebooks. As e-readers split content numerically or into ‘real’ turning pages they impersonate the form of the book, whilst disregarding the unique nature of the writer’s ideas. This gives us books that all feel and look the same.

The Picture of Dorian Gray and Shit My Dad Says
The Picture of Dorian Gray by Oscar Wilde and Shit My Dad Says by Justin Halpern look and feel the same, but are different in every meaningful way.

The system disregards the writer almost entirely; all ideas have the same graphic character, tone and appearance. But just as unique and brilliant writers follow a certain pattern and rhythm within their work, so too must the visual and sensory elements of a system. This indicates to the reader that the content is one of a kind and worthy of their precious time, but these systems are also capable of creating emotional experiences that can entertain, persuade, teach and inspire.

So the problems on screen are very similar to that of the problems on paper: the system is acting as a barrier into the author’s ideas.

Why Should We Design Emotional Systems?

In a perfect world we would share ideas through a semipermeable membrane; we would absorb ideas via osmosis and send them around the world as casually as we breathe. Sadly, we cannot do this. Instead, we have systems set in place to communicate. The problem is that these systems are failing us. They are hurting us. They are making beautiful things boring and are getting in between us and the ideas that we need.

This is not about nostalgia or the glorification of a particular medium. This is about information, and how best to communicate the content as a visual and sensory device. These systems have an obligation to not only safely and quickly transfer data, but also to make us care.

Of course, this is subjective and very little of this article goes into the specifics as to how to create emotional experiences, but this is because each idea requires a different visual and sensory tone. Some books require explosive typography and thick paper to feel revolutionary, others require a softer and more delicate tone to feel calm or charming.

The form of the book is merely a tool, a sometimes wonderfully beautiful and effective tool, but a tool nonetheless. It is the ideas within that give us wonder, and these tools must be built for their purpose if they are not to be thrown away, lost or forgotten.

We can embed within these systems a lasting piece of our culture if only we are willing to change the way we think. So instead of us asking the question, “How do these things look?� perhaps we should rather be asking, “How do these things feel?�

Further Reading

  • The Crystal Goblet
    The classic essay by Beatrice Warde on the art of printing, still applicable to book and Web design today.
  • Designing for Emotion
    The lead UX designer at MailChimp, Aaron Walter, discusses how emotion can be used in interfaces.
  • On Book Design
    Richard Hendel examines how and why books are designed in the way that they are.

(il)


© Robin Rendle for Smashing Magazine, 2012.


A Look at Inspiring Website Designs of Musicians


  

As with designer’s, musician’s websites are often some of the most creative, and for good reason. The website designs of musicians should ideally epitomize their sound in a visual medium. It should capture their brand in an online presence.

This is a subtle art, which not all musician’s websites master. However, when done effectively you can almost feel the artist’s music flowing through the web page. Often subtle visual details can evoke their music, whether it be a soft pastel gradient, or shocking/emotive background photo.

Today we look at a huge variety of design styles and musicians. These websites are all beautiful, yet all different. It’s really interesting to see the disparity between some of these designs – a visual testament to the diversity of contemporary music.

A Look at Inspiring Website Designs of Musicians

Vladimir Chmelo
Vladimir Chmelo has a fairly simple site structure, with muted tones and formal typography. The design is made all the more interesting by the large photographic background, which not only enhances the visuals of this website, but let’s us see the man behind the name. The reserved color palette suits the classical, serious nature of his music.

Vladimir Chmelo website design

Noise Coalition
A very unusual looking site, but very visually striking. The site acts as almost a kind of cover artwork, with a huge quartered photo manipulation comprising most of the homepage space. The bold red/black combination mixed with the harsh imagery of falling bombs and shattering objects creates a mood of destruction and bleakness. The call to action text ‘DOWNLOAD FOR FREE’ is enhanced by using a bold, red font to encourage action on the users part.

Noise Coalition website design

Jonathan Crehan
A great example of effective background design. Our eye is immediately drawn to the artist who is beautifully lit in this photo. The color scheme is very muted, using rich golds, browns and blacks. The typography is clear and legible, and recent news is promoted via a homepage slider area.

Jonathan Crehan website design

Johan Reinhold
A fantastic web design with a very interactive feel to it. You really need to click through and explore the site yourself to fully experience the details of this design. As you scroll down the page the birds in the background design rise up faster than the surrounding content, creating a sense of weightlessness. The dreamy, pastel colors and elegant imagery make this site very easy on the eyes.

Johan Reinhold website design

Alex Young
A very detailed, nicely designed website. The background is full of intricate details and patterns, and the logo text is incredibly elegant. The central content area is used to promote a free copy of Alex’s latest single, and acts as a great call to action. Overall we get a feeling of sophistication using this website, with no detail overlooked.

Alex Young website design

Bloch
This site is for a music school rather than a specific musician, but I had to include it in this list. It’s a wonderful example of a visual design bringing music to life. The subtle watercolor background is infused with swirling notes, fractal lines and patterns all building around a central photo montage. The featured child appears to be expelling energy and music as the visuals surround them.

Bloch website design

Caring is Cool
A really cute website design featuring a funny illustration as the center piece. The illustration lends a hand drawn feel to the site, and the waving lines in the background feel very abstract. The hand-drawn theme is continued through the site in the sketchy typography and UI.

Caring is Cool website design

Daniel Osborne
Another design with an awesome photographic background. Daniel is the centerpiece in his own design, striking a very cool pose by some drums and vintage cars. The sidebar for the site is concise, but explains clearly what he does and gives easy to navigate menu links.

Daniel Osborne website design

Rivers and Robots
A simple and clean website that’s very easy on the eyes. Rivers and Robots uses a subtle pastel color scheme along with very faint texture application to add depth and detail. The typography used almost universally across the site has an almost western style feel to it. At any rate, the overwhelming impression of the website is slightly retro.

Rivers and Robots website design

Brad Doyle
Brad Doyle uses a very simple site that is essentially an image map. However, it definitely feels quite interactive and gives a sense of the artist. The navigation is spread across the wall backdrop photo and you can click the various hanging images to browse through the site.

Brad Doyle website design

More Hazards More Heroes
One of the most creative designs in this post, More Hazards More Heroes use some really nicely designed elements in their website. Their logo text is hand-drawn and natural feeling. Their content areas often use creative, rough edges. The main background is comprised of a very faint line art, which helps bring the content together and add a sense of artistry.

More Hazards More Heroes website design

Miss the Stars
Lovely typography and awesome colors. The pink and blue color palette works great together and the central content slider is really eye catching. The background design is really well constructed and layers up multiple photos, textures and lightings to create a detailed, attractive backdrop for the site.

Miss the Stars website design

Buty
Another very creative web design with a sketchy feel to it. Buty’s website uses abstract shapes to construct content areas, breaking, rather than adhering to any kind of content grid. Visuals are given a bold white border which makes them appear like a paper cut out. There are also some great animations happening, such as birds flying across the page constantly.

Buty website design

The Blur Division
The first thing that strikes you about this design is the deep blue background gradient. This is accented by the smoke in the top-right of the page, which adds some nice lighting. Overall the design is fairly minimal, but the colors and typography work beautifully together. The logo is also a great concept, with the word ‘BLUR’ being out of focus.

The Blur Division website design

Fernandinho – Sou Feliz
Fernandinho Sou Feliz’s website has a real grungy feel to it. The rough background textures and faded photo in the backdrop create a worn look. The menu and logo typography are also typically grungy, which is enhanced by grunge elements strewn across the page such as the top-right badge design.

Fernandinho - Sou Feliz website design

Not Done Yet…

We are halfway through the showcase, but don’t stop yet. You can click through to see the rest of the examples and read more about them here.


Google authorship profile: A do or don’t for design professionals?

Google is the world’s largest business directory – any search brings up a huge number of competing organisations trying to get noticed.  As more traffic is driven by Google each day, it is becoming a necessity to stand out in search listings.

 

Since June 2011, you may have noticed pictures of authors next to search results for their articles. These authors have linked their work to their Google profiles in an effort to attract more clicks – a picture and byline can draw attention towards a page, and can link to other work by that person.

John Resig Search result

There are obvious potential benefits to a Google authorship profile – a photo and name are eye-catching and will make a website stand out next to other search results, but some have suggested that it isn’t worth it.

Having your name and picture displayed in search results requires setting up an account on Google plus, the search engine’s answer to Facebook. Authorship has been criticised as just one way for the search engine to use its domination to promote Google plus.

Tying your professional design work to your Google profile can make some people uneasy, especially if you use Google plus in a social capacity – mixing your personal and professional life online can be a concern for some people.

However, there are other benefits to having an authorship profile beyond seeing your picture next to search results. As Google gives better rankings to websites linked to Google profiles, authorship can boost your visibility to potential clients. Perhaps most importantly, a Google profile makes your work more personal – if a client can see who is behind a website, they will feel a more personal connection, and may feel more comfortable hiring you.

Slash Gear article written by Chris Burns

Your Google profile can also display a wide range of other design projects you have done, in effect an online portfolio.

A Google authorship profile does require work to set up, and a degree of professionalism on your authorship profile, but the advantage of adding a personal touch to your work will make it worth it for many.

How to set up a Google authorship profile

First, you need to set up a Google plus profile at plus.google.com. Fill in your details, including a professional picture and some of your details. For Google to verify you as a legitimate author, your profile must be fleshed out with some detail about you, but edit your privacy settings to make sure that certain private details, such as your telephone number, are not made public. The more active you are on Google plus, the more Google will trust you, resulting in higher search rankings.

When editing your profile, add the websites where your content is hosted to the ‘contributor to’ box. You must then link your website to your Google plus profile, which can be done by providing an email address that links to your website, or by adding some simple code to your website.

Google will then take some time to verify you as the author of the work, but eventually your authorship profile will show up alongside your search listings.

The post Google authorship profile: A do or don’t for design professionals? appeared first on Design Reviver.


  •   
  • Copyright © 1996-2010 BlogmyQuery - BMQ. All rights reserved.
    iDream theme by Templates Next | Powered by WordPress