Windows Style Metro Social Media Icons Set Free For Download

The Metro interface is a highlight of Windows 8. The color blocks represent programs and at the same time display updated information of such programs. Screenshots of this interface soon got uploaded and spread all over the webs. Most people believe this interface is a striking breakthrough of Microsoft that promises to extend the fascination of use of Windows Operation System.

Windows-Style-Metro-Social-Media-Icons-Set

1.  What is Metro UI?

Metro UI is an interface designed based on the arrangement of fonts and square blocks developed by Microsoft. It was firstly designed for Windows Phone 7 and is now applied to Windows 8.

In fact, Metro UI takes inspiration for the design from the signs and boards at a metro station (hence got the name Metro). The signs and boards have contrasting colors, large clear fonts and visual-impact icons. We have actually seen them in Windows Media Center and they are also the main interface of Zune.

2.  Important factors when designing a website to the style of Metro UI:

  1. Notice the fonts: Though optional, it is highly advised that you use Segoe UI font. This font is elegant, beautiful, slim and modern… This is the digital beauty Microsoft has been focusing on.
  2. Notice the colors: If you understand tone values and the principles of tone values, we have nothing further to discuss about this. Otherwise, we should take the color codes of Windows 8 to get the standard tone of values.
  3. Notice the important factors and what’s not. Important ones need to be made salient, put into large colorful hubs, large fonts and vice versa.
  4. “Less is more”. Design the website simple and minimalistic, make some statistic figures and only put in the most important widgets that visitors need. Omit the gifs and other extraneous images.
  5. Notice the blanks: Blanks among parts and blocks are more important than we think as they contribute to creating the interface of the web. We should notice to arrange the parts in lines, or at least, in orders that are easy to manipulate. Putting monotonous objects too close to each other would cause visitors to suffocate and get really confused.
  6. Notice the icons: If you pay enough attention, you would recognize that symbols and icons in Metro style are much different such as Windows Style Metro Social Media Icons Set free for download, arrow buttons left right down up.
  7. Notice the effects. Use smart effects to create smoothness in motion. Refrain from shadow effects, 3D, edging effects or other sophisticated decorative effects so that in the end, the website has a pure modern digital beauty.

 

This is a list of resources (Metrostyle Web UI Kit) we have collected to support designers in developing and designing websites.

 

1. Metro UI Concept Twitter Widget PSD

 

Metro UI Concept Twitter Widget PSD

http://xooplate.com/template/details/11388-metro-ui-concept-twitter-widget-psd

2. 15 Windows Style Metro Social Media Icons Set

 

Windows Style Metro Social Media Icons Set

http://xooplate.com/template/details/11174-15-windows-style-metro-social-media-icons-set

3. Metro Style Windows 8 Icon Pack PNG

 

Metro Style Windows 8 Icon Pack PNG

http://xooplate.com/template/details/6642-metro-style-windows-8-icon-pack-png

4.Simple Elegant Popup Search Box PSD

 

Simple Elegant Popup Search Box PSD

http://xooplate.com/template/details/9009-simple-elegant-popup-search-box-psd

5.Polaris UI Pack

 

Polaris UI Pack

http://www.mediafire.com/?59i84le076w2lgg

6.Metrostyle Web UI Kit (PSD)

 

Metrostyle Web UI Kit (PSD)

http://www.mediafire.com/?1pi8782ffha5dcz

7.Linecons

 

Linecons

http://provide.smashingmagazine.com/Freebies/Linecons-icon-set.zip

8. Metro icon windows metro

 

Metro icon windows metro

http://www.freepik.com/free-psd/metro-icon-windows-metro_671573.htm

9.Metro Social Media Icon Set

 

Metro Social Media Icon Set

http://vanfree.s3.amazonaws.com/metro_iconset.zip

10.Metro Testimonial UI Widget PSD

 

Metro Testimonial UI Widget PSD

http://xooplate.com/template/details/13300-metro-testimonial-ui-widget-psd

11.Metro UI Kit Vol.1

 

Metro UI Kit Vol.1

http://dribbble.com/shots/844722-Metro-UI-Kit-Vol-1?list=users

12.Metro UI Kit Vol.2

 

Metro UI Kit Vol.2

http://dribbble.com/shots/937527-Metro-UI-Kit-Vol-2?list=tags&tag=metro

13. Metro Style Calendar PSD

 

Metro Style Calendar PSD

 http://designerfirst.com/web-elements/metro-style-calendar-psd/

, , ,