SSGames - Servidores online de qualidade - Inscreva-se Ja! é entre para nossa comunidade! - Ouça nossa web radio -Veja nossas novidades - Participe dos nossos setores de jogos online - Parcerias aberta fale já com um administrador.

METRO DESIGN

FreddyVsJason
FreddyVsJason
--> Postador Fanático
--> Postador Fanático

Mensagens : 246
Moedas : 3921
Data de inscrição : 24/09/2012

METRO DESIGN Empty METRO DESIGN

Mensagem por FreddyVsJason em Qui 25 Abr 2013 - 18:07

Após o vazamento de algumas imagens e builds da nova versão do Windows, a interface Metro voltou a ser notícia.
Com a revelação do Windows 8, durante a conferência D9, foi confirmada a utilização da Metro UI como base para a interface desse SO. Mas no que consiste esse recurso que nos permite interagir com o sistema operacional? De onde ele veio? Quais são as características que o diferenciam?

O surgimento da Metro UI
A Metro UI (User Interface, ou Interface do Usário) é uma linguagem de design criada pela Microsoft para ser utilizada no seu sistema operacional móvel. Linguagens de design são arquiteturas para a construção de mecanismos que proporcionem interação entre as máquinas e as pessoas.

Atualmente, essa interface é usada no Windows Phone 7 e em alguns softwares da empresa, como o Zune HD e o Office Labs. Entretanto, a primeira aparição da Metro foi no Windows Media Center – ferramenta de gerenciamento multimídia da marca –, favorecendo o texto como forma principal de navegação.

Em sua essência, a Metro UI é baseada nos princípios clássicos da escola suíça de design gráfico. Segundo a Microsoft, o nome dado à linguagem de design representa toda a velocidade, autenticidade e modernidade da tipografia (processo de composição de textos) usada, bem como a constante “movimentação” do seu código – o que nos leva a crer que ele esteja em constante desenvolvimento.

METRO DESIGN 574722
Windows 8 com METRO DESIGN.

via: tecmundo

METRO Design é formado basicamente por quadrados coloridos ou preto e branco, dependente de sua escolha.

O metro design não é complicado e foi implementado mais ainda na web depois do windows 8, pela sua fama, implantar metro design em um site é muito fácil, utilizando apenas HTML, JS, CSS e Imagens você pode fazer um site em metro design...

Veja um simples exemplo: http://www.raafs.tk/ ( Este site não está completo )

A própria microsoft implantou METRO DESIGN em praticamente todos os seus apps recentes, tais como:
http://outlook.com/
http://www.microsoft.com/pt-br/default.aspx

Estes são os exemplos mais simples de metro design.

agora vamos ao código direto.

Para implementar um metro design é só fazer quadrados com efeito hover, bem simples.

Código:
 #quadrado1{
 width:100px;
 height:100px;
 background-color:#000066;
 }
 #quadrado1:hover{
 width:50px
 height:50px;
 background-color:#000077;
 }

Implementar METRO DESIGN é fácil, não tem segredo, são apenas quadrados com efeito hover aparente.
METRO Design não utiliza exclusivamente e somente quadrados, no final do post você encontrará algumas imagens que podem ser usadas.
Implante e mande uma imagem de como ficou seu "site" e irei enviar dicas exclusivas para cada um.

FreddyVsJason - Coordenador SS e METRO UI Designer

Muito básico:

METRO DESIGN Windows_8_icons_very_basic

Transporte:

METRO DESIGN Windows_8_icons_transport

Costura:

METRO DESIGN Windows_8_icons_sewing

Equipamento de acampamento:

METRO DESIGN Windows_8_icons_camping_equipment

Telefonia:

METRO DESIGN Windows_8_icons_phone_operations_statuses

Matemático:

METRO DESIGN Windows_8_icons_mathematic

Decisões:

METRO DESIGN Windows_8_icons_decisions

Setas:

METRO DESIGN Windows_8_icons_arrows

Para hosts:

METRO DESIGN Windows_8_icons_it-infrastructure

Formas de pagamento:

METRO DESIGN Windows_8_icons_payment_methods

Ícones sociais:

METRO DESIGN Windows_8_icons_social_networks

Para designers:

METRO DESIGN Windows_8_icons_adobe_cs
METRO DESIGN Windows_8_icons_programming_file_types

Para hosts 2:

METRO DESIGN Windows_8_icons_natural_UI_overview_pages_operating_systems

Abaixo, extras:

METRO DESIGN Icons-390

METRO DESIGN Icons-390

METRO DESIGN Icons-390



METRO DESIGN Q87CR
• FreddyVsJason sugere:
- Respeite as regras do fórum.

- Fique alerta sempre aos anúncios do fórum.


METRO DESIGN Suppor10
Weslley_Script
Weslley_Script
SS - Fundador
SS - Fundador

Steam Steam : WeslleySSGames
Zello : WeslleySSGames
Mensagens : 7719
Moedas : 1020079
Data de inscrição : 06/10/2011
Idade : 23
Localização : Brasil

METRO DESIGN Empty Re: METRO DESIGN

Mensagem por Weslley_Script em Qui 25 Abr 2013 - 22:39

mt bom continue assim
iZerang_Script
iZerang_Script
--> Postador Iniciante
--> Postador Iniciante

Mensagens : 7
Moedas : 2160
Data de inscrição : 06/07/2013
Idade : 20
Localização : En Paraguay

METRO DESIGN Empty Re: METRO DESIGN

Mensagem por iZerang_Script em Seg 2 Set 2013 - 2:51

Não é apenas isso, pois tambem é usado HTML5 e CSS3 ... Mais boa iniciativa.
FreddyVsJason
FreddyVsJason
--> Postador Fanático
--> Postador Fanático

Mensagens : 246
Moedas : 3921
Data de inscrição : 24/09/2012

METRO DESIGN Empty Re: METRO DESIGN

Mensagem por FreddyVsJason em Qui 12 Set 2013 - 21:35

@iZerang_Script escreveu:Não é apenas isso, pois tambem é usado HTML5 e CSS3 ... Mais boa iniciativa.
E eu disse o que !?

Não quero discutir com noob, então please.



METRO DESIGN Q87CR
• FreddyVsJason sugere:
- Respeite as regras do fórum.

- Fique alerta sempre aos anúncios do fórum.


METRO DESIGN Suppor10

Conteúdo patrocinado

METRO DESIGN Empty Re: METRO DESIGN

Mensagem por Conteúdo patrocinado


    Data/hora atual: Dom 26 Maio 2019 - 11:08

    Copyright © SSGamers 2011/2018 - DIREITOS RESERVADOS PARA COMUNIDADE SSGAMERS S.A.