Índice:
- Mais imagens e ilustração
- Rolagem horizontal
- Rolagem vertical
- Cabeçalhos corrigidos
- Navegação criativa
- Storytelling
- Navegando em uma página
- Mover-se do flash
- HTML5, CSS3 e JavaScript
- Design Web responsivo
Vídeo: UI Design - Principais estilos de UI Design 2024
Ao usar o Adobe Edge Animate, você pode criar todas as tendências de design listadas aqui. As tendências de design web aqui apresentadas, em sua maior parte, representam não apenas novas técnicas de codificação, mas também novas formas para o seu público interagir com o seu site de forma envolvente. Quando você agarra a atenção do seu público e fica intrigado no seu web design, você está bem no seu caminho para manter esse público.
Mais imagens e ilustração
Você está cansado e entediado de olhar para uma parede de texto? Todas essas imagens e ícones pequenos começam a parecer um pouco datados? Uma cor de fundo sólida faz você bocejar? Se você se sentir assim, há uma boa chance de sua audiência parecer da mesma forma.
Adicionar mais imagens e ilustrações ao seu site pode melhorar muito o seu design web. Para tornar seu site mais atual, adicione uma imagem de fundo sutil ao invés de usar um fundo branco, cinza ou preto.
Você pode facilmente importar imagens para uso com sua composição animada e como trabalhar com elas. Descubra como usar imagens em segundo plano e a diferença entre usar uma tag div e uma tag img para as imagens. Você pode definir predefinições de layout para suas imagens.
Rolagem horizontal
A criação de designs de web com rolagem horizontal pode ter alguma coragem - raramente foi feito - mas isso não significa que não tenha sido feito antes e de grande efeito. Uma simples pesquisa na web de "ótimos sites horizontais" não o deixará desapontado. Você encontrará muitos exemplos excelentes de sites de arte, galerias e sites criativos que usam rolagem horizontal para um grande efeito.
Embora este tipo de navegação ainda seja relativamente novo, criando um site desta forma você poderia colocar-se na liderança do pacote em termos de design web elegante.
Rolagem vertical
Apenas o oposto da rolagem horizontal é a rolagem vertical. Embora a rolagem verticalmente tenha sido uma tendência de design web popular há muitos anos, nos últimos dois ou dois anos, foi muito exagerada.
Muitos sites usam uma técnica de rolagem vertical sem fim que mantém a audiência na página. Este estilo de apresentação interminável é projetado para manter a atenção do público em busca contínua de mais conteúdo.
Cabeçalhos corrigidos
Se você decidir projetar uma página da Web animada usando o método de rolagem vertical sem fim, então você pode querer pensar em adicionar um cabeçalho fixo ao seu site. Um cabeçalho fixo é um menu de navegação que fica na parte superior da página e permanece visível à medida que seu público se desloca pela página.
Este recurso permite que seu público navegue rapidamente de onde eles estão para uma seção diferente do seu site - e sempre saiba onde eles estão.
Um cabeçalho fixo é uma conveniência que seu público pode apreciar porque não precisa percorrer todo o caminho até o topo da página para encontrar o menu. Os recursos que mantêm a conveniência do usuário em mente também manterão seu público em seu site por longos períodos de tempo.
Navegação criativa
Obter criativo com sua navegação é perfeitamente complementar ao usar mais ilustrações e imagens em seus projetos de web. Em vez de um menu de texto básico, use imagens para denotar um link. Depois que seus usuários descobrem que podem clicar em imagens para avançar em seu site, eles se tornarão mais confortáveis com a procura de links em lugares incomuns em seu site.
Esse tipo de interação abre a oportunidade de criar ovos de páscoa em seu site. Um ovo de páscoa, neste contexto, representa um conteúdo aparentemente oculto que pode surpreender e excitar seu público quando eles tropeçam por ele.
Uma ótima maneira de mostrar ao seu público que uma imagem ou um ícone é um link, é usar o recurso de atributo Cursor em Animate. Quando seu público passa o ponteiro do mouse sobre uma imagem vinculada, o cursor pode mudar de um ponteiro para a mão, indicando um link.
Storytelling
Todos adoram uma história atraente. Então, por que não projetar um site ou animação que informe a sua audiência uma história atraente? Em vez de criar um site de restaurante básico que apresenta apenas imagens da comida e descrições de ingredientes, por que não criar uma história de fundo fantasiosa?
Além de listar seus melhores pratos como sendo orgânicos locais, cultiváveis, bens sustentáveis, por que não adicionar uma história sobre o casal que se envolveu entre o prato principal e a sobremesa? Você poderia adicionar uma animação de um anel caindo em uma flauta de champanhe, completa com bolhas crescentes.
Os visitantes do site podem ter chegado ao seu site procurando uma boa refeição, mas eles ficarão para aprender mais sobre o que acontece nas outras mesas. As animações do site Storytelling não só melhoram a apresentação, eles podem se conectar com as experiências de vida dos visitantes.
Navegando em uma página
Sites de uma página - uma vez conhecidos como sites de brochuras - estão fazendo um retorno. Ao manter sua audiência em uma única página que pode assumir a aparência de várias páginas diferentes, você pode aproveitar a tendência de rolagem.
Em vez de clicar em páginas diferentes em uma tentativa de encontrar algo, seu público pode, em vez disso, percorrer seu site à medida que avança no seu conteúdo. Os links que servem de imagens também podem ajudar seu público a pular diretamente para locais específicos no site quando eles sabem o que eles querem - enquanto ainda envolvem alguém que busca casualmente.
Ao criar um site conforme descrito nesta seção, você está realmente aproveitando algumas tendências atuais de design web: rolar informações, usar mais imagens e implementar navegação criativa …
Mover-se do flash
Adobe O flash já foi a onda do futuro, mas essa onda caiu na praia e uma nova onda está entrando.Onde o Flash costumava ser a ferramenta predominante para criar animações e sites, o apogeu dessa ferramenta veio e foi.
Adobe Edge Animate pode não estar pronto para substituir completamente o Flash, mas está a caminho de conseguir exatamente isso. Afinal, você não pode ver o Flash em i-devices, como iPhones e iPads, e quem deseja criar conteúdo que parece quebrado em alguns dos dispositivos móveis mais populares?
HTML5, CSS3 e JavaScript
O mundo das técnicas de design e codificação web está em constante evolução. A grande tendência no código é HTML5 e CSS3, que só se tornará cada vez mais enraizada na web-o-sphere. O Google Chrome está liderando a carga, implementando os padrões mais recentes - com o Firefox e Safari ao lado.
Depois, há o Internet Explorer - atualmente um pouco atrasado na festa - mas a Microsoft está dando grandes passos na atualização do navegador para manter o ritmo.
Proteja a sua animação de aparecer em versões anteriores do Internet Explorer usando o estágio de nível inferior e as diferentes opções de publicação na web que o Edge Animate oferece. Nesse sentido, simplesmente usar o Adobe Edge Animate pode ser considerado uma tendência de design web propriamente dito!
Design Web responsivo
O design web responsivo (RWD) é a última raiva hoje em dia. O conceito por trás do RWD é projetar um site para uso em qualquer número de dispositivos, desde monitores de desktop até tablets para telefones. Enquanto os web designers podem ser divididos em criar um site móvel separadamente de um site da área de trabalho ou para criar um único site que possa responder ao tamanho do navegador, a tendência é inclinada para o acampamento responsivo.
O motivo para isso é bastante simples, criando um site responsivo, você não precisa atualizar dois sites diferentes. Criando pontos RWD na direção do futuro; As técnicas e ferramentas de codificação mais avançadas se tornam, melhor eles trabalharão com o RWD. Considere mais uma vez o Adobe Edge Animate coloca você na vanguarda das tendências de design web.