Posts Tagged ‘Showcases’

We are pleased to present below all posts tagged with ‘Showcases’.

Gallery Of Date Stamps And Calendars

Designer's attention to small details often has a significant impact on how visitors perceive the overall design of a web-site. Although users' main focus usually lies on finding information, it's nice to find the content being supported by finest visual details. This holds for favicons, shopping carts, pagination and tag clouds we've covered in our earlier posts. But it also holds for... well, date stamps and calendars. Apparently, the latter are used not only in weblogs, but also on large web-sites where events, news and any kind of time-planning is involved.

Blog Calendar Icon Blog Calendar Icon Blog Calendar Icon Screenshot Blog Calendar Icon

In such designs a tear-off calendar is often used to symbolize the date in a most intuitive way. However, it's not always the case. In fact, designers seem to experiment with a number of different approach one wouldn't really expect from such a tiny design element. Out collection of appealing and interesting calendar icons and date stamps is supposed to prove it. It might provide you with some fresh ideas once you need to design some original date stamp, but don't know where to start from. All images are clickable.

Some of presented examples may not look nice at the first glance, but they all have some idea behind them — an idea you may use and develop further.

You might want to check out the following articles as well:

Read more...

45 More Excellent Blog Designs

We, designers, are creative folks. And being creative, we permanently strive for inspiration — innovative approaches, crazy ideas, smashing concepts and, in general, unique designs which can help us to observe a given problem from a fresh perspective. This is why we always have some fancy design books laying around on our desk, and this is why we enjoy observing other people's work — basically just because we can learn a hell of a lot from them.

There are things one can do a number of times without worrying about becoming boring. For instance, collecting and showcasing excellent blog designs. In this post we do it already the third time. Why? Web design lives in blogs; new developments appear there, that's where the music plays. And that's where you need to look for in order to keep up with current trends and developments.

Screenshot

This post presents 45 excellent blog designs with a perfect layout and unique personal note. We haven't analyzed the content of the blogs; instead we focused on ideas, approaches, graphics and layouts.

If you miss some stunning blog designs in this showcase please let us know in the comments. However, it's also possible that these designs have already been covered in one of our previous showcases:

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.

Screenshot Shopping Cart

Screenshot Shopping Cart

Screenshot Shopping Cart

Screenshot Shopping Cart

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...

Isn’t it sweet? Mascots in Modern Web Design

The more emotional a site design is, the more likely it is to evoke positive feelings within its visitors. To achieve a lasting impression, designers tend to use visual cues and offer some eye candy for hurried and hectic users. E.g. vibrant color schemes, photos and illustrations can be used to draw user's attention to some specific site section.

But are there any further options? Yes, there are. Actually, mascots are traditional for sports competitions such as Football World Championship or Olympic Games. Mascot is a more or less nicely designed creature which is symbolic for something and is supposed to evoke sympathy and strengthen the sense of belonging to one single team.

Mascot Screenshot

Should Smashing Magazine have a mascot? We’d like to know your opinion. If yes, how should it look like? Please let us know in the poll below and in the comments!

Read more...

Hand-Drawing Style In Modern Web Design

The most valuable and innovative ideas had all been handwritten first. That's no big news, since designers tend to produce first sketches as paper prototypes anyway; still it's important, because web design is different from "usual" design. Of course, it also has a personal note and it is hand-made, however users can't see that. As CSS is "boxy but good", designs tend to have a rather limited appearance — they are too boxy and too right-angled.

If designers want to achieve a different design, they have to draw their sites by themselves — or at least some parts of it. And in fact, this is done quite often: whether a blog, a shop, an ad, a private page, or some collaborative project — doesn't matter whether with Flash or (X)HTML. The main purpose of hand-drawn elements lies in their ability to convey a personality and an individual note in times when colorful, sharp and rounded Web 2.0 elements can be found almost everywhere.

Screenshot

How impressive can the results be? And when can the hand-drawing style be used? Let's take a look at some excellent examples of hand-drawing style in modern web design. All screenshots can be clicked and lead to the sites from which they've been taken.

Read more...

Favicons Episode 5: The Delicate Beauties

The New Year's Eve is a tricky time for designers. Some of us eagerly analyze deadlines, define milestones and refine the time schedule for the upcoming year. The other ones discover the need to update footers and copyright statements on their web-sites (by the way, have you actually replaced "2007" with "2008" in your footer?). Still, even on the January 1st passionate designers continue to strive for inspiration in order to come up with fresh ideas for the ongoing projects.

If the latter is your case, is there really a better way to find the inspiration rather than in a fine gallery of excellent favicons - our not that secret and very lively passion? We've written a lot about favicons in the previous articles. If you'd like to find more inspiration or find out more about how they are actually created, take a closer look at the following articles and showcases:

Below you'll find more examples of an excellent favicon design; we've collected these delicate beauties over the last three months.

Favicon

Favicon

Favicon

Favicon

Please notice that the favicons weren't chosen simply because of their beauty; it's been important to us that the favicon perfectly fits to the overall site design. All favicons are linked to the sites where they are used — you can click on them to get more insights into how favicon design can be related to the layout design.

Read more...

Dilectio: A Smashing WordPress Theme

Update (22.12.2007): the theme had some comment errors; Elena has just fixed them. Please download the new version, you'll find the links below.

Over the last year Elena Gafita, the creative mind behind Design Disease team, has designed a number of free WordPress themes, as the Smashing WordPress Theme we released as a present for our readers during our One-Year-Anniversary in September'07. Afterwards we've contacted Elena and asked if it's possible to design another Wordpress theme for our readers. Elena agreed.

After we've discussed the details of the design and the main aims we wanted to achieve, Elena started to do her magic. The result is a fresh, clean, user-friendly and playful Wordpress theme "Dilectio" — a smashing Christmas present for Smashing Magazine readers. In the following, Elena describes how the design was created and what the theme has to offer.

Dilectio

Please notice that all images in the article are clickable and lead to the demo-version of the theme. You'll find the preview- and download-links in the end of the article. There you'll also find a bonus present for our Smashing readers.

Read more...

Paper Strips Menus

The beauty of an excellent design lies in designer's attention to smallest details. Conventions are our friends; however, to stand out, a design needs a creative spin, an elegant play of colors, some unique flavour — a small detail that would make a big difference.

Where the boundaries between traditional solutions and unusual approaches become fuzzy, designers tend to get creative. However, to come up with unusual ideas isn't that easy, particularly if you are dealing with some daily routine-tasks.

Paper Strips Menu
Deb Sofield sticks posts on a paper pile.

Still, nothing is impossible. Even if you're designing a navigation menu there are a number of possibilites you can explore. For instance, have you ever thought of... navigation in form of paper strips?

Read more...

Pagination Gallery: Examples And Good Practices

Structure and hierarchy reduce complexity and improve readability. The more organized your articles or web-sites are, the easier it is for users to follow your arguments and get the message you are trying to deliver. On the Web this can be done in a variety of ways.

In body copy headlines and enumerations are usually used to present the information as logically separated data chunks. An alternative solution is pagination, a mechanism which provides users with additional navigation options for browsing through single parts of the given article. Parts of the article are usually referred to by numbers, hints, arrows as well as "previous" and "next"-buttons.

Search engines almost always use pagination; newspapers tend to make use of it for navigation through the parts of rather large articles. And there are situations when pagination is also necessary for weblogs. Additional navigation can simplify the access to some site pages — e.g. make it easier for users to browse through the archives of the site.

In most cases pagination is better than traditional "previous - next" navigation as it offers visitors a more quick and convenient navigation through the site. It's not a must, but a useful nice-to-have-feature.

Apple Store
Misal
Flickr

Let's take a look at the good practices of pagination design as well as some examples of when and how the pagination is usually implemented.

Read more...

Tag Clouds Gallery: Examples And Good Practices

Compared to conventional navigation patterns tag clouds don't necessarily offer a more convenient and intuitive navigation. However, used properly, they can provide visitors with an instant illustration of the main topics, giving a very specific and precise orientation of the site's content. Since human beings tend to think in concepts and models, it's easier to get an idea of presented content if the main concepts are given straight away — in digestible pieces, and prioritized by their weight. In fact, the main advantage of tag clouds lies in their ability to highlight the most important or/and popular subjects dynamically which is not the case in conventional navigation menus.

Tag clouds offer a quite interesting approach for site navigation; although the technique is sometimes considered to be an "alternative", it shouldn't replace the "common" navigation but support it giving users additional clues about the content of the site. Due to their "cloudy" form the design of tag clouds sets them apart from other design elements on a page. And although designers don't really have that much choice in designing them, they still find their ways to break through the bounds of creativity and come up with some unusual approaches and solutions.

Screenshot Tagcloud

Screenshot Tagcloud

This article offers some selected examples of tag clouds, its shortcomings and also some suggestions for tagging data and links in a more profound and effective way.

Read more...

↑ Back to top