Projetos UX/UI

Histórico

O termo UX/UI foi popularizado nos anos 90 por Don Norman no periodo de trabalho na Apple. UX (User eXperience) está relacionado com a interações do usuário e seus desejos. Já UI (User Interface) é a maneira como o usuário alcançara essa experiência.

UX se preocupa em melhorar a experiência em todos os pontos de contato com seus produtos, da primeira interação na loja, no tamanho da caixa até sua instalação. Ui se encarrega da tarefa de materializar a experiência do usuário como a interface gráfica, posições dos botões, cores, alertas,etc.

Esse artigo é um resumo do curso da USP no site Coursera,UX/UI: Fundamentos para o design de interface.

Semana 1

Introdução

DefiniçÕes de UX/UI UX –> centrado na experiëncia do usuário. UI –> centrado na interface que faz interação com o usuário.

Desafios:

• Por que? Motivos para uso do produto por parte do usuário.
• O que? Descreve todas as coisas que podemos fazer com o produto.
• Como? Desenvolvimento das funcionalidades de forma acessivel e uma interface atraente.

Semana 2

Brainstorming, tecnica criada nos anos 50 e popularizado nos anos 90 pela IDEO.

• O primeiro passo é limitar o numero de participantes e manter o foco.
• Evitar as criticas das sugestões dos colegas, a intenção é construir ideias sobre ideias de outros. Priorizar a quantidade e coordenar exposição.
• Valorizar o esforço, não somente o resultado.
• Para ajudar usar ferramenta MESCRAI onde cada letra tem um significado:

Modificar (aumentar, diminuir um elemento) Eliminar (eliminar itens, peça única ao invés de várias) Substituir (trocar materiais, cores, acabamento) Combinar (adicionar mais de uma função no mesmo produto) Rearranjar (mudar a ordem ou movimento dos itens) Adaptar (adaptar para novos outros usos, ou limitações do usuário ou do ambiente) Inverter (mudar o escopo do ambiente de interno para externo, mudar a posição de vertical para horizontal, Modo claro para escuro).

Crazy 8’s é uma metodologia utilizada pela equipe do Google.Voce escolhe a ideia mais promissora que foi desenhada pela equipe e tenta fazer oito variações dela em apenas oito minutos. Usar uma folha A4 e dividi-la em oito partes. Escolher a ideia principal e desenhar oito variações pra ela oito minutos.

Fundamentos

• UX Project Checklist (site) - https://uxchecklist.github.io/

• The Elements of User Experience: User-Centered Design for the Web and Beyond (livro) - https://goo.gl/RRQyrs

• UX não é um título, é um estilo de vida! (texto) - https://goo.gl/UaAB1a

• User Experience Careers (livro) - https://goo.gl/29gywz

• Por onde começar na área de UX? (texto) - https://goo.gl/dEUR2o

• Novos Fundamentos do Design (livro) - https://goo.gl/Z8uTN1

• Curso de Design Gráfico. Princípios e Práticas (livro) - https://goo.gl/ef6MZj

• Exploring the “Planning Fallacy”: Why People Underestimate Their Task Completion Times (texto) - https://goo.gl/nTv9ZY

• Creativity in Groups (Research on Managing Groups and Teams) (livro) - https://goo.gl/DfYg1G

• UXtools (site) - https://uxtools.co/tools/design

Ferramentas de Designer

• Sketch (ferramenta) - https://www.sketchapp.com/

• Figma (ferramenta) - https://www.figma.com/

• Adobe photoshop (ferramenta) - https://www.adobe.com/br/products/photoshop.html?promoid=PC1PQQ5T&mv=other

• Adobe illustrator (ferramenta) - https://www.adobe.com/br/products/illustrator.html?promoid=PGRQQLFS&mv=other

• Adobe xd (ferramenta) - https://www.adobe.com/br/products/xd.html?promoid=PYPVQ3HN&mv=other

• Affinity Designer (ferramenta) - https://affinity.serif.com/pt-br/

• Framer (ferramenta) - https://framer.com/

• Gravit Designer (ferramenta) - https://www.designer.io/

• Axure (ferramenta) - https://www.axure.com/

Ferramentas de Prototipação

• Principle (ferramenta) - http://principleformac.com/

• Adobe xd (ferramenta) - https://www.adobe.com/br/products/xd.html?promoid=PYPVQ3HN&mv=other

• Proto.io (ferramenta) - proto.io

• Flinto (ferramenta) - https://www.flinto.com/

• Framer (ferramenta) - https://framer.com/

• Marvel (ferramenta) - https://marvelapp.com/

• Figma (ferramenta) - https://www.figma.com/

• InVision (ferramenta) - https://www.invisionapp.com/

• Axure (ferramenta) - https://www.axure.com/

Ferramentas de Entregas

• Zeplin (ferramenta) - https://zeplin.io/

• Specctr (ferramenta) - https://specctr.com/cloud/home

• Simply (ferramenta) - https://sympli.io/

• UXpin (ferramenta) - https://www.uxpin.com/

• InVision (ferramenta) - https://www.invisionapp.com/

• Avocode (ferramenta) - https://avocode.com/

• Marvel (ferramenta) - https://marvelapp.com/

• Figma (ferramenta) - https://www.figma.com/

Ferramentas de Monitoramento

• Smartlook (ferramenta) - https://www.smartlook.com/pt/

• Hotjar (ferramenta) - https://www.hotjar.com/

• Jaco (ferramenta) - http://www.getjaco.com/

• Fullstory (ferramenta) - https://www.fullstory.com/

Documentos

• UX/UI: Fundamentos para o design de interface

Links

• Guia Linux Guia Linux
• DIFF UX vs UI Diferença entre UX e UI.
• Taqtile Blog Artigos sobre desenvolvimento de projetos.
• Forum NEU Nucleo Empreendedorismo da USP.
• Nielsen Norman Group
• Baymard Institute
• UX Design CC
• UX movement
• UX planet
• UX.blog
• User interface enineering
• Amazon Livro Applied Imagination de Alex Osbor sobre BrainStorming.
• MESCAI Metodo MESCAI.
• C2TI Testar Mobile Design.
• CANVAS Crie, Colabore e Compartilhe.

Perguntas Mais Frequentes

• ← Previous Post
• Next Post →