O bokeh e o design plano são compatíveis?


9

Gostaria de saber se é correto usar um estilo de bokeh de fundo e combiná-lo com o design plano de conteúdo?

Algo como:

insira a descrição da imagem aqui


4
Bem-vindo ao GD.SE. Eu não acho que existem regras rígidas.
Joojaa

Haha, obrigado pelo seu comentário incrível: D Choca quando você o vê?
Zooly

Nesse caso, ele realmente não funciona 100%, mas eu digo que são mais as imagens particulares. Pode funcionar com uma combinação melhor e fora do curso apropriado. Ainda não é tão ruim assim. (para ne seus mais as cores)
joojaa

Claro, eu só deu o primeiro bokeh eu encontrei, e a primeira cor plana na minha mente ^^
Zooly

3
Esta é uma questão puramente subjetiva em sua maior parte.
DA01

Respostas:


5

Bokeh e design plano certamente podem funcionar bem. Não é incomum ver o design plano usado com imagens com propriedades semelhantes, como texturas sutis ou fotografias com foco suave.

Mas é preciso ter cuidado, porque você está confundindo a distinção de primeiro plano / plano de fundo perfeitamente nítida que obtém com um design plano. Isso é particularmente verdade no bokeh, com seus grandes pontos potencialmente atraentes.

  • Parte do objetivo do design plano é que é simples, limpo, organizado e claro para onde procurar. Você deve tomar cuidado para que os efeitos do bokeh não quebrem isso. Certifique-se de que seja sutil e tenha ainda mais espaço em branco do que normalmente em torno dos elementos que devem se destacar como primeiro plano. Existe a quantidade certa de espaço em branco no seu exemplo.
  • Você precisará ter cuidado com o funcionamento dos relacionamentos de cores. O design plano tende a precisar de cores simples e consistentes que se destacem claramente , e você precisará ter cuidado para que o fundo colorido do bokeh não reduza isso. Por exemplo, no seu exemplo, diminuiria o contraste e a saturação do plano de fundo para que o primeiro plano fique mais claro e nítido, e tenha cuidado com a localização dos pontos brilhantes em relação ao conteúdo (saiba que você terá controle limitado sobre isso em um design responsivo).
  • É bastante comum ver grandes fotografias de "splash" de foco claro / "herói" como conteúdo de primeiro plano usado em design plano. Se você estiver fazendo isso, precisará levar em consideração o fato de que eles não se destacarão tão nitidamente quanto em um plano de fundo limpo. Novamente, é porque você está confundindo levemente a distinção normalmente perfeitamente nítida em primeiro plano / fundo.
  • Todo bom design é orientado pela função sobre a forma - o objetivo das coisas antes de sua estética - e o design plano é tudo sobre isso. Certifique-se de que você sabe por que você está adicionando o bokeh para este projeto em particular e por isso vale a pena os pequenos compromissos.
    • "Parece legal"? Não esta bom o suficiente.
    • "Traz X característica da marca que de outra forma seria perdida"? Melhor.

Certamente pode ser feito para funcionar, mas você precisará levar essas coisas em consideração.


Obrigado pela sua resposta completa! Eu concordo com você, eu precisaria de um argumento para saber por que estou usando esse combo em vez de apenas plano. E ... eu não tenho! Você está certo, eu apenas achei bonito. Pensei que isso traz dinamismo ao meu site (padrão de uma página), mas tenho que experimentá-lo em condições reais e, como você disse, pensar nas diferentes camadas, e escolha as cores perfeitas para acentuar as informações. Obrigado pelo seu ponto de vista;)
Zooly

@HugoTor Como esta resposta indica, o fundo do bokeh pode ser uma má idéia se você estiver usando uma foto grande de herói. Nesse caso, uma boa justificativa para o fundo de bokeh pode ser se você NÃO estiver usando heróis, e você acha que seu design plano sem fundo é visualmente sem graça demais. Nesse caso, pode ser um bom substituto para fotos em primeiro plano, desde que você tenha cuidado para manter o contraste de primeiro plano / plano de fundo.
reconhecedor

9

Design plano não é uma religião

O "design plano" ficou turvo no último ano. Existem muitos designers que o sustentam como algum tipo de sistema dogmático de padrões. E o sucesso do design de materiais (e do Metro da MS, em menor grau) criou mais linhas rígidas imaginárias que realmente não existem.

Flat é o que você faz. O princípio subjacente é evitar o uso excessivo de sombreamento, modelagem ou design visual falso, como vimos com o ckeuomorfismo grotesco da Apple . Isso não significa que sombreamento, textura, fotografia ou decoração de qualquer tipo desapareçam. Você ainda precisa projetar sua interface.

Faça o seu próprio

Em resposta à sua pergunta: Não há regra contra bokeh, fotografia com foco no foco ou outras texturas e imagens de fundo em qualquer estilo de design. É como você interpreta influências estilísticas que fazem uma marca se destacar. Você deve desenvolver um novo dialeto da linguagem visual, sem falar de outra pessoa.

A consideração maior, como outros já apontaram, é a usabilidade. Apenas certifique-se de que sua fotografia não torne a interface uma bagunça confusa. Em alguns casos, é aceitável que o plano de fundo se torne uma parte muito dominante da experiência - apenas certifique-se de obter a "conversão" que deseja, seja lá o que for.

Na natureza

O Windows Metro é sem dúvida um dos exemplos mais simples de Flat na memória recente. E, no entanto, tem coisas assim.

Tela do Windows 8 Weather

O Google Material também é bastante militante em relação ao Flat, mas as imagens grandes são fundamentais para trazer um pouco de humanidade à sua paleta brilhante.

insira a descrição da imagem aqui

O iOS 7 da Apple foi uma tentativa apressada de alcançar o Flatness. Para melhor ou pior, alguém fez com que o desfoque de fundo fosse uma metáfora central do sistema - que é diretamente influenciada pela fotografia bokeh.

insira a descrição da imagem aqui


11
Esta é uma resposta absolutamente excelente.
Lightness Races em Órbita

11
Thx @LightnessRacesinOrbit! Eu acho que este tema merece alguma desmistificar (◠‿◠)
à paisana

Obrigado pela sua resposta incrível. Será que, se eu adicionar um alívio ao meu elemento plano, para distingui-lo, ele se tornará algo como Design de Materiais? O que eu prefiro (nesses exemplos) é o Google App: isso é claro, mas bonito. Se há uma coisa que eu não gosto no Design plano sem fotografia em segundo plano é a simplicidade. Eu acho que pode ser muito chato para o usuário ver apenas quadrado e retângulo.
Zooly

11
Você está no caminho certo. Eu acho que a mesma preocupação é o que a equipe do iOS estava tentando resolver com coisas como desfoque de fundo. Infelizmente, eles acabaram com uma interface mais confusa e menos utilizável. É contra isso que estou advertindo.
à paisana

1

Eu diria: Bokeh e bordas planas (sem preenchimento) funcionam bem. Mas você deve restringir o uso a cabeçalhos e elementos em destaque.

Atualização (desculpe, eu estava com pressa e esqueci de colar o restante da resposta):

Como exemplo, podemos usar o seguinte cabeçalho: drible tiro # 848287

Apesar do bokeh forte, as linhas finas do logotipo + a hora não são muito agressivas e se encaixam bem. Um preenchimento não funcionaria bem (cobriria muito a foto).

Outro exemplo: de @KinaoleCanada

Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.