pratti
pratti_website_memoire.png

Memoire

dashboard
Interface
category
Iconografia
mockup_hand_pt.png

Introdução

Memoire é um aplicativo de notas e lembretes para Android e foi lançado originalmente em 2016. Essa página dita o processo e as considerações do redesign em 2018.

Início

Dentro da página inicial, conteúdo é o foco. A cor rosa de Memoire é usada em poucos elementos. Usuários também podem escolher entre uma ou duas colunas.


Criar

O aplicativo suporta quatro tipos de notes; estas sendo tarefas, textos, textos com imagens e links. Notas com links funcionam como atalhos.

Novamente, as caracteristicas do aplicativo não interferem com o conteúdo. O botão de edição é branco quando uma cor está sendo usada com o intuito de providenciar contraste.


Etiquetas

A página de etiquetas é simples. Adicionar ou editar etiquetas acontece diretamente nesta tela.


Dia & noite

O tema noturno não só muda as cores primárias, mas as cores de notas também são alteradas. O brilho é reduzido enquanto a saturação é aumentada para garantir legibilidade.

Dia



Noite



Essa mudança também ajudou a minimizar os danos aos olhos devido à luz.


Ícones animados

Animations are one of the core principles of building a modern UI. Not only do they establish a sense of responsiveness, but they can also be used to provide a subtle flourish to the experience. However, animations aren't strictly focused on UI blocks; they can also be applied to icons. Memoire contains several icon animations delegated to important tasks, either displaying state changes but also accompanying transitions to avoid pop-ins and other unwanted breaks in motion.

smartphone
Toque para reproduzir
desktop_windows
Cursor acima para reproduzir
 

1 Coluna | 2 Colunas

Demonstra a mudança de layout.

Pesquisa | Pesquiza por voz

Acompanha a transição entre a página inicial e a página de pesquisa.

Expandir | Minimizar

Usado quando o usuário expande ou minimiza detalhes de itens em notas de tarefas.

 
 

Menu | Fechar

Usado quando o usuário entra em modo de edição na página de tarjas.

Mudar posição | Deletar

Quando as opções avançadas de um item estão visiveis, o ícone de reordenar é transformado no ícone de deletar.

Adicionar | Caixa

Não utilizado devido a problemas técnicos.

 

Interações

Memoire usa folhas como o componente principal para exibir opções contextuais.

Folhas possuem conteúdo dinâmico. Notas de links, por exemplo, funcionam de maneira diferente das outras. Uma imagem prévia é usada como fundo ao invés de cores, substituindo a opção 'Cor' para 'Copiar link'. Para adicionar uma imagem, as opções mudam para 'Tirar foto' e 'Selecionar imagem'.

Se alguma ação precisa de mais passos, estes podem ser exibidos com animações  - no caso de 'Mover' - ou invocados com outras folhas - 'Etiquetas' e 'Escolha uma cor'.


Logo

O objetivo de Memoire é juntar notas, links ou listas que você quer acessar rapidamente. Para ilustrar essa funcionalidade, a metáfora de um caderno foi usada.

Ícone dinâmico (Android 8.0+)

Em aparelhos com Android 8.0+, o ícone de Memoire é feito de duas camadas; a capa e as páginas.


Widget

Memoire também possui um widget que pode ser usado na tela inicial e contém todas as notas de maneira rápida e acessível sem precisar abrir o aplicativo.