Showing posts with label flat design. Show all posts
Showing posts with label flat design. Show all posts

Tuesday, September 3, 2013

Re: FLAT out loud: Flat Design versus Skeumorphism?

The more I think about this topic, the harder it is for me to write down my thoughts on it. Flat design on skeumorphism? Crunchy peanut butter or smooth? Toilet paper facing inside or out? Mac or windows? The list goes on and on...or so I thought. When I first read Shirley's post and began thinking about which style of design I prefer, I immediately thought I was a flat design type of girl. I am drawn to clean crisp features in a design, nothing so extreme as to cause any chance of confusion (at least when I am looking at designs, I tend to overdo when I am working on my own first drafts). But as I started researching I found my division between the two styles is not so clear. I too found the article Antoinette sited (Flat Design: An In Depth Look), and I was on board, that is until it got to the "Buttons" section.

As stated both design styles work (Windows created an entire phone line with "flat" buttons), but over and over again I find myself adding those skeumorphic features, the gradient, the drop shadow, the shine, to my web buttons.

Nokia Lumia 1020
After some thought I have come to the conclusion that it just depends on the context of the design. I think you need to know about the goal and overall look of your design before you can choose the style: flat or skeumorphic. With the Windows phone, the entire screen is a grid of buttons. There is no need to make them anything but flat because it would feel too cluttered. To have 12 buttons "popping" out at you on one 4.5 inch screen is more then overwhelming. However, when I design web buttons, the button is usually intertwined with a slew of information. The small rectangle needs to stand out on the page somehow.

Then there is print advertising. I have noticed that a lot of the debate between flat design and skeumorphism comes when talking about designing user interfaces, but why is skeumorphism "tacky" on the web and not in a magazine? Is it because the paper the skeumorphic ad is on is tangible like the design visual? A computer screen and phone screen were initially made for looking (let's not get into the new touch screen fad). Ones initial instinct is not to reach out and touch the screens wooden "texture," but a magazine page or poster has that possibility. I like the advertisements that you have to touch because they are so life like you do not know if it is actually textured or and illustrated texture (as long as it does not take away from the message). I also like the advertisements that are clear and right in your face. Again, the side of the line I stand on is a bit wobbly; I am a smooth peanut butter girl, unless I dip into it with just a spoon - you have to spice it up once in a while.

Friday, August 30, 2013

FLAT out loud: Flat Design versus Skeumorphism?


Terms You Need to Know:
Flat design- simple shapes, colors, and typography to emphasize clarity and usability.
Skeumorphism- visual trickery, or the use of details and ornamentation to make one thing look like another.  Skeuomorphism in UI design usually refers to a digital element designed to look like something from the physical world. 
Consider:
Rumored for September 10, 2013,  Apple will release iOS 7 to the public.  As a result, there is an increasing discussion on flat design versus skeumorphism. Flat designs are more noticeably used in user interface (UI) designs.  I noticed the trend in print advertisements. Flat design is seen in an advertisement for Sephora's Living Proof hair serum (Glamour, September 2013).  Also, I saw the use of flat design in the print advertisement for the Thought Leaders panel discussion (Entrepreneur, September 2013).

Sephora advertisement
Thought Leaders advertisement

Flat design offers crisp and clean design. Nevertheless, it may not always produce the maximum effect intended for the targeted audiences.  I feel that the use of visual trickery, or the use of details and ornamentation to make one thing look like another (skeumorphism) not only helps to present details and beautify the craft but it offers designers the ability to bring new concepts into reality. Mazda uses this method for a print advertisement (Entrepreneur, September 2013). What do you think about flat design versus skeumorphism?
Mazda advertisement

References:
Campbell-Dollaghan, Kelsey. What is Flat Design? http://gizmodo.com/what-is-flat-design-508963228 May 24, 2013.
Smith, Grace. 36 High-Quality Flat Design Resources http://mashable.com/2013/07/29/flat-design-ui-kits/  July 29, 2013