lc3-2010-clase no.1
Post on 18-Jan-2017
1.203 Views
Preview:
TRANSCRIPT
Diseño de Medios Digitales
@jorgebarahona
junio, 2010
miércoles 30 de junio de 2010
Qué es un MD?• Pantallas
• Internet
• Móviles
• TV
• Juegos
• Consolas de comando
miércoles 30 de junio de 2010
miércoles 30 de junio de 2010
E S T R A T E G I A
C O M P O R T A M I E N T OD E L A S
P E R S O N A S
A R Q U I T E C T U R A D EL A I N F O R M A C I Ó N
D I S E Ñ O D EI N T E R A C C I Ó ND I S E Ñ O D E
I N T E R F A Z
D I S E Ñ O D EC Ó D I G O S
D E I N T E R F A Z
es
tr
uc
tu
ra
r
pr
od
uc
ir
p l a n i f i c a r
1
2
3
4
5
6
Brie
fin
g > C
om
po
rta
mie
nto
De
l C
on
sum
idor
> Benchm
arking Expert Review > Evaluación Heurística > Eyetracking Diseño de C
ontenid
os > Map
as d
e N
av
eg
ació
n > W
ire
fra
me
s d
e C
on
ten
ido
s
Pro
gra
ma
ció
n X
HT
ML
> CS
S > C
apa A
jax Tipografía > Cromática > Diseño de Iconografía > Maquetación Modelo
s Menta
les > M
apas
de I
nte
racció
n > W
ire
fra
me
s
M E TO D O L O G Í ADiseño de Experiencia Digital
miércoles 30 de junio de 2010
Estrategia
• Breif
• Entrevistas guiadas
• Benchmark
miércoles 30 de junio de 2010
miércoles 30 de junio de 2010
E S T R A T E G I A
B R I E F I N G
C O N V E R S A C I O N E SG U I A D A S
B E N C H M A R K
¿ q u é ?
1
2
P LA N
I FI C
A R
BRIEF >> B
rief > DeBrief > Contra Brief CONVERSACIONES >> Etnografía > Personas y Escenarios
BENCHMARK >> Calificación de los servicios > Anotaciones d
el expert
o > T
rack
ing
de la
mar
ca
C O M P O R T A M I E N T OD E L A S
P E R S O N A S¿ q u i é
ne s ?
¿ c uá n
do
?
¿ c ó m o ?
miércoles 30 de junio de 2010
Comportamiento de las personas
• Expert Review
• Personas & Escenarios
• Evaluación Heurística
• Eyetracking
miércoles 30 de junio de 2010
miércoles 30 de junio de 2010
E X P E R TR E V I E W
E VA L U A C I Ó NH E U R Í S T I C A
E Y E T R A C K I N G
1
2
3
PL A
NI F
I CA
R
E S T R U C T U R A R
C O M P O R T A M I E N T OD E L A S
P E R S O N A S
A R Q U I T E C T U R AD E L A
I N F O R M A C I Ó N
E S T R A T E G I A
miércoles 30 de junio de 2010
Arquitectura de la Información
• Diseño de Contenidos
• Mapas de Navegación
• Wireframes
miércoles 30 de junio de 2010
miércoles 30 de junio de 2010
D I S E Ñ O D EC O N T E N I D O S
M A PA S D EN AV E G A C I Ó N
W I R E F R A M E S D E C O N T E N I D O S
1
3
4
PL A
NI F
I CA
R
E S T R U C T U R A R
DISEÑO
DE
CO
N
TE
NID
OS
>> Ca
rd
so
rtin
g > L
ing
ûis
tic
a
A R Q U I T E C T U R AD E L A
I N F O R M A C I Ó N
E S T R A T E G I A
D I S E Ñ O D EI N T E R A C C I Ó N
miércoles 30 de junio de 2010
Diseño de Interacción
• Mapas de la Interacción
• Wireframes ricos
• Modelos mentales
miércoles 30 de junio de 2010
miércoles 30 de junio de 2010
M O D E L O SM E N TA L E S
M A PA S D EI N T E R A C C I Ó N
W I R E F R A M E S R I C O S
1
4
5
PL A
NI F
I CA
R
E S T R U C T U R A R
C O N S T R U I R
D I S E Ñ O D E I N T E R A C C I Ó N
E S T R A T E G I A
D I S E Ñ O D EI N T E R F A C E S
miércoles 30 de junio de 2010
Diseño Visual
• Diseño Tipográfico
• Diseño Cromático
• Lenguaje de Iconos
• Maquetación
miércoles 30 de junio de 2010
miércoles 30 de junio de 2010
T I P O G R A F Í A
C R O M Á T I C A
D I S E Ñ O D EI C O N O G R A F Í A
1
5
6
PL A
NI F
I CA
R
C O N S T R U I R
D I S E Ñ O D E I N T E R F A Z
E S T R A T E G I A
M A Q U E T A C I Ó N
D I S E Ñ O D EC Ó D I G O S
D E I N T E R F A Z
miércoles 30 de junio de 2010
Diseño de Códigos de la Interfaz
• XHTML
• CSS
• Ajax
miércoles 30 de junio de 2010
miércoles 30 de junio de 2010
P R O G R A M A C I Ó NX H T M L
P R O G R A M A C I Ó NC S S
P R O G R A M A C I Ó NC A PA A J A X
1
6P
L AN
I FI C
AR
C O N S T R U I R
D I S E Ñ O D E C Ó D I G O S D E
I N T E R F A Z
E S T R A T E G I A
O T R O SL E N G U A J E S
miércoles 30 de junio de 2010
preguntas
miércoles 30 de junio de 2010
top related