Edu Agni é um designer e criador do blog UX.BLOG que trabalha há nove anos com projetos de design de interfaces e usabilidade. O documento discute vários tópicos relacionados à experiência do usuário, como avaliação de produtos, design centrado no usuário, desenvolvimento front-end, semântica, acessibilidade e design responsivo.
Exame De Suficiencia Para Obtencao Do Titulo De Especialista Em Medicina De F...
O papel do Front-End na UX
1.
2. EDU AGNI
Criador do UX.BLOG, trabalha há nove anos com projetos
nas áreas de direção de arte, usabilidade, design de
interfaces e front-end. Atualmente é designer no iMasters
e curador da área de Design da Campus Party Brasil.
www.uxdesign.blog.br
www.twitter.com/eduagni
www.linkedin.com/in/eduagni
//UX.BLOG
3.
4. “O produto não é um fim em si,
mas a porta de entrada para uma
infinidade de experiências.”
(The Nokia Design Manifesto)
//UX.BLOG
7. “I thought human interface and usability
were too narrow. I wanted to cover all
aspects of a user’s experience with the
system, including industrial design
graphics, the interface, the physical
attraction, and the manual.”
Don Norman
//UX.BLOG
8.
9. Avaliação rápida de um produto
★ Eu consigo usá-lo? (usabilidade)
★ Eu devo usá-lo? (utilidade)
★ Eu quero usá-lo? (desejo)
18. "Se a facilidade de uso fosse o
único requisito, estaríamos
todos andando em triciclos"
(Douglas Engelbart, inventor do mouse)
//UX.BLOG
19.
20. Segundo Peter Merholz (Subject to Change),
a experiência de uma pessoa emerge das
seguintes qualidades:
★ motivações
★ expectativas
★ percepções
★ habilidades
★ fluxo
★ cultura
//UX.BLOG
44. Em 2003, Mike Davidson foi responsável pelo redesign do
site site da ESPN, utilizando os padrões web.
Com isso obteve uma redução de 50kb por página, e com
isso a economia de banda foi de:
2 Terabytes / dia
61 Terabytes / mês
730 Terabytes / ano
54. Um dos primeiros sites acessíveis
produzidos por uma empresa comercial.
Todo o redesign foi baseado na Web
Content Accessibility Guidelines
(http://www.w3.org/TR/WCAG/), e com
isso as taxas de conversão aumentaram
300%, custos de manutenção caíram
66%, o tempo de carregamento caiu
75%, e a listagem natural nas buscas
aumentou 50%.
55. Melhorar a sua
capacidade de inovar
significa tornar mais
próximas duas funções
que criam inovações:
UX e Front-End
64. O Google recomenda,
e também te recompensa.
“Sites que usam Web Design Responsivo, isto é, sites que
funcionam em todos os dispositivos com o mesmo conjunto
de URLs, com cada URL fornecendo o mesmo HTML a todos
os dispositivos e usando apenas CSS para alterar como a
página é processada no dispositivo. Essa é a configuração
recomendada pelo Google.”
https://developers.google.com/webmasters/smartphone-sites/details
69. Arquitetura de Informação
★ Estabelecer uma escala hierárquica de importância
das informações textuais e gráficas do site
★ Repensar a pertinência de apresentação dessas
informações em diferentes contextos e dispositivos
79. ★ Para se qualificar para os Rich Snippets,
você deve marcar as páginas de seu site
usando um dos três formatos suportados:
Microdados, Microformatos ou RDFa;
80. ★ Uma vez que seu conteúdo é marcado com
dados estruturados, teste-o usando a
ferramenta de teste de dados estruturados
(http://www.google.com/webmasters/
tools/richsnippets);
81. ★ Após você implementar e testar
corretamente a marcação, pode levar
algum tempo até que os Rich Snippets
apareçam nos resultados de pesquisa,
conforme indexamos e processamos as
páginas.
87. ★ Os três maiores mecanismos de busca da
web - Google, Yahoo! e Bing - se juntaram
na criação de um padrão para prover
melhores práticas semânticas na
publicação de conteúdos na web, de
forma que sejam indexados com maior
precisão e qualidade;
88. ★ O Schema é baseado no Microdata do
HTML5, o que mostra que nada novo
está sendo criado, mas sim algo já
existente está sendo extendido;
89. ★ O Schema.org contempla diferentes
tipos de conteúdos, possuindo
marcações específicas para livros,
filmes, música, receitas, séries de TV,
eventos, organizações, pessoas,
lugares, restaurantes, produtos,
ofertas, reviews, etc.
90. Schema.org » Organization
HTML Original
Google.Org
Contact Details:
Main address: 38 avenue de l'Opera, F-75002 Paris, France
Tel: ( 33 1) 42 68 53 00, Fax: ( 33 1) 42 68 53 01
E-mail: secretariat (at) google.org
URL: <a href="http://www.google.org">www.google.org</a>
Members:
- National Scientific Members in 100 countries and territories: Country1,
Country2, ...
- Scientific Union Members, 30 organizations listed in this Yearbook:
Member 1, Member 2
History:
92. Schema.org » Organization
HTML com Schema
...
Members:
- National Scientific Members in 100 countries and territories: Country1,
Country2, ...
- Scientific Union Members, 30 organizations listed in this Yearbook:
<span itemprop="member" itemscope itemtype="http://schema.org/
Organization">
Member1
</span>,
<span itemprop="member" itemscope itemtype="http://schema.org/
Organization">
Member2
</span>,
History:
</div>
93. Schema.org » TVSeries
HTML Original
Grey's Anatomy is a medical drama television series created by Shonda
Rimes
Starring:
Justin Chambers
Jessica Capshaw
Season 1 - May 22, 2005
Season 2 - May 14, 2006
94. Schema.org » TVSeries
HTML com Schema
<div itemscope itemtype="http://schema.org/TVSeries">
<span itemprop="name">Greys Anatomy</span> is a medical drama television
series created by
<div itemscope itemtype="http://schema.org/Person">
<span itemprop="author">Shonda Rimes</span>
</div>
Starring:
<div itemprop="actor" itemscope itemtype="http://schema.org/Person">
<span itemprop="name">Justin Chambers</span>
</div>
<div itemprop="actor" itemscope itemtype="http://schema.org/Person">
<span itemprop="name">Jessica Capshaw</span>
</div>
...
100. Referências
★ Improving UX Through Front-End Performance (bit.ly/15K5zV2)
★ Livro: Subject to Change, de Peter Merholz
★ Facets of the User Experience (http://bit.ly/IGs40)
★ The Disciplines of User Experience (http://bit.ly/Z7XffS)
★ The Nokia Design Manifesto (http://bit.ly/14tr4o)
★ Holy Trinity of Digital Experience Design (http://bit.ly/1agOZi6)
★ Hi, I'm a UX Developer - You're a what? (bit.ly/13nz0sK)
★ What is a UX Developer and are they really a thing? (bit.ly/zSWtPY)
★ Great User Experiences Require Great Front-End Development (bit.ly/IrRjqo)
★ Schema (schema.org)