30+ Inspirational Designs of the Year
As we move into the New Year, it is a important to review what happened in the design community in 2011. However, unlike usual surveys, I will do so by reviewing the notable designs of the year. Although it’s impossible to review all the designs from 2012—I don’t claim to do so either—I’ve tried to select the best from deeply reviewed designs (approximately 2,000 designs) by considering different factors, include beauty, functionality, usability, and so forth. As these selected websites are from different categories and types, this survey could be regarded as a comprehensive overview.
I hope this provides you with a beneficial collection that inspires you to design new websites while revealing trends and designers’ tendencies in recent months. Finally, don’t fort to share with us designs that you think are inspirational for others and should be included on this list.
Let’s review them.
Jenier World of Teas
Jenierteas’s website is a good example of perfect design. It takes into account both beauty and efficiency. Its advantages include its consistent color scheme plus call-to-action button and the use of the UX design pattern (sliders and dynamic tabs). Moreover its well-positioned search box (top-right) and sign up for newsletter box (bottom-left) makes it more usable. Here, everything is in its place.
Replenish
This interesting and clean design appropriately uses colors. The introduction block with descriptive icons and link to video just below it are clearly visible. The right fixed section of the design works as a supplementary introduction block. The website also takes advantage of the footer, including useful links.
Team Treehouse
Sometimes there is no need to include extra, useless information on the page. Teamtreehouse’s site uses minimal design, incorporating only essential information into their clean and elegant design, such as how it works and testimonials from users. This example epitomizes the new and functional trend in minimal design.
Tao Community
Initially this very creative and amazing website seems to be difficult to navigate, but the single line of text at the bottom is simply descriptive. Of course this type of design isn’t appropriate for most cases, but there are some ideas that could be inspirational, like the news section at the bottom and the position of the menu.
Yogi
In this example, we can see harmony among the different parts of design. Colors, ornaments, and even buttons all share some similarities, which provides a sense of uniformity. Also, they don’t forget the essential elements: search box, menu items in the top and bottom section, and sociality. The end result is a simple but pretty and usable design.
Movmt Studio
This clean, minimal, and creative design uses sliders in a creative way with an additional navigation aid. The introduction at the top of the page and service items below the slider are well positioned and visible. Such a design is well-suited for studios and design companies.
Thomas Aull
Personal websites—especially those designers—are always the source of new trends and innovative ideas. This well-designed single-page website incorporates several creative ideas, such as the background in the top section and contact section at the bottom.
Capital Camp
In addition to its color scheme and well-organized content, this site uses typographical elements with different typefaces, weights, and colors in all sections of design to enhance the readability and attractiveness.
Iphone-icon
Simplicity, simplicity, simplicity! This site demonstrates how a simple design can be beautiful. The role of the call to action button and (relatively) huge typography in its prominence shouldn’t be neglected.
Agcchicago
Agcchicago’s page length is greater than the usual length of single-page designs, but it cleverly compensates for this with a consistent and meaningful look and feel. In addition to its creative idea, typography plays a key role. The colors are appropriately selected in connection with context.
Medialoot
In the field of commercial websites design, there are some must-have features: a call to action button and huge typography to catch and drive visitors’ eye to the important sections as well as testimonials and steps depicting the main process. In addition to applying these features, Medialoot uses its footer in a good manner, including a space to sign up for their newsletter, an about section, and a neat site map, thereby saving users’ time and eliminating unnecessary pages.
Gesture Theory
Gesturetheory showcases minimalism in all aspects. Both the contents and color scheme give users a sense of minimal design. On the other hand, the slider-based structure of site also takes advantage of minimalism—this time in using pages. It eliminates page load time. This idea could be integrated into almost any project (for an example, see cakephp.org).
Fish Restaurant Charleston
This design could be regarded as a pattern for such a situation when there is no extra content on the site to share with users. However, essential information exists that visitors probably need, like the address and operation time. It has a well-organized footer, too. All in all it strikes a balance between aesthetics and functionality.
Truetea
Truetea’s layout is based on illustrations, and this conformity can be seen in different parts of the design, even in the social connection icons. The color scheme is very well-selected and harmonizes with the context. The creative slider shouldn’t be overlooked.
Ilovespoon
I’m not alone in this opinion that Flash is the number one tool for crafting innovative websites (even with the advent and improvement of powerful JavaScript libraries). However, this doesn’t mean that every flash-based design is a good one. More than ability, it needs fertile ideas—which is what Ilovespoon’s site took advantage of. One of its most important features is the fixed footer at the bottom of the screen that contains remarkable items (e.g., menu, subscription form).
The Gifts Project
Layout and design aren’t the only important features for commercial websites; others include a descriptive introduction, video demo/intro, and listing features of product(s). When the website should convince visitors to buy the product or service, testimonials are also needed. Regarding all of these issues, Giftsproject’s website is walking on the edge of perfectness.
Beanstalk
As with the previous example, this is another well-organized business website. The above-the-fold design here is very notable.
Column Five Media
This good example of design provides a page full of useful information despite having small amounts of content. This illustrates a realization of clichéd theory: less is more. To achieve such a result, the information structure of the website should be planned thoughtfully. Pay close attention to the role of white space in this design.
Fresh.. Not Canned
This interesting, creative, and beautiful design makes use of a relatively unusual layout compared to most designs out there, making this beautiful design seem effortless.
Susanna Ceccherini
Just as we expect from an artist, this website incorporates a minimal, creative, and artistic design. Here the home page serves as the intro page as well as other pages! In fact, it’s a single-page design, unlike the conventional pattern used for design.
UFeedMeBack
This website is included in this collection because of its simple and clean design. The home page is divided into several sections in a beautiful manner. Moreover, separating the header and footer using different colors from other sections works well.
StartingBloc
Keep in mind, whenever you put your creative ideas into practice, do your best to guide users as this will definitely increase usability. This website provides a good example of this. Again we can see the fixed footer along the bottom of the screen. In lengthy designs, this approach seems necessary.
Mark Strauss
This year I found many designs that used a human picture (portrait) in their layout—an unprecedented tendency. Mark Strauss’s single-page portfolio is one the most creative and best designed examples.
DanielCrisp
2011 was full of representations of designs that showcased HTML 5 features and designers’ abilities as well. This example is one the best designed websites with the new version of HTML and showed off the capability of HTML 5 (and Daniel) for designing Flash-like sites.
Joshua Sortino
As previously stated, designers’ websites often serve as inspirations for others because of the novel ideas they incorporate into them. Joshua Sortino’s website uses interesting ideas and an inspirational layout.
Nathan Rafter
Another common trend nowadays is parallax design. Of course, such sites are usually well-suited for portfolios and personal use. Nathan Rafter has one of the best designed examples of parallax. He also designed a really amazing background that promotes design overall.
Deep Time
Unlike others in this collection, Deeptime is in fact a web app or, as it implies, an interactive infographic. The underlying concepts as well as the creative usage of HTML 5 are main reasons for its inclusion here.
BrixiaExpo
In this single-page website we are able to see several UX design patterns and techniques that are skillfully mixed together. The major factor in this design is the creativity of its designer(s).
Bronco
This website demonstrates that we do not need either complex, strange layouts or several color schemes to design a great website. A simple but thoughtful layout accompanied by well-selected colors creates a nice design. Good idea, good job!
RavenTools
The Raventools website uses a medley design, something between a single-page design and a multi-page design. In fact it’s a single-page design, but at the bottom we can see some additional links to other pages. It includes everything a business website needs. The further efficient use of call to action buttons and typography in proper places really promotes the design.
Sumit Paul
The only thing I would like to say about this website is that it is another highly ranked representation of modern minimal designs. The well-structured layout plus attractive color scheme warranted its place in this review.
Analogue Baby
Here, the illustrations on the home page are everything, and some of the main parts of design are integrated into it. The overall design tried to be unusual, as indicated by the navigation items on the left.
Html5cut
Without a doubt, one of the five best single-page websites of the year is HTML5Cut. Everything is in its place, and no additional or useless information is included. It incredibly mixes several pages into one, even without the need to scroll. It’s a minimal design from the perspective of the number of pages. In other words, it’s an all-in-one page design rather than a simple single page. What a nice and functional design.
Jon Montenegro
A text-based introduction page is the best description for Jonmontenegro’s homepage. Although the readability may be lower than expected, the information presented is useful and introduces the designer’s abilities and areas of work. The creative idea behind of the design is very noteworthy.
These designs are awesome!
The one which i really like is Media Loot. Simply awesome.
excellent inspiration designs, thanks
thanks for nice designs
When it comes to professionalism and uniqueness, these collections are on the list. The entire designs are well done with different theme i think. This is really amaze me.
Oh! These are amazing designs. I have totally impressed by these designs. Thanks to Mohammad for sharing these impressive designs. Keep updating.
beautiful inspirations, design must go on.
Thank you. it’s nice
Jon Montenegro’s site is just mindblowing…
How come Tree House make into this list???
Is it somewhat a paid adv or a PR stunt???
I can’t see nothing attractive in them…
So good collection, thanks for sharing
This is so good, thanks a lot