13
Simplificando o Design Digital Ui Ux Ai Site

Simplificando o design digital

Embed Size (px)

Citation preview

Simplificando o

Design DigitalUi • Ux • Ai • Site

IntroduçãoO objetivo é explicar alguns conceitos epráticas em design através de imagens.Exemplificando com imagens algumas áreasno meio digital e teórico do design. Aquiusaremos várias analogias que falará umpouco de cada tópico abordado, além detextos com explicações simples e objetivas.

“Se uma imagem vale mais do que milpalavras, então diga isto com uma imagem.”

- Millôr Fernandes

Observação: o design digital é muito maisdo que esses 4 tópicos que aqui iremosabordar.

Simplificando o Design Digital

Entendendo de forma rápida e direta sobre:

Ui Design (Ui)

Ux Design (Ux)

Arquitetura de informação (Ai)

Sites Responsivos

Ui DesignUi é o design de interface do usuário, é o meio pela qual uma pessoa interage e controla umdispositivo, software ou aplicativo.

Simplificando o Design Digital

Produto/interface

UIExperiência

UXProduto/interface

UIExperiência

UX

Ux DesignUX é Experiência do usuário, é um termo para o nível de satisfação geral dos usuários enquantousam o seu produto ou sistema. Em poucas palavras é como você se sente ao usar algo.

Simplificando o Design Digital

Design

Experiência do Usuário

UX

Design

Experiência do Usuário

UX

Arquitetura de informação (Ai)Ai em design é organizar ou transformar o que é complexo ou confuso em algo mais claro. Esquemas deorganização, rotulação, busca e navegação em dispositivo, software ou aplicativo.

Simplificando o Design Digital

Sem Ai

Com Ai

Exemplo de Organização feito

por cores

Arquitetura de informação (Ai)

Simplificando o Design Digital

Ausência de Ai Presença de Ai

Sites ResponsivosÉ um site que consegue responder ao tamanho da tela (mobile ou desktop), adequando-se da melhorforma. Sua aparência e disposição muda com base no tamanho da tela em que o site é exibido.

Simplificando o Design Digital

Tv

Monitor PC

Notebook

Tablet na vertical e horizontal

Celular na vertical e horizontal

Sites Responsivos

Simplificando o Design Digital

Conteúdo Monitor

Tablet Celular

Analogias para site responsivo

Cereais (conteúdo)

Tigela (monitor)

Barra de cereal (tablete)

Caixinha de Cereais (celular)

Livros sobre Design Digital

Simplificando o Design Digital

Falamos de uma forma rápida sobre o design digital, onde abordamos quatro tópicos: Ui design, UxDesign, Arquitetura de informação (Ai) e Sites responsivos. O design digital aborda muito mais dos queforam simplificados aqui e para ampliar melhor os conhecimentos nessa área, recomendo os seguinteslivros em Português (traduções e autores brasileiros):

Não me faça pensar - Steve KrugSimplificando coisas que parecem complicadas - Steve KrugO Design do Dia-a-dia - Donald A. NormanO Guia para Projetar UX - Russ Unger e Carolyn ChandlerErgodesign e Arquitetura de Informação - Luiz AgnerDesign Centrado no Usuário - Travis LowdermilkDesign Emocional - Donald A. NormanDesign de Interação - Helen Sharp, Jennifer Preece, Yvonne RogersPrincípios do Web Design Maravilhoso - Jason BeairdAvaliação e Projeto no Design de Interfaces - José Guilherme Santa Rosa, Anamaria de MoraesDesign para Internet - Felipe Memória

Livros sobre Design Digital

Simplificando o Design Digital

Lowdermilk, Travis. Design Centrado no Usuário: Um guia para o desenvolvimento de aplicativos amigáveis. São Paulo: Novatec

Editora, 2013.

http://mariovalney.com/afinal-o-que-e-ux-user-experience/ (2016)

https://www.youtube.com/watch?time_continue=74&v=-L4gEk7cOfk (2016)

http://www.fatdux.com/pt/what/what-is-ux (2016)

http://www.designculture.com.br/o-que-e-ui-design-e-ux-design (2016)

http://pt.slideshare.net/marconidesenhos/arquitetura-de-informao-para-interface-digital (2016)

http://pt.slideshare.net/marconidesenhos/site-responsivo-vantagens-e-desvantagens (2016)

http://pt.slideshare.net/agenciamateada/arquitetura-de-informacao-agenciamateada-26022641 (2016)

http://www.comersite.com.br/sites-responsivos-o-que-sao-eu-preciso-de-um (2016)

https://www.argohost.net/blog/saiba-como-funciona-um-servico-de-hospedagem-de-sites/ (2016)

http://www.lucrei.com/hospedagem-de-sites-como-funciona/ (2016)

http://www.uxdesign.blog.br/user-experience/ux-por-onde-comecar/ (2016)

Referências

Simplificando o Design Digital

Slide 03 – https://goo.gl/O4shtM | http://goo.gl/0U7hXq

Slide 04 – http://goo.gl/NmQCmb | https://goo.gl/zQMMr3

Slide 05 – https://goo.gl/4u6A6X

Slide 06 – https://goo.gl/x9hX8G | http://goo.gl/D5Xmlc

Slide 07 – http://goo.gl/v7SpX8

Slide 08 – http://goo.gl/p3QST4

Lista de Figuras

Simplificando o Design Digital

Marconi A. PachecoBacharel em Design

Designer e desenvolvedor front-end. Apaixonado por cinema, literatura, quadrinhos e ilustrações.

twitter.com/marconidesenhos

linkedin.com/pub/marconi-ap/37/472/405

instagram.com/marconidesenhos

Simplificando o Design Digital