Smashing Magazine we smash you with the information that will make your life easier. really.

Award-Winning Newspaper Designs

Print and Web are different. Traditional layout techniques from print, particularly an advanced formatting, aren’t applicable to the Web as CSS doesn’t offer sophisticated instruments to design such layouts (e.g. text floating around an embedded image; some “floating” techniques provide such results, however they produce bloated source code just as well).

At the same time the flexibility of the Web is hardly applicable to print as there is no way to customize a traditional periodical for reader’s convenience. Apart from that, online-reading is very different from offline-reading: in the latter both leading and the line length are usually much shorter.

However, there are a number of fundamental principles which are often being used in both media. Over the last years newspapers and web-sites started to apply similar principles of data presentation, such as the heavy use of white space and grid-based design. The results can sometimes be very similar, but often they have almost nothing at common.

This issue of monday inspiration series is supposed to provide you with some examples of outstanding newspaper designs which have been rewarded with prestigious awards (see references at the bottom of this post), and demonstrate unusual approaches of newspaper design.

Please notice that

• you might want to take a look at the article Data Visualization and Infographics we’ve presented previously,
• all images are clickable and lead to the sources from which they’ve been taken.

Read more...

Shopping Carts Gallery: Examples and Good Practices

Imagine that you are designing an online-store. Since stakeholders are only interested in the number of sells, the success of your work directly depends on how well you manage to drive users to the “Checkout”-button. In this case you might want to consider some design approaches which will set you apart from your competitors. After all, the probability that they’ve done it wrongly is extremely high.

One of the simplest examples of flawed design decisions is the incorrect use of the shopping cart icon — a traditional icon which stands for the virtual holding place for any products of the store. Used properly, this little yet powerful element can help users to buy a product as quickly and painless as possible. As such, it is essential for the purchasing procedure and therefore deserves to be considered carefully during the design process.

In this post we present attractive, creative and user-friendly shopping carts, bags, trolleys, buckets and baskets — any kind of carts as they are used in the online-stores. Besides, we also cover related creative ideas, design approaches and usability guidelines.

Read more...

Adobe Illustrator Tutorials - Best Of

Over years Adobe Illustrator has become the standard application when it comes to illustration design. Artists, illustrators and graphic designers use Illustrator to create vector-based graphics which — contrary to raster-based editors such as Adobe Photoshop — can be easily rescaled without the loss of quality. E.g., Illustrator is often used to quickly transform hand-drawn sketches on a sheet of paper into lively and colorful digital images.

However, to master Adobe Illustrator isn’t easy; and the creating process of professional illustrations requires both time and patience. Therefore tutorials can turn out to be real life- and time-savers as they show exactly what needs to be done in order to create professional illustrations and how masters of illustration actually manage to do their magic. One year ago we’ve presented a hand-picked collection of Illustrator tutorials. Now it’s time for a fresh portion of healthy and creative Illustrator material.

In this post we present a collection of excellent Adobe Illustrator tutorials for beginners and advanced designers. The new selection isn’t enormous, but big enough to provide you with some good starting points.

Please notice that

• we’ve selected only those tutorials which haven’t been featured last year or were released after the article was published.
• you might also be interested in Adobe Photoshop Tutorials - Best Of we’ve presented few weeks ago.

Read more...

15 Stunning Cutting-Edge Gadgets and Technologies

We live in a spectacular time. The pace of technology steadily increases, new fields of science are heavily explored and innovative concepts emerge almost every day, resulting in stunning and overwhelming products. The impact of these products can be tremendous: in fact, new technology can completely revolutionize the way we play, communicate, work and live our lives. Some of these products are just eye-candy, some are useful, some are visionary and some may become revolutionary in the next years.

In this post we present 15 stunning examples of cutting edge technology which is already reality today or will become reality in 2008. Please notice that some videos might not provide you with a concrete idea of what the technology offers, e.g. it’s impossible to display the advantages of 3D-TV using videos produced by a 2D-video-camera.

You might want to take a look at the articles

• User Experience Of The Future which covers innovative developments in field of user interface design and
• Innovative Designs and Devices which covers stunning design concepts and ideas which can become reality in the future.

You have more examples? Comment on this article!

Read more...

Smashing Header Graphics Contest

In many blogs header graphics often takes a prominent position as bloggers try to impress visitors with distinctive and appealing visual elements. In fact, designed properly, header graphics can create an appropriate atmosphere and convey the style the designer has chosen. Well-designed themes can be as useful as templates, particularly if you can download them and experiment with them as you wish. However, you won’t find that many sources on the Web. That’s time to change it.

We’d like to create a small smashing gallery of blog header graphics which every designer could use for free and without any restrictions whatsoever. To achieve this we need the help of our creative visitors. To achieve this we need your help. Which is why we announce a Header Graphics Contest.

Update (02.02.2008): please notice that this contest is not about designing a header for the Smashing Magazine web-site. Your header graphics don’t have to be related to Smashing Magazine at all. This is about sharing your skills with fellows designers and creating a free repository of downloadble header graphics.

Read more...

10 Principles Of Effective Web Design

Usability and the utility, not the visual design, determine the success or failure of a web-site. Since the visitor of the page is the only person who clicks the mouse and therefore decides everything, user-centric design has established as a standard approach for successful and profit-oriented web design. After all, if users can’t use a feature, it might as well not exist.

We aren’t going to discuss the implementation details (e.g. where the search box should be placed) as it has already been done in a number of articles; instead we focus on the main principles, heuristics and approaches for effective web design — approaches which, used properly, can lead to more sophisticated design decisions and simplify the process of perceiving presented information.

Please notice that

• you might be interested in the usability-related articles about 10 Usability Nightmares and 30 Usability Issues we’ve published before,
• we’ll cover more principles of effective design in our following posts. Therefore you might want to subscribe to our RSS-feed.

In order to use the principles properly we first need to understand how users interact with web-sites, how they think and what are the basic patterns of users’ behavior.

Read more...