Noupe

Noupe

Link to Noupe

Printed Web: Print Design Inspired Websites

Posted: 18 Jan 2012 01:05 AM PST


  

It seems things are changing for website design. The minimalist style adopted by many websites is slowly being evolved into something a little more engaging. One of the main sources of inspiration for this change in the way website content is displayed has been print design, particularly newspapers and magazines. Here are some fine examples of print design inspired websites.

The Websites

Vogue

Placing an emphasis on striking photography and keeping text to a minimum, the Vogue website perfectly recreates the basic layout of its magazine, showcasing the latest fashion trends.

Armani

A stunningly beautiful website as sharp as the fashion wear, Armani's site’s look pulled straight from a fashion photographer's portfolio. A little text and huge exquisite images seize and hold the visitor's attention.

Hollister

Before you even delve into the content of the Hollister's website you have to admire their ingenious use of the dead space on either side, which looks like a sort of beautiful vintage Indian-style wallpaper. The rest of the site incorporates a wonderful use of shading and delicate colour textures.

Tommy

Digital creative agency Tommy has a fantastic website layout which mimics advertising boards of the past to great effect. Mixing bold headlines and strong colours, on close inspection the site almost has a 'weathered' or 'worn' look to it: retro brilliance.

Waltzing Mouse Stamps

The modest vintage design on the site cleverly represents the nature of their business and the products they sell. The slightly worn and torn Victorian-era wallpaper effect that is subtly added to the banners is one of the most eye-catching features.

The New Yorker

The New Yorker is an excellent example of a publication whose website retains the trademark aesthetic, most notably the famous typography, of its print magazine, from the features to the cartoons.

IDesign

We should expect a firm specialising in designing websites and corporate branding to have a stirring website and idesign's magnificent eye catching art nouveau aesthetic lives up to expectations and more.

Roald Dahl

The website for the legendary children's storyteller beautifully replicates the aesthetic of Dahl's famous fun-filled children's books, with the marvellous artwork drawn by long time collaborator Quentin Blake.

Protest Boardwear

Wonderfully recreating the print design of a high quality fashion catalogue, the Protest Boardwear website features large colourful photography showcasing the brand's head turning slope fashion wear.

Urban Survivors

Using huge and beautifully composed photography, the charity's website captures the feel of a photojournal or a series of striking billboards, displaying the plight of unfortunate people in third world countries.

Nike Vision

Nike is famous for pushing the envelope in terms of style, and their Nikevision website uses large sliding images to display their stylish range of eyewear, replicating a high quality catalogue you might pick up in an opticians.

Little White Lies

Little White Lies is a bi-monthly film magazine that shapes and themes its publication around a specific film. The website showcases their stirring graphic design and has digital editions of the magazine to browse.

Targetscope

Texas based marketing firm Targetscope really hit the mark with their website design, which is modelled on American World War II propaganda artwork, delivering the message that their creative team is ready to take command of a client's brand and steer it to victory.

The Dollar Dreadful

Beautiful to look at, the Dollar Dreadful publication has been running since 1882 and displays its stories using the same layout and typography used in the original late nineteenth century mini magazines on the site.

UGS Mag

This independent hip hop magazine celebrates rap music using a clear and colourful magazine layout that balances graphics, photography and text to stunning effect, creating a cool and vibrant web experience.

Voyager

The minimalist aesthetic and clear layout of BMI's Voyager website perfectly replicates the in flight magazine. Uncluttered and nicely balanced, the information and features are easy to access and read.

Rolling Stone

The famous showbiz magazine is another example of a website that accurately replicates their print publication. Showcasing the latest news in music, film and politics, the site is simple to navigate and has a clear layout balancing image and text.

CultureLabel

CultureLabel is a different kind of gift site that sells products solely from museums and art galleries. The design of the website mirrors the art focused aesthetic by letting the imagery do the talking. This is also accompanied by lush, matted typography scattered throughout the site.

I-D Mag

Extremely simple and effective, the online version of i-d magazine has a clear scrolling blog design that enables visitors to scan the news stories displayed with an equally sized photograph and introductory text.

Antique Piano Shop

The Antique Piano Shop is dedicated to raising awareness of the need to preserve pianos from the last two centuries as valuable historical artifacts. Their website's layout, typography and artwork beautifully capture the look of piano and organ catalogues and brochures from the past.

Squint Limited

Squint Limited is a fine epitome of Shoreditch and the website does further justice to the products with its portfolio of images that do all the talking. The grey-on-grey text, coupled with the use of gradient in the menu and product boxes adds to the stunning minimalist feel throughout.

Bob & Blossom

Intricate spacing and light pastel colours complements the array of baby clothing strewn over the site.

The Astonishing Adventures of Lord Likely

Resembling a Victorian Viz magazine, The Astonishing Adventures of Lord Likely is a lewd tongue-firmly-in-cheek collection of a rather randy Victorian aristocratic gentleman's adventures. The typography, layout and writing style of the fake diaries brilliantly mimic a Victorian very-broad sheet.

XLR8R

While styled like a blog, the website for alternative music and culture mag, XLR8R makes intricate use of its layering with subtle grey tones and compliments it further with awesome documentary style photography of featured artists.

Dazed Digital

The stunning looking website for Dazed magazine has a less formal magazine layout, abandoning columns in favour of a cloud of images and text on a scrolling page that resembles the continuously flowing manuscript of a Jack Kerouac novel.

(rb)

Immortal Technique: A Quick Look at Minimalism

Posted: 17 Jan 2012 09:09 AM PST


  

There’s a little bit of murmuring going on that the design technique, most affectionately referred to as minimalism, is dying and/or dead. I couldn’t disagree more. I believe that minimalism is not dead, mainly because people don’t quite realize what it is.

Unfortunately, it seems like people think of it more as a style or trend, rather than what I truly think it is–more of a technique or a loose rubric. The technique is able to conform to different situations–if we are talking web design, you can use minimalism in a portfolio, a webshop or whatever it is that you are designing.

What is Minimalism? What is Design?

The textbook definition of “minimalism” is “design or style in which the simplest and fewest elements are used to create the maximum effect.” If you look up “minimal art”, that is defined as “abstract painting or sculpture in which expressiveness and illusion are minimized by the use of simple geometric shapes, flat colour, and arrangements of ordinary objects.” The latter definition is a bit more specific in talking about an actual style of art, but if we are talking about design, which is a bit of a science more than an art, the two actually go hand in hand.

Design is what you use to order information in a way that is typically aesthetically pleasing. The best designs, are designs that have removed the excess or the fluff–that’s minimalism. If you are designing to make things pretty, then you’re not designing, you’re just decorating.  One of the greatest things I’ve ever heard about typography (which is closely linked to graphic design) is “If you can’t read it, you’ve missed the point.” Similarly, one of the best things I’ve heard about graphic design is, “You know when a design is done not by asking what else you can add, but by asking what can you take away.”

Minimalist Showcase

What people have to realize is there are different levels of minimalism. Of course there are the people who keep it as barebones as possible with only text and some pictures, while some folks just believe in making sure they have a really clean design on their hands. Either way, minimalism should be and is used for most as a basis for design. Whether you have a site dedicated to your thoughts, your work or your product, minimalism can work. Below are a handful of different sites that use a minimalistic attitude.

8Faces

As you can see, here, there is a lot of focus put on the typography and making sure it is legible. Pictures aren’t all over the place, but are neatly set up in their designated spaces.

Best Awards

This site uses some flat color with nice splashes of purple and a great layout to draw your eyes to the most important parts of the website. I’d say this is a site that doesn’t stray too far from the roots of minimalism, while throwing in some nicer, more designer elements.

Collected

What you will notice in a lot of minimal sites is the usage of grids. This grid has no spacing between elements which kind of fills up space and makes it more than what it really is, nevertheless, it’s a wonderful clean website.

CreateDM

This is an example of another extremely clean, extremely focused website. There is absolutely no mistaking what this company produces and what they enjoy.

Eight Hour Day

This site is a bit more intricate. There are a lot more design pieces and a lot more pictures, but they never stray from keeping things focused and fluff free.

HatBox

Without using flat colors, this site really delivers in cleanliness and focus. It seems as if the designer paid most attention to the layout and making precise design decisions within each element, rather than the whole site.

InMotion Massage

This is a website that is pretty close to the core values of minimalism, however there’s a larger usage of color than most ‘traditional’ minimal sites. The layout works extremely well and again, there isn’t a ton of fluff here.

Kin Design

I would say this web design is really reminiscent of the idea of ‘minimal art’ as there is a grid but it’s a bit abstract and extremely geometric. It feels like this designer meshed the idea of minimalism with the same idea used in fine art.

Krista Duran

This website focuses a lot more on design and making things look good, but you can tell that it isn’t the sole purpose of the site’s design. It also makes sense and has a wonderful layout.

La Moulade

La Moulade is one of those super neat one page websites. This site uses a large bit of tricks and artistry on top of the clean minimalism to make their point clear. It’s impossible not to know what the focus is here.

Learn CSS

What’s becoming popular with a lot of brands is making mini-sites that help push one product or service. This seems like it could be a very cluttered site because of the information they are giving, but here the designers did a great job of making everything fluff-free and still presenting the information aesthetically.

Luan Freire Kondo

Another website that mimics the fine art qualities of minimalism; the flat color, abstract interpretations and some geometric shapes. This is an extremely simple and to the point portfolio.

Men’s Dept.

This site kind of uses minimalism more as a trend. When you scroll down there is a nice grid, but it is extremely content rich. However, I think this is a good example of how one can pick and choose how they want to present minimalism.

Modulab

Modulab has a super clean, super minimalist website. There’s not a ton of color (only when necessary) and there’s absolutely no fluff. Great job here.

Pig Bimpin’

This is another site that meshes both ideas of minimalism (the art and the technique) to perfection. It’s argued that sites that are ‘minimalist’ can’t add features such as social media, but they definitely found a nice clean way to do so.

Pillow Company

When you think about e-commerce sites, it’s really easy to have a lot going on and for things to become to busy very quickly. This site actually does have a lot of content, but the designer made a really great effort to clean things up and create a focus for that which is most important.

Shelton Fleming

Here is another site that doesn’t go overboard on the colors. There is a lot of interactivity, and it is presented in a manner that is intuitive to the user.

Solo

This is another very simple site, but the beauty of it comes in the form of it’s intricate design elements. Everything seems to have a central theme so it works together and makes sense.

Weltunit

Though the site doesn’t immediately speak for itself, the design does becomes more evident after some searching on what this company does. The use of gray and the layout really do a lot for this minimalistic design.

W+K

What I like about this site is it uses graphics and pictures in a way that typical minimalists would not use them. It’s definitely pleasing to the eye, everything looks full but the layout and design ensure everything has its own space.

Yoshiharu Ota

This web design is probably what folks think about when discussing ‘minimalism.’ This is a barebones site with absolutely no fluff at all.

(rb)