arquivo

Arquivo da tag: design

Fonte: http://youtu.be/Ji7YorM_t_0

Anúncios

O conceito de design responsivo não é uma grande novidade, mas tem chamado bastante atenção nos últimos tempos com o crescimento do mercado de dispositivos móveis, principalmente por conta dos tablets e celulares de tamanhos e resoluções cada vez mais variadas.

Só para você saber, o layout do Midiatismo é um exemplo de design responsivo.

Neste novo contexto dos navegadores e várias resoluções, o design responsivo surge como uma evolução lógica do design de sites, também conhecido como web design. Antes grande parte da internet era acessada por resoluções e navegadores muito semelhantes. Até pouco tempo atrás bastava fazer um site que funcionava em Internet Explorer com resolução máxima de 1024×768 pixels que tudo estava resolvido, claro existiam outras características, mas a grande maioria estava nesse mesmo grupo – no máximo havia os usuários de Mozilla Firefox. Hoje tudo mudou, temos TVs de 50″ polegadas acessando internet, temos celulares que tem telas de 2″ até 5″, tablets de 6″ até 11″ polegadas e sem contar os próprios computadores, que tem telas de netbook até os mais novos iMacs da Apple, colocando uma margem de 11″ até 26″ polegadas.

midiatismo design responsivo exemplo 640x312 Design Responsivo: Entenda o que é a técnica e como ela funciona.
Layout do Midiatismo utiliza a técnica de design responsivo. Clique para ampliar.

Esta característica demonstra que um site pode ser visto de diversas formas e em diversos contextos, e é para isto que os sites devem estar preparados. O design responsivo, como o próprio nome já indica, consegue responder ao tamanho da tela para se adequar da melhor forma. Ao invés de criar dois sites separados, um para mobile e um para desktops, como era muito comum hoje, você faz apenas um site que vai se adaptar muito bem a qualquer tela em que ele for carregado.

Você faz um site responsivo ou vai fazer dez sites diferentes

Uma das principais vantagens do design responsivo também se torna um grande problema para as agências digitais. Se você quer que o seu site esteja adaptado aos celulares, smartphones, tablets, notebooks, desktops e TVs, você provavelmente teria que fazer pelo menos 5 sites diferentes. A evolução do design responsivo mudou bastante isto, conseguindo trazer a vantagens de ter diversos sites para um só lugar.

Mas esta facilidade de adaptação também cria um problema para as agências digitais e todos aqueles profissionais que trabalham no desenvolvimento de sites. Como cobrar um site com design responsivo? Você deve somar o valor de vários serviços ou deve ter um valor diferenciado? Você deve oferecer design responsivo em pacotes diferenciados onde cada um tem foco em certos dispositivos?

responsive templates 640x260 Design Responsivo: Entenda o que é a técnica e como ela funciona.
Entendendo como o layout responsivo se comporta.
Clique para ampliar.

Claro que o design responsivo não resolve todos os problemas e talvez nem seja a solução para todos, mas definitivamente é um caminho a ser seguido e ainda mais explorado. Muitos defendem que o melhor caminho ainda é um site dedicado a cada dispositivo que pode – e deve – se aproveitar de técnicas de design responsivo.

Há também quem aponte que o design responsivo não é a solução completa, já que ainda não consegue ser totalmente otimizado aos celulares (principalmente no quesito peso e velocidade de carregamento), mas ainda parece ser a melhor solução em relação a custo benefício.

A importância da adoção de padrões na internet

Apesar da existência dos padrões da W3C para tentar igualar as ferramentas baseadas em web, quem desenvolve para web sabe que os padrões não são assim tão padronizados – quem diga o Internet Explorer.

Hoje em dia não há apenas dois navegadores centrais para você se preocupar. Até pouco tempo atrás você fazia o site funcionar no Firefox e – com muito trabalho – no Internet Explorer 6 e 7. Hoje temos Internet Explorer (7, 8, 9 e 10), Firefox, Google Chrome (Desktop, tablet e celular), Safari, Opera (desde desktop até o da televisão) e vários navegadores menores. Tudo isso sem contar a proliferação de sistemas operacionais, hoje em dia não existe “apenas” o Windows, também devemos nos preocupar com o Mac, Linux, Android, iOs, Windows Phone e por aí vai.

A adoção e evolução dos padrões de internet nunca foram tão necessárias como estão sendo agora.

meme testando navegadores 466x400 Design Responsivo: Entenda o que é a técnica e como ela funciona.Meme do desenvolvedor de websites.

 

Fonte: http://www.midiatismo.com.br/o-mobile/design-responsivo-entenda-o-que-e-a-tecnica-e-como-ela-funciona

Flat design, ou “design plano”, é uma estética visual de interface que deixa de lado tudo que seja desnecessário visualmente. Sombras, drop shadows, relevos, texturas e gradientes são deixados para trás, favorecendo layouts limpos, tipografia nítida e cores sólidas. Similar ao Microsoft’s Metro UI, essa nova tendência em design visual vem adquirindo cada vez mais adeptos, que seguem ao pé da letra a máxima “menos é mais”.

O estilo vem sendo tão adotado que existe até um site de curadoria de sites que utilizam como estética o flat design. Se você busca seguir essa linha, é importante lembrar que por mais que “menos seja mais”, é preciso ter cuidado para que sua interface não acabe ficando “sem graça”. Tons pastéis são bastante utilizados, mas também é importante adicionar cores que gerem contraste, para destacar elementos de ação como botões. Saber utilizar de forma correta cores, fontes, pesos tipográficos, formas geométricas é essencial para que o seu layout gere ação no usuário, e que ele não fique apenas como expectador de algo bonito.

Sendo assim, nós resolvemos fazer uma seleção dos melhores sites que podem te inspirar em seu próximo projeto. Se você é apaixonado por estudo das cores, tipografia e formas, vale a pena estudar as bases de um bom flat design.

Shape

Osbourne Barr

Data Driven London

Designed to Move

Lean Analytics Workshop

Relancio

26 people

Musixapp_pixels

Preview-big

Flat_roman_typeface___ui_bigger

Big

Website

Cesarzeppini-2013

Fonte: http://chocoladesign.com/tendencias-de-ui-flat-design

Se existe uma coisa que nos deixa obcecados aqui na Shutterstock – talvez até mais do que imagens inspiradoras – é informação. Mais precisamente dados. Acrescente a essa obsessão o fato de que licenciamos mais imagens do que qualquer outra empresa de banco de imagem e você terá como resultado um infográfico com excelentes previsões de tendências em design.

Não sei se vocês sabem, mas nosso primeiro infográfico foi criado em 2011, em versão única em inglês. Este ano, além de termos uma versão em português, resolvemos ser um pouco mais detalhistas e acrescentar mais informações, imagens e um olhar mais aprofundado sobre o que vai ser tendência em 2013. Portanto, confira abaixo nosso infográfico completo e leia, a seguir, alguns dos nossos destaques.

infografico_final

 

Veja a seguir alguns de nossos destaques:

1. Viva a Cauda Longa! Nossas Top 50 Imagens do ano representaram apenas 180k de todos os downloads. Essa é uma pequena fração dos downloads em geral, o que significa que profissionais da comunicação estão, cada vez mais, à procura de imagens diversificadas para contar suas histórias.

2. Fotografia e vetor na briga pelo pódio. 36 das 50 imagens mais baixadas no ano passado eram vetoriais, enquanto 11 eram fotos e apenas 3 ilustrações. Mas antes de trocar sua câmera por um tablet, saiba que fotos ainda são responsáveis pelo dobro do número de downloads em geral, se comparadas com vetores.

3. Obsessão por rótulos. Rótulos de todos os tamanhos, formas e estilos foram bastante populares no ano de 2012. Dê uma olhada nestes rótulos de confeitarias/padarias ou nos de estilo vitoriano.

4. Texturas, padronagens e estampas. De montão! Elas foram destaque em quase todos os mercados em 2012, mas principalmente na Austrália; ficando o design retrô e as estampas abstratas do tipo bokeh entre os top downloads da categoria.

5. E o Brasil continua na moda. O Brasil tem tudo para ser o gigante do design em 2013. Com um gostinho por imagens abstratas e pelo cubismo, nosso país está na vanguarda do design este ano. Quer saber mais?Então dê uma olhada nos nossos Top 20 Downloads.

6. Da Rússia com amor. A Rússia vem consolidando seu espaço no mundo da moda e de ensaios fotográficos com algumas das imagens mais incríveis do mundo. Exemplo? Conheça o trabalho de MGV e Serov e você irá entender o que estamos falando.

7. Seja “verde”! Ser “verde” pode até não ser uma tendência nova, mas agora, ao invés de simplesmente ser “verde”, as pessoas estão à procura de termos mais específicos, como “sustentável” ou “eco-friendly” (em inglês mesmo). Veja nossa coleção de imagens “verdes” favoritas.

8. Vintage, vintage e mais vintage! Se a gente somar todas as buscas por “gatos”, “cães”, “retrô” e “hipster”, não conseguiremos superar o número de buscas por “vintage”. Anos 70, retrô e imagens ornamentadas continuarão a dominar o mercado este ano.

9. Abstraia. Formas geométricas e abstratas também estão em ascensão. De pessoas pixeladas a rótulos 3D, acesse aqui algumas das nossas imagens prediletas.

10. Menos é mais. A Alemanha talvez seja o epicentro de uma das maiores tendências do ano: o minimalismo. Provando que menos pode ser mais com imagens impressionantes.

Gostou? Conte para a gente qual a tendência recente que você mais curtiu. Faltou alguma coisa que você gostaria de ter visto aqui?

Fonte: http://luzz.me/infografico-tendencias-globais-de-design-shutterstock-2013/