[PT-BR] Todos os assets utilizados foram disponibilizados durante o curso de Motion Design Essencial ministrado pela Layer Lemonade. A música utilizada, Deep Future Garage, pode ser encontrada aqui e é disponibilizada gratuitamente no Pixabay. [EN] All assets used were made available during the Essential Motion Design course administered by Layer Lemonade. The song used, Deep Future Garage, can be found here and is available for free on Pixabay.
[PT- BR]
Com o objetivo de aprimorar a usabilidade de uma interface fictícia criada para estudo na escola de motion Layer Lemonade realizei algumas modificações na organização da interface durante meus estudos. Sendo os principais pontos:
* Redução do uso de animações, devido à sua natureza direcionativa.
* Restruturação da disposição das informações, à fim de trazer maior clareza à elas.
* Modificação da aplicação de cores, à fim de gerar um todo mais engajado.
Na primeira página, “Welcome”, comecei por associar o ícone de perfil como head de uma fictícia “pasta de login”, característica que estabeleci através do mascaramento das outras informações, que seriam posteriormente reveladas junto ao movimento da barra de fundo inicial, a qual teria sua função modificada para botão de “Sign In”.
A intenção inicial foi estabelecer melhor comodidade e aconchego ao antigo usuário que retorna ao aplicativo e, para isso, além da associação “Welcome” - “Sign In”, as cores utilizadas buscaram relembrar o fundo da página, gerando descanso e um pouco de monotonia, traduzido como costume.
O fluxo da página segue até o surgimento do botão “Sign Up”.
Utilizando as cores propostas anteriormente pelo projeto, o botão Sign Up surge de maneira contrastante, como um elemento mais quente dentro de uma composição repleta de tons escuros, buscando estimular a adesão do novo usuário.
As informações dessa maneira parecem estar bem mais distinguíveis para o usuário.
[EN]
With the aim of improving the usability of a fictional interface created for studies managed by the Layer Lemonade school, I made some changes to the organization of the interface during my studies. The main points being:
* Reduced use of animations, due to their directional nature.
* Restructuring the arrangement of information, in order to bring greater clarity to it.
* Modification of the application of colors, in order to generate a more engaged whole.
* Restructuring the arrangement of information, in order to bring greater clarity to it.
* Modification of the application of colors, in order to generate a more engaged whole.
On the first page, “Welcome”, I started by associating the profile icon as the head of a fictitious “login folder”, a feature that I established by masking the other information, which would later be revealed along with the movement of the initial background bar, the which would have its function changed to the “Sign In” button.
The initial intention was to establish better comfort and comfort for former users who return to the application and, to this end, in addition to the “Welcome” - “Sign In” association, the colors used sought to recall the background of the page, generating rest and a bit of monotony, translated as usage.
The page flow continues until the “Sign Up” button appears.
Using the colors previously proposed by the project, the "Sign Up" button appears in a contrasting way, as a warmer element within a composition full of dark tones, seeking to encourage new user adoption.
The information this way appears to be much more distinguishable to the user.
[PT-BR]
Extendendo as modificações, durante o processo, realizei a adaptação da estruturação inicial, focada em barras de acesso, para um sistema de swap e barras, buscando facilitar a navegação e integração dos elementos do que, segundo minhas conclusões e observações, seria um aplicativo de streaming e compartilhamento integrado de música (informação não tão clara, devido a natureza do estudo, pautado em prototipagem de UX).
Algumas funcionalidades foram deslocadas ou descartadas, pois julguei que não faziam sentido estar dentro do app ou de abas específicas. Como a funcionalidade “Alarme”, agora inexistente, e a funcionalidade “Música”, agora presente na tela inicial.
[EN]
Extending the modifications, during the process, I adapted the initial structuring, focused on access bars, to a swap and bars system, seeking to facilitate navigation and integration of the elements of what, according to my conclusions and observations, would be a software application. streaming and integrated music sharing (information not so clear, due to the nature of the study, based on UX prototyping).
Some features were moved or discarded, as I thought they didn't make sense to be within the app or specific tabs. Like the “Alarm” functionality, now non-existent, and the “Music” functionality, now present on the home screen.
[PT-BR] Imagem sublinhando mudanças realizadas na disposição das informações no aplicativo. Da área de perfil foram removidos o alarme e a aba de música, sendo a última deslocada para a página inicial. [EN] Image highlighting changes made to the arrangement of information in the application. The alarm and music tab were removed from the profile area, the latter being moved to the home page.
[PT-BR]
Cores novas também foram introduzidas, como as tonalidades ciano esverdeadas à fim de trazer uma resposta mais afirmativa e alto-astral.
[EN]
New colors were also introduced, such as cyan-green tones in order to bring a more affirmative and uplifting response.
[PT-BR] Cores novas também foram introduzidas, como as tonalidades ciano esverdeadas à fim de trazer uma resposta mais afirmativa e alto-astral. [EN] New colors were also introduced, such as cyan-green tones in order to bring a more affirmative and uplifting response.
Com isso, foi possível vislumbrar o papel que um designer de protótipos pode exercer através de seus feedbacks ao localizar problemas e propor soluções, levando em consideração diretrizes de UX e outros conhecimentos presentes em seu dia-a-dia, tais como teoria das cores, gestalt e princípios de design, na busca por um aplicativo com um melhor desempenho.
Obviamente, a maioria das mudanças foram arbitrárias devido à natureza do projeto. Em outras condições, as mudanças levariam em consideração outros aspectos relevantes, como diretrizes estabelecidas para a identidade visual do produto/marca, conceito proposto, entre outros, estabelecidos e documentados em Briefing e a natureza interna da empresa.
[EN]
With this, it was possible to glimpse the role that a prototype designer can play through their feedback when locating problems and proposing solutions, taking into account UX guidelines and other knowledge present in their day-to-day life, such as color theory, gestalt and design principles, in the search for an application with better performance.
Obviously, most of the changes were arbitrary due to the nature of the project. In other conditions, the changes would take into account other relevant aspects, such as guidelines established for the visual identity of the product/brand, proposed concept, among others, established and documented in the Briefing and the internal nature of the company.
