Desfocagem progressiva e gradientes no Hana

Eleva os teus designs com desfocagens e gradientes que dão nas vistas

Abrir o Hana

As desfocagens progressivas tornaram-se populares com a estética de vidro das interfaces do iOS há alguns anos e, recentemente, ganharam força nas ferramentas de design de interfaces. No entanto, continuaram a ser sobretudo uma técnica complexa, difícil de usar em motion design ou em ambientes interativos em tempo real.

Hoje, lançamos no Hana as desfocagens progressivas em tempo real. Pela primeira vez, este tipo de desfocagem está disponível para uso em tempo real, com controlos intuitivos e sem necessidade de conhecimentos técnicos, tudo dentro do canvas de design infinito do Hana.

Podes brincar com a cena abaixo para ver como funciona.

Passa o cursor ou toca para interagir (experiência feita com o Hana)

Como adicionar desfocagem progressiva no Hana

Podes selecionar qualquer camada e adicionar uma Layer Blur ou uma Background Blur. Em ambos os casos, podes escolher se a desfocagem é uniforme ou progressiva.

Uma desfocagem progressiva funciona praticamente como um gradiente, mas, em vez de cor, faz a transição entre dois valores de raio de desfocagem.

É assim que funciona a desfocagem progressiva no Hana

Gradientes suaves no Hana

Já podes criar gradientes no Hana. Podes escolher entre gradientes lineares, radiais ou polares e ajustar a posição diretamente no canvas.

Apresentamos também os gradientes suaves, que usam uma interpolação Smooth Step para produzir uma mistura mais natural entre as cores. A maioria das ferramentas de design usa gradientes com interpolação linear, o que produz as habituais quebras entre cada cor de "paragem" do gradiente.

Implementámos os gradientes suaves primeiro no editor 3D do Spline, há alguns anos, e agora trazemo-los para o Hana.

Passa o cursor ou toca para interagir (experiência feita com o Hana)

Importação de SVG e muito mais

Nas últimas semanas, lançámos também várias melhorias no Hana, incluindo o suporte para ficheiros SVG (agora basta arrastar e largar), um melhor desempenho e um runtime mais pequeno.

Acrescentámos ainda várias melhorias de usabilidade, incluindo um melhor comportamento do seletor de cores, ferramentas de seleção melhoradas e inúmeras pequenas correções para tornar a experiência mais consistente.

Experiências feitas com o Hana

Experimenta já!

Aqui tens um ficheiro do Spline Hana para explorares as capacidades da desfocagem progressiva e dos gradientes.

Os fluxos de trabalho de design estão a evoluir

Embora simples na sua essência, estas novas funcionalidades permitem um controlo e resultados criativos como nunca antes.

Animar ou criar interações em tempo real como estas nunca foi fácil, e agora podes fazê-lo em poucos segundos com o Hana.

Mal podemos esperar para ver o que vais criar!

—

A equipa do Spline

Saber mais

Mais do blog