- monthly subscription or
- one time payment
- cancelable any time
"Tell the chef, the beer is on me."
Newer posts are loading.
You are at the newest post.
Click here to check if anything new just came in.
Click here to check if anything new just came in.
November 25 2013
Showcase of Beautiful Super Minimal Website Designs
The modern day web is all about grabbing your attention, force feeding content and serving up as many ads as possible, so it’s always refreshing to land on a website that has been stripped back to its bare essentials. Today’s showcase of websites features 20 minimal designs that don’t use gimmicks or loud colours, these sites have been lovingly crafted with the basic design principles to allow the content to shine through.
Ten & Bourne
The Office of Jason James
Eone
Mixture
Present Plus
Cultivated Wit
Connect Mania
S.McCade
Derek Boateng
Made Together
The Clocksmiths
OWL
Alexander Collin
R∓Co.
Thomas Cullen Design
Frank Chimero
Minimal Monkey
Zofia Chylak
Yaron Schoen
Simon Foster
July 09 2013
The Design of Everyday Things, Keeping it Simple
A while back we posted a list of 8 Books Every Designer Should Read, and among those books was a book I believe is a “must read” for every designer: The Design of Everyday Things by Donald A. Norman. In my opinion the book wrote by Donald A. Norman should be mandatory reading in all design related classes because it shows us amazing examples of good and bad designs, besides explaining through psychology and cognitive science why people like some things and dislike other. Even though the book was published in 1988 (its first version) it is still a masterpiece. His explanations of understanding something to use it seamlessly are really nice.
Since I believe that to deliver better designs we need to understand how people think and what they expect from things, I really liked to read about all Donald’s concepts. It doesn’t matter if you are a web, graphic, product or package designer, you can certainly take some good information from the book.
After reading the book I started paying attention to “everyday things” designed in a simple and minimal way. Things as cutlery, pans, mugs, tables, chairs, etc. Things we know how to use and we know that they don’t need “extra elements or details” to work. Things we know that may be super simple and deliver the same result. This is why I had the idea to gather some everyday things beautifully designed to inspire you.
Here I will show you some examples of beautifully designed products. Products designed in a minimalist way that reinforce that something may be simple and still deliver what it is intent for. Certainly something we can apply to the web and much more. Enjoy.
Cutlery Series by Oji Masanori
Kaiko Cookware Series by Makoto Koizumi
Swing by Jan Kochański
Revolt chair by Ahrend
The Revolt chair was originally designed in 1953 by the Dutch industrial designer Friso Kramer and is a true design classic. This one is a model was reintroduced by Ahrend in 2004.
#3 chair by StudioGorm
Hedy collection by Hannah Morrow
NW3 speakers by Neue Werkstatt
Bulb Fiction by KiBiSi
February 09 2012
Creating Minimalist Designs Makes You a Better Designer
The trend of using minimalist designs has been with us for a while now. It seems like every day major design blogs publish a new gallery of great designs. But do minimalist designs actually mean anything to a designer? Can you become a better web designer by going the minimalist way or is it just a fad?
Actually, I do believe that it is a fad. But at the same time I also believe that you can learn a lot from it and use it to improve your skills significantly.
First of all, minimalist designs are here not without a reason. After the dark age of the ’90s (the dark age of web design, that is) came the year 2000 along with many Flash animations, fancy Photoshop graphics, and all kinds of other clutter. So finally after 20 years of noise a time of calm has come, bringing us this whole minimalism. People simply had enough off all the sites that were impossible to grasp and extremely user-unfriendly.
Minimalist designs change all that and provide a new, friendly environment. There’s nothing else on minimalist websites except for the things that absolutely need to be there. There’s no clutter and no confusion. And the sites are easy to grasp within the first 2 seconds of looking at them.
That is, of course, when done right.
So how can web designers use the trend of minimalism to improve their skills, and how to actually design a minimalist site properly?
Focus attention on the main element
Minimalist designs have very little elements incorporated into them. There’s simply no place for clutter or anything that is not essential to the site’s goal.
This forces designers to choose just one main element that will be the focal point of the whole site.
What can be such an element? It all depends on the site’s goals, but just to give you an example, let’s say that you’re designing a site for a new online service of some kind.
In such a case the main element would probably be the signup form. Consisting of a button, some screenshots, and short copy. You know that you can’t include too many things because the design is meant to be minimalist, so you only have place for the essentials. This will force you to think twice on what is really important for the site and what can be omitted.
Good designers are not the ones who can fill a whole site with stuff, but those who know how to select only the few important elements and forget about the rest.
Get those few elements right
Obviously, minimalist designs incorporate only a handful of elements to convey their message and convince visitors to take action (whatever action it might be).
This forces web designers to get those few elements just right. When working on a minimalist design you can devote more attention to each individual element. You also know that these elements need to be the best they possibly can. Because if they’re not then they’re going to stand out (in a bad way), as there will be nothing to cover them up.
Minimalist design is not about creating a site with just a few elements for the sake of it, but about using the smallest number of elements possible to reach a certain goal. Every element has its purpose in a minimalist design.
You know that you’re doing a good job if there are no more element you can remove without affecting the site’s ability to reach its goals.
Getting everything pixel perfect
This is a strictly graphics-related thing. Minimalist designs have to look exceptionally good. And in order to achieve this you have to make all elements pixel perfect (or at least try to).
Remember, there’s nothing to cover up this one elements that’s not so good looking. Everything needs to be nice or else your main element won’t be the one that’s the most visible … the ugly duckling will.
Crafting minimalist designs teaches you how to be pixel perfect. In fact, there’s no other way of creating a great minimalist design than by doing just that (whatever it might mean to you – there’s no one definition of “pixel perfection”).
Working on your typography
Typography is yet another element of minimalist designs, and probably one of the most important ones.
Since there’s not much to show on a minimalist website the text becomes an element on its own. That’s why choosing the right font, size and decoration is so crucial.
This is an area often neglected by many web designers. In some cases, Arial seems to be perfect for everything, but for minimalist designs it rarely is. Choosing the right font takes time and teaches you the basic rules of typography.
Every minimalist website needs to make a striking impression in terms of typography. If you just choose some random fonts the design won’t make much sense and the visitors will see this. Well, they probably won’t be able to name it, but they will notice.
Learning to use whitespace
Whitespace is one of those things that only the more experienced designers are not afraid to use. Many beginners feel that every piece of HTML real estate needs to be occupied by something, while it’s not the case at all.
When you’re creating a more complex design you get tempted to use every possible piece of space and fill it with that one more element. While it might work in some cases, it surely won’t work for minimalist designs.
Whitespace is yet another crucial element for minimalist designs. The sole fact that a minimalist design uses only a handful of elements forces us to space them out evenly on the site. They can’t just simply be placed all in one place.
The skill of using whitespace is somewhat volatile for web designers. Creating minimalist designs makes you simply better at using it, and this comes handy in every possible piece of design work imaginable.
Standing behind your opinion
In other words, believing that the work you’ve done is the absolute best you could do.
Here’s what I mean. If you’re a freelancer you might be reluctant about delivering a simple design. You might feel that your client won’t be so eager to pay if there are only a handful of elements on the website, and if the form is rather simplistic.
By sticking to minimalism you’re making your skin thick, and you’re learning how to stand behind your designs and be able to explain what their values are.
This is not a strictly design-centered skill, but it’s surely helpful in your freelance career.
Besides, once you learn how to explain the value of minimalist designs to your clients you’ll end up understanding them more yourself. So it’s a win-win scenario.
10 Minimalist examples
What follows is a set of 10 really nice minimalist designs for inspiration.
madebysofa.com
cargocollective.com/christopherose
fellswoop.com
madewithlove.be
thepokerclock.com
eutelnet.biz
soulwire.co.uk/hello
rodrigogalindez.com
theconsult.com
epidemialab.it
What do you think about the whole minimalist design fad? Do you think it’ll stick for more than a couple of years? What will follow?
December 14 2011
A Showcase of Minimal Workstations to Inspire You
The basic idea of minimalism that less is more can also be applied to your workstation, and the result is really inspiring. Clean, minimal and beautiful stations with exactly those things you need to work, nothing more, nothing less. The spaces are simple: desks, a nice chair, your computer and something to give the space a nice personality, it’s all about keeping the space clean, really inspiring.
November 14 2011
meacuppa.be
It’s a one-page, parallax, responsive website for a mobile bakery and coffeebar. ( so be sure to scroll and resize your browser )
Submitted by: @chilli_be
Role: Designer & Developer
This site has a lot of style. The way the photos, colors and type create contrast works really well. The colors are bold and the photos are vibrant and inviting. This is also a good example of how adding some angles can help draw the eye down the page. The large headline font is a bit hard to read, although it’s a really good choice for this design.
I really like that the parallax behavior is very subtle, for the most part the sections fade in and out as you scroll down. It’s very effective. Also, the execution of the responsive behavior is really smooth. There are no awkward breakpoints or other weirdness, it looks intentional at any size.
September 23 2011
Inspiration: Minimalist Posters
Our minimalism tag is filled with eye candy images to help you get inspired remembering that old and wise premise “less is more.” To add content to our tag and to keep showing you good examples of minimal designs that work we decided to show some posters designed by Pedro Vidotto. Pedro is a Graphic Designer and Art Director originally from Brazil who is currently based in London. His background is in Advertising and he has five years of experience working in the industry. Here you will be able to see that quality is better than quantity in design.
September 02 2011
methoddesignlab.com
Method Design Lab’s tagline is “Innovation through design”, and they claim to be the “first accelerator to take a design-centric, user experience driven approach to innovation.”
As an organization that talks about user experience being something that differentiates, they appear to be taking that approach to their homepage. First, you are greeted with a Tetris-style animation of series of block-like things quickly dropping in. Each ‘block’ is a different size and has a different color and contains some text. It took probably 20-30 seconds for the whole thing to load. The whole thing looks kinda cool, it’s clean and minimal with large type, but I just wasn’t sure what I was looking at. It turns out its an aggregated feed of technology links from around the web. They’re organized by color, each of which corresponds to a different hour of the day, and it progressively loads all articles hour by hour. So the later in the day you visit the site, the longer it takes to load. I’m not sure this part was well thought out since loading a whole day takes quite a while. Perhaps it should buffer and only show a few recent hours to prevent a firehose? I’m also not sure what is meant by the different size blocks, since they all seem to be presenting similar info. It may be more aesthetically pleasing, but has no obvious meaning, so I’m not sure what the point is. And when you click on an article, you get a little popup, with maybe only slightly more information than the box (or not) and a link to read the article. And if it’s a tweet, for some reason it strips out links, leaving a bit of text with no context. One last thing that really makes it annoying to use is that if you navigate back to the home page, it reloads the whole thing, going through the whole Tetris thing again.
I realize that Method is probably treating this as an experiment of sorts, just an idea or something fun. And as that it’s totally fine, and I understand that their core mission is not feed aggregation. But I think a better use of their home page would be a clear introduction to what they actually do instead of a gimmicky thing that’s not really useful.
August 04 2011
touchtech.co.nz
This site has a nice feel to it. It has a simple layout with plenty of space and a restrained color palette. The font choice (Helvetica Rounded) is suited particularly well to the subject matter. Along with the cloud graphic, it’s very soft and almost tactile (like a cloud?)
But while it’s clear they do something in regards to mobile development, the main headline is a bit confusing in that I’m not sure off the bat if this is something for developers or whether they are developers. It turns out it’s the latter. I would suggest perhaps changing the word ‘developers’ to ‘development’. Doing that might clear it right up.
I also find it a bit odd how the site actually functions. It doesn’t appear to be a side-scroller at first glance, but it is. And since a user might be just as likely to scroll down as they would be to click a link in the navigation, it’s important to take that into account since what happens if you click on a link is that it horizontally scrolls without taking the user back the top of the page. Which means it might scroll to the bottom of a page you’ve never been on, which is a bit confusing.
All in all those issues are minor in a site that is very well laid out and attractive.
mr.chancegraham.com
Chance’s site may be composed of only a few elements, but they are placed so perfectly it’s clear that every space, color, font, and word was chosen with intent. Such a simple site can be deceiving in that it might seem easy to create. After all, it’s just a few links and a few words. But it takes a mature designer with a good eye for spacing and attention to detail to really make it seem natural and obvious. Once you start going through his portfolio, you see an array of really great work. This is exactly what I think the best portfolio sites should be. Just show me nice big images of a ton of impressive work.
July 08 2011
decoratedplaylists.com
Submitted by: Simon Foster @simonstretch
Role: Designer & Developer
Decorated Playlists is a simple concept site. Basically, Simon makes a playlist on a certain theme, then designs a sort of ‘poster’ around each theme. The designs are simple, usually with a bit of noisy texture, and quite nice. As well designed as they are, this seems like a perfect type of site to try and push some CSS techniques with. I would love to see attempts made on a few of them to achieve the same effect with CSS. I could see a design like the Run for Cover one possibly achievable with css transforms.
July 04 2011
20 New Examples of Minimal Websites
As we mentioned in our last showcase of minimal web designs back in May, minimal layouts are the new black and we are glad about that cause this way we can show you more and more new and inspiring minimal websites. Today we decided to gather a new list of fresh minimal websites to inspire our readers, so enjoy it and remember, less is more.
Pure – Minimal WordPress theme
Assembly
deladee
us design studio
Hocus Focus
vnsaga
Touchtech
Aker Brydge
Nizo
Vonrosen
weltunit
Daily – Dustin Heerkens
Studio Antwork
François Deladerrière
Grain & Gram
Andfold Studio
Ryan Todd
Chance Graham
Infinise
Headlamp
Fox Johnston
Source:
July 01 2011
upperdog.se
Submitted by: Mårten Björk @upperdog_se
Role: Designer & Developer
Me and my colleague made this site using HTML5, CSS3, SVG and responsive design. It’s for our new business – a web agency called Upperdog.
Honestly, I was ready to pan this as being too plain and uninspired. But then I clicked around a bit and it really grew on me. It is very simple, but has just enough cleverness to save it. For one, check out the iPhone graphic as you scroll down. Pointless but fun. The layout is very structured and consistent and has a good rhythm and hierarchy. The site is also responsive. It’s an interesting way to handle the navigation by switching in a select box. I’m not sure that’s the best choice, but it works. It’s a shame that they lose the images for smaller screens, since without them each page is identical and is just a series of blocks of text. Responsive design isn’t just making stuff ‘fit’ on a smaller screen. If you lose what is fundamental to the complete site, you’re also losing a part of what might make a design compelling and effective.
June 30 2011
andrewzellinger.com
I like the simplicity of this site. There are just solid colors without any gradients or drop shadows and just the basic info about what Andrew does. And one way to make a good impression is to just show of your work and up in the top right is a portfolio link. Clicking on this brings up a list of screenshots of some really nice work. It would be nice to have some sort of navigation to jump to each different project but otherwise it’s good way to show them off. One problem I ran into, though, was that the portfolio didn’t work at all in Firefox (3.6). It may well work great in Firefox 4 and it does work fine in Safari/Chrome. However the fonts don’t seem to load quite right in Chrome. These are pretty common browsers so I would imagine that even older ones would have more issues. It’s just something to make sure you really test well across a range of browsers before releasing it into the wild.
June 29 2011
Big Omaha QR Code Game
Submitted by: John Henry Müller
Role: Designer
Selective Perspective Detective Objective or SPDO (pronounced: spee-doh) is a interactive seek and find game for Big Omaha conference.
This is a good example of a pretty simple, straightforward site that manages to come off as very unorthodox through just a couple of little visual ideas carried throughout. The type is simple, bold and a bit reminiscent of Barbara Kruger. The cool factor happens when you scroll and the background stays fixed. It almost achieves an optical illusion type effect, and plays well off of the QR code. The black and white color scheme also helps minimize the innate ugliness of QR codes. All in all, a well executed little site for a fun game.
June 27 2011
studionudge.com
Submitted by: Patrick Flynn @StudioNudge
I believe our site is subtle yet powerful. We went with a one page scrolling website because we feel that will be the next move for upcoming websites. It makes the site easily functional and you never have to load a page after you get to our homepage. As content builds, confusion will not, this is why I believe our design and layout is worthy of a submission.
Studio Nudge is a four-person studio out of Charleston, South Carolina. Their site has a nice flair to it. The handsomely drawn logo sits atop a fairly minimal design with a logical hierarchy, from the recent projects down to the about section. The ‘work’ detail page is very attractive and fleshed out with lots of nice photos. My only quibble is that I would prefer it if the logo stayed in place when you scroll. The fixed navigation is cool, but keeping that nice logo in place along with it would be better.
June 15 2011
danielmall.com
While the home page on Dan Mall’s new site is very clean and minimal with just enough interactivity to make it interesting, the ‘Work’ section is where the site really shines. Each portfolio piece has a really nice bit of chunky text at the top, with left/right arrows for easy navigation. As you scroll down the work is presented in a collage of sorts, followed by nice write up. The layout almost has a magazine (a well designed one) feel. I like it when there is obviously a lot of thought and effort into presenting one’s work and this site delivers on that.
May 09 2011
25 Fresh Examples of Minimalist Web Designs
I believe that we can agree that minimal and clean websites are the new black. Every day people seem to be embracing more and more the idea of less is more. So we decided to gather a new list of minimal and clean websites to show you how designers are showcasing minimalism on websites. And here you will also see some use of color, showing that minimal does not mean colorless.
Craft – WordPress Portfolio Theme
Plastical
Girlfriend
Bestwork
Stephon Vernon Clarke
Snagly
Saville’s
EEHarbor
Adore You
Barnt & Arnst
Jon Montenegro
Holger Huber
Lundgren+Lindqvist
Louise O’Reilly
Ahrens
Atlason
Marlon Medau
iPhone-icon
Jeremy Gleave
Core
Logartis 2011
Corpus
P.A.P.
Unfold
Tinkering Monkey
Source:
May 06 2011
spigotdesign.com
Spigot Design’s site strikes a real nice balance. It’s very clean and clear but has just enough texture to keep it from being sterile. The color selection for the main services ‘badges’ is very inviting and the buttons themselves are very ‘clickable’. Make sure to resize your browser or check it out on your smartphone since it makes nice use of media queries.
March 11 2011
The Secret Of Successful Minimal Font Usage
Minimal fonts can awesomely enhance any artwork if used properly. You can see more and more websites using minimal fonts in their designs. Personally I love the neat look of bold minimal font in a minimal design. In this article you’re going to find some tips together with stunning examples to learn more about minimal font usage in web design. While minimalism seems easy – it really isn’t, it takes great skill to come up with something clean, professional and unique at the same time! Let’s jump into art of minimal fonts?
Bigger Is Better
Since minimal fonts are rather slight you’ll have to use bigger font sizes in order to make your text visible and easy to read. Try to avoid using a font size lower than 14 points. Big and bold minimal serif fonts usually look awesome in headers and plain backgrounds. Large minimal headlines add an interactive look and accent to minimal designs.
Fajne Chlopaki uses huge headlines in his website’s header. The site has a clean and minimal style and these large fonts add a creative look to, and complete, the design.
Contrast
If you’re using minimal fonts be sure not to lose contrast. Try to implement light fonts on a dark background or vice versa. Stronger contrast will make your text easier to read since minimal fonts tend to blend into the background if the contrast is to low. Strong contrast will also enhance the whole look and make the fonts really stand out.
The Visualbox site has a dark background and they’re using white fonts for titles. They’re also using a large font size so the text is very noticeable. These minimal style titles also add a little accent to the design.
Keep It Minimal
Minimal fonts are for minimal usage. They’re neat when used sparingly and in the right situation, though they can look unrefined and clash if you clutter them and use inappropriately. Minimal fonts won’t look good in visually heavy designs. Less is more – they will look great in minimal designs with a lot of white space and few details.
Oliver James Cosling’s portfolio has a clean and minimal look. He’s using a large minimal font for the title and a smaller one for navigation. These fonts look strong and neat and they complement the design excellently.
Limit Your Fonts
Different type of fonts tend to conflict with each other and create a mess within your design. It’s especially true when talking about minimal fonts. Accurate use of fonts can add the right flair and character to your design. Using a select few however will help maintain a consistent look. Two to three fonts is usually good, of course, you can use more however you’ll have to be careful that they don’t cause visual noise.
Adoreyou is an excellent example of effective use of minimal fonts. The site itself is a consistent, well-designed minimal style website. They’re using one minimal font for navigation and another one for the titles. The fonts are perfectly implemented into the design, they’re suitable and engaging at the same time.
Examples
Below you’ll find some stunning examples of minimal font use in web design. Each example is unique so you can see how a wide range of minimal fonts can be used. Check out these examples to learn how to implement minimal fonts effectively.
3. Josh Sender
5. Studio Luma
5. Teixido
7. Samweb
8. Giles Revell
9. Doublenaut
10. Efingo
Fonts
I’ve also collected some nifty, good-looking fonts for you to start enhancing your designs.
1. District Thin
2. Tex Gyre Adventor
3. Cicle
4. Sertig
Minimal Fonts in Web Design: Tips and Inspiration
5. Yanone Kaffeesatz
6. Hattori Hanzo
7. Extravaganzza
8. Tuffy
9. Print Clearly
10. Titillium
Conclusion
I hope you learned something new from these tips and found the examples useful. Remember that minimal fonts are mainly for minimal usage. Don’t exaggerate, though feel free to experiment and achieve new looks. Minimal fonts are subtle but they have a personality which can bring your designs to a whole new level.
February 08 2011
Minimalistic Designs of Consumer Products
Our lives are often inundated with countless things screaming for our attention: media, packaging, signs, the web etc. When we’re searching through the clutter trying to find which product to choose, it’s often magical when our eyes rest on a beautiful, clean, well designed piece. The Minimalist Effect in the Maximalist Market does just that. Created by Antrepo which is a multi-disciplinary design consultancy that derives their power from exciting and passionate design members who are actively contributing to the core of design. Antrepo takes several popular brands, creates a simple variation and a more simplified variation. The result is stunning, clean, simple and powerful. We can only hope that some of these brands embody these principles.
Corn Flakes
Durex
Lindt
Mr Muscle
Nesquik
Nutella
Pringles
Red Bull
Schweppes
Toffifee
Antrepo
Site: Antrepo4.com
Blog: A2591.com
Twitter: @Antrepo
Facebook: Antrepo
Sponsored by
Advertise on Fuel Brand Network.
Fuel Brand Network 2010 cc (creative commons license)
Minimalistic Designs of Consumer Products
Older posts are this way
If this message doesn't go away, click anywhere on the page to continue loading posts.
Could not load more posts
Maybe Soup is currently being updated? I'll try again automatically in a few seconds...
Maybe Soup is currently being updated? I'll try again automatically in a few seconds...
Just a second, loading more posts...
You've reached the end.