1. O documento fornece dicas sobre registro de domínios, hospedagem, design de sites e experiência do usuário. 2. É destacada a importância de testes de usabilidade e métricas como tempo de carregamento para conversão de vendas. 3. São apresentadas dicas para trabalhar em home office, como estruturar preços e serviços de design e desenvolvimento web.

1. WEBDESIGN 2014-02
Resumo
RENATO MELO - 2014

2. REGISTRANDO UM SITE
+ EXERCÍCIO DE HTML5

3. Registro.br
Portal oficial de domínios do Brasil.
Domínios para pessoas físicas e jurídicas.

4. Para os Buscadores
Domínios do Brasil também contam pontos
no ranking dos motores de busca

5. Pesquise
Antes de registrar, você pode pesquisar se o
domínio já existe. Senão, busque alternativas
que estejam disponíveis.

8. Faça seu cadastro
como usuário e
registro do domínio

9. Quanto custa?
R$ 30 no primeiro ano
R$ 27 para os restantes

10. O pagamento é
feito via boleto ou
cartão de crédito

11. O domínio só garante seu
endereço. Você precisa de
uma hospedagem para
armazenar seus arquivos.

12. E O REGISTRO.BR PEDIRÁ O DNS
É o equipamento responsável por permitir
que seu domínio esteja ativo na internet. É
um endereço fornecido pelo seu provedor.

13. CONTRATE HOSPEDAGEM EM LINUX
Hospedagens em Linux são ideais para trabalhar
com banco de dados (php). Uma hospedagem em
Windows é boa somente para a linguagem da
microsoft: ASP.net

14. E como meu site vai pro ar?
Como eu mando meus arquivos?

15. Você transfere os
arquivos via FTP

16. Pode ser feito no site da sua
hospedagem, via windows
explorer ou de um programa

17. Filezilla: o mais usado

18. Você precisa de:
Endereço do FTP
Usuário
Senha

19. O UX e
Usabilidade

20. “Você deve
começar com
a experiência
do usuário e
depois ir para a
tecnologia”

21. AMAZON
A CADA 100 MILISSEGUNDOS DE TEMPO DE
CARREGAMENTO DE PÁGINA REDUZ 1% DE
VENDAS NA AMAZON.

22. GOOGLE
AO AUMENTAR O CARREGAMENTO DO SITE
DE 0.4 PARA 0.9 SEGUNDOS, PERDEU 20% DA
RECEITA EM PUBLICIDADE,

23. INTERNET ONTEM
Anúncios Sites Institucionais

24. INTERNET HOJE
Anúncios Sites Institucionais SEO Mobile
Redes
Sociais
Geo localização Conversão
No PDV
Logística

25. USUÁRIO TEM QUE POSSUIR
UMA EXPERIÊNCIA POSITIVA
EM TODOS OS CANAIS

26. O QUE PRECISA
SER PENSADO
CONTEXTO
CONTEÚDO USUÁRIO

27. LEMBRE-SE: O
FOCO É NAS
PESSOAS!

28. CHECKLIST DO UX
 TAMANHO DA TELA
 CONECTIVIDADE
 OBJETIVOS DO USUÁRIO
 AMBIENTES DO USUÁRIO
 CAPACIDADE DO USUÁRIO

29. MODELO ANTIGO
IDEIA
DESEN
VOLVI
MENTO
LANÇA
MENTO
MAIS CHANCE DE ERRO
SEM APRENDIZADO
SEM CONTINUIDADE

30. MODELO NOVO
IDEIA
MENOS CHANCE DE ERRO
APRENDIZADO
CONTINUIDADE
DESEN
VOLVI
MENTO
LANÇA
MENTO
VALIDA
ÇÃO
ITERA
ÇÃO

31. NÃO SE PODE
MELHORAR O QUE
NÃO SE MEDE

32. TESTES

33. 1) FEEDBACK
até 0,1s: ideia de
continuidade
até 1s: delay
percebido, mas ok
depois de 10s: o
usuário muda de
tarefa.

34. 2) PÁGINAS DE ERRO
O usuário deve saber o que está acontecendo
em uma linguagem fácil.
O usuário deve saber que a culpa não foi dele.
O usuário deve conseguir voltar para o site.

35. Nome:
Endereço:
Telefone 1:
Celular:
Telefone da Mãe:
CPF:
RG:
Nome do Cachorro:
Estado Civil:
3) FORMULÁRIO

36. 3) FORMULÁRIO
Houve um erro no preenchimento do formulário.
Nome:
Endereço:
CEP:
CPF:
Telefone:
Renato Melo
Rua dos Bobos, número zero
01234-000
12345678900
48 13 6666-6666-6666
6666
Não use espaços ou hifens no
telefone. Utilize somente números.
Onde?

37. 4) CAIXA DE BUSCA

38. 5) ETAPAS DO SEU SITE
1. Escolhas dos produtos
2. Cadastro ou login
3. Entrega e embalagem
4. Pagamento

39. Laboratório
Medir performance
(tempo, número de
erros)
Produção acadêmica
(maior “aceitação”
científica para teses,
artigos e dissertações)
Estudos permanentes
com equipe dedicada
(Globo, Nokia)
Ambiente do Usuário
Obter feedback rápido
Projetos com recursos
reduzidos
Testar conceitos e
interfaces em fases
iniciais de design

41. Conversão
1 – Ser encontrado
2 – Online 24h, não importa
quando e onde
3 – Design claro e objetivo
4 – CONTEÚDO
5 - CONTEÚDO
6 - CONVERSÃO

42. Conversão
Fazer seu usuário agir da forma
desejada e mensurável

43. DESIGN PARA O
FACEBOOK:
Aula 1 - Post

44. PRIMEIRA DICA E
REGRA DE OURO
DO FACEBOOK:
SÓ USE
IMAGENS EM
PNG!

45. IMAGEM
PARA POST

46. As imagens são encaixadas numa espécie de “box
invisível”, com altura máxima de 394px e largura
máxima de 470px. Se a imagem estiver no tamanho
errado, ela ficará com espaço branco (foto).

47. O tamanho ideal é 650x545 pixels. Para imagens com
melhor definição, você pode ampliar o tamanho
mantendo a mesma escala.

48. Na hora de postar um link, a imagem terá medida de
246x470 px

49. Link de vídeos ou páginas que tenham imagens
menores do que 246x470px serão exibidas como
miniaturas de 150x150px.

50. POST:
A IMPORTÂNCIA DA
FOTO

51. Publicações com foto!
Chamam atenção e
aumentam em 180% as
chances de engajamento.

52. O número de cliques na
foto é o maior índice de
engajamento.

53. PADRÃO DE IMAGENS
PARA ANÚNCIOS NO FACEBOOK

54. FOTOS PROIBIDAS:
LOGOS E MENÇÕES AO FACEBOOK (LIKE, ETC)
NUDEZ E FOTOS VIOLENTAS
BELEZA PERFEITA (EMAGRECER)

55. POST
PATROCINADO

56. O Facebook permite apenas 20% de texto, por isso
construa uma grade com linha guia, criando 25
quadrados. Assim, apenas 5 poderão conter texto.

57. O Facebook permite apenas 20% de texto, por isso
construa uma grade com linha guia, criando 25
quadrados. Assim, apenas 5 poderão conter texto.

58. ANÚNCIOS

59. Anúncios para curtir página: 1200x444 px
Anúncios para visitas no site: 1200x630 px

60. COMO MONTAR UM
HOME OFFICE

61. Meu primeiro JOB
vai nascer!
Quanto cobro?

62. 1º O que o cliente
quer?

63. Solução para o problema dele
Um site horrível!
Prazo: Ontem
Preço
Barato, pois o sobrinho
sabe fazer um igual
Atendimento
Tratar o cliente como a
mãe dele o trataria

64. Não fale grego e
facilite a
comunicação

65. Como cobrar?
Por insumo (fotos, páginas)
1)Prefira estipular um valor para a
identidade visual.
2)Só depois, estipule um valor por
página.

66. Como cobrar?
Preço Fechado
1)Entendeu o que o cliente quer.
2)Notou que o cliente não trará grandes
problemas ou já conhece o cliente.

67. Como cobrar?
Preço por Hora
1)Fazer o Mapa do Site
2)Calcular seus custos
3)Calcular quanto tempo irá levar

68. MONTANDO
O MEU HOME OFFICE

69. Custos Fixos
Internet
Luz
Telefone

70. Custos Variáveis
Domínio
Hospedagem
Banco de Imagem
Profissional Extra

71. Custos Variáveis
Não esqueça dos extras:
-Pizza para comer rápido pois o
prazo está curto
-Café para manter acordado, etc

72. Patrimônio
Computador
Livro
Software
Cursos

73. Quer ganhar
quanto?
Salário
13º
Férias
Dias da semana
trabalhados

74. VALOR HORA – Iniciando:
Valor Hora
Custo + patrimônio R$ 2,22
Mão de obra (salário base
de R$2.500,00)
R$ 14,57
Valor Hora R$ 16,79

75. LUCRO HORA:
Valor Hora
Custo + patrimônio R$ 2,22
Mão de obra (salário base
de R$2.500,00)
R$ 14,57
Valor Hora R$ 16,79
Lucro de 30% R$ 21,83

76. Ajustes Tempo:
Valor Hora
Custo + patrimônio R$ 2,22
Mão de obra (salário base
de R$2.500,00)
R$ 14,57
Valor Hora R$ 16,79
Lucro de 30% R$ 21,83
20% para e-mails,
estudos, etc
R$ 26,19

77. Ajustes Cliente:
Valor Hora
Valor Hora R$ 16,79
Lucro de 30% R$ 21,83
20% para e-mails,
R$ 26,19
estudos, etc
10% margem de erro R$ 28,81
10% margem de choro R$ 31,68

78. Ajustes para
Tipo de
Cliente:
Cliente Valor Hora
Pequeno
R$ 633,60
comércio
PME 50% R$ 950,40
Grandes
Empresas
250%
R$ 3326,40

79. COMO
SE ORGANIZAR

80. Família, família.
Negócios à parte.

81. Faça um lugar só
seu, como
quartinho de
empregada.

82. Não trabalhe de
pijama.

83. Não trabalhe no
mesmo cômodo
onde dorme.

84. Instale uma linha
telefônica própria

85. Faça o seu horário
de almoço!

86. Não fique ocioso:
invista em projetos
e na sua carreira.

87. Crie ou faça parte
de um blog.

88. Marque reuniões
em cafés ou no
local do cliente.

89. Administre seus
gastos.