Antigamente, quando as páginas iniciais animadas e os layouts sofisticados eram comuns, então, com certeza, fazia sentido contratar um designer profissional. Mas a tendência hoje é mínimo - ou pelo menos amplamente simplificado.
Deixe-me dar um exemplo anedótico - um tempo atrás, alguém me pediu para criar uma tela inicial para seu software de PC. Então, eu fiz tudo para fora - desenhei em papel de desenho, importei para o PhotoShop, criei muitas linhas de neon e efeitos sofisticados. Poderia ser um papel de parede da área de trabalho, em vez de uma tela inicial. O que quero dizer é que criei um design realmente sofisticado e elaborado para eles.
Como você provavelmente pode imaginar, eles não gostaram. O design que eles usaram era literalmente um pequeno logotipo de alguns círculos coloridos sobrepostos e o nome do software abaixo dele. Tipo, um trabalho de 2 minutos no PhotoShop. E sabe de uma coisa? Eu meio que tinha que concordar que era melhor que o meu.
O que estou defendendo é o seguinte - acho que os programadores caem na armadilha de cometer o mesmo erro que eu. Tendemos a pensar em interfaces de usuário e telas de abertura que precisam ser coisas realmente sofisticadas e atraentes que tornam o aplicativo se destacarem . Mas eles não precisam ser - honestamente, eles não deveriam ser. Devíamos levar um programadores mentalidade e aplicá-la ao design estético - simples, funcional, funciona.
Neste artigo, veremos algumas maneiras muito simples de criar uma interface de usuário / UX do aplicativo Android elegante, mesmo se você quase não tiver experiência em design.
A menos que você realmente queira algo mais, atenha-se ao design de materiais
Seu aplicativo não precisa ser “ único' e “ se destacar do resto ” para que seja popular e tenha uma boa aparência. É isso que o Google Design material se propuseram a alcançar - um padrão para UIs de aplicativos em toda a indústria, e eles fizeram um bom trabalho Há uma tonelada de aplicativos populares por aí que seguem o Material Design - alguns dos maiores nomes dos aplicativos Android, como SwiftKey, Nova Launcher, Textra SMS, YouTube, só para citar alguns.
O foco principal do Material Design está em um layout baseado em cartão, com uma paleta de cores sólidas. O Google trabalhou com os principais designers da indústria, extraindo muitos elementos de práticas de design minimalistas e, em seguida, lançou tudo de graça - isso é um bom negócio, já que cursos de design de sites e aplicativos podem custar centenas de dólares em e-books, vídeos, etc.
Começar com o Material Design é incrivelmente fácil e há um punhado de ferramentas que o tornam ainda mais simples, que listaremos abaixo:
- Editor de tema de material (macOS + Sketch)
- Plug-in do Material Design Color Palette (PhotoShop / Illustrator)
- Material Design UI Kit PSD (PhotoShop)
- Android Material Design UI Kit ( Esboço)
- Material UI Theme Generator
E se você precisar de inspiração para criar temas simples e elegantes de Material Design, confira esta lista de blogs:
- MaterialDesignBlog - 15 exemplos incríveis de design de material feito da maneira certa
- MockPlus - 12 melhores exemplos de sites de design de materiais para inspirar
- AndroidAuthority - 10 melhores aplicativos de design de materiais para Android
Gradientes de cor são muito mais fáceis do que você pensa
Como alternativa ao Material Design, os gradientes dolor são simples, modernos e atraentes. E você pode pensar que os designers passam muito tempo pintando em todas as cores ou projetando o gradiente final. Você está errado - pode ser feito em 10 segundos no PhotoShop.
10 segundos na IU gradiente do PhotoShop.
Vou até mesmo orientar você sobre isso, para mostrar como é fácil.
Crie um novo projeto PS para celular ( 1080 x 1920 px a 72 ppi funciona bem)
UIGradients.com - Grande coleção de gradientes pré-fabricados.
Vamos para UIGradients.com e encontre algo que você goste.
Copie os valores hexadecimais de cores de UIGradients
Copie as cores gradientes acima da visualização.
Seletor de gradiente do PhotoShop.
Clique com o botão direito em uma camada vazia no PS e vá para Blending Options> Gradient Overlay.
Clique diretamente na visualização do padrão de gradiente no menu suspenso - não clique no botão suspenso. Clicar diretamente no gradiente abre o editor de cores.
Valores hexadecimais de entrada de UIGradient na ferramenta de gradiente PS.
Agora apenas cole e cole os valores hexadecimais da cor de UIGradient no editor de gradiente PS.
Ajuste conforme necessário. Agora você tem um fundo gradiente profissional para seu aplicativo Android.
Outras ferramentas de gradiente que vale a pena conferir:
- WebGradients.com
- Android Shapes Generator ( para gerar formas via XML, com opção de gradiente)
Use SVGs em vez de JPG / PNG
Em vez de usar PNGs ou JPGs para seus elementos gráficos (botões, logotipos, etc.), você realmente deveria usar SVGs ( Gráficos vetoriais escaláveis) em vez de. Isso ocorre porque os SVGs podem ser redimensionados sem perder qualidade - por exemplo, se você aumentar o tamanho de um JPG para um valor maior, ele perde qualidade e fica borrado / pixelado. Um SVG não. As pessoas tentam usar arquivos PNG enormes que serão reduzido para caber nas telas do Android - quando, em vez disso, você pode usar SVGs menores que são aprimorado sem qualquer perda de qualidade.
Além disso, os SVGs podem ter até 60% a 80% menor em tamanho de arquivo do que PNG . Isso significa que seu aplicativo ou site móvel carregará mais rápido para o usuário e terá uma boa aparência, independentemente da resolução da tela.
Incluir um modo escuro usando Theme.AppCompat.DayNight
Você não precisa projetar dois temas separados para incluir um tema de modo escuro / noturno em seu aplicativo. É praticamente integrado à biblioteca AppCompat, você só precisa habilitá-lo e editar os valores.
Veja o guia de Appual “ Como implementar um modo escuro em seu aplicativo Android ”.
Use um modelo ou kit de interface do usuário móvel
Se seu aplicativo não requer uma interface gráfica do usuário sofisticada e personalizada, não há absolutamente nada de errado em usar um modelo ou kit. Modelos e kits podem ser usados como uma orientação inspiradora, ou você pode literalmente apenas usar o modelo / kit como está, adicionando seus próprios botões e outras coisas.
Alguns ótimos recursos para modelos e kits de IU do Android:
- SpeckyBoy - 50 kits de interface do usuário móveis gratuitos para iOS e Android
- SketchAppSources - Recursos de aplicativos de IU do Android ( Esboço)
- Freebiesbug - PSD UI Kits ( PhotoShop)
