21ª Sesión "EXTRACLASE"

Analizar el siguiente sitio con la metodologgía que hemos visto y hacer el mapa del sitio.

El sitio esta hecho en un CMS ya que todos los sitios del gobierno son parecidos. La aplicación es de contenido y e información, ya que muestra todo lo que se ha hacho y que puede hacerse para los adultos mayores.

PATRONES DE CONTENIDO.

TAXONOMÍA.

Divide el contenido de la página para que el usuario decida que es lo desea ver.

ESTRUCTURA FÍSICA

One Window paging, se abre ventana por ventana y Tiled Panles, puedes ver varias ocpciones que hay a un lafo para poder escoger la que deseas.

PATRONES DE ORGANIZACIÓN DE CONTENIDO

One WIndow drill down. La clasificaci`ón es buena para poder encontrar lo que quieres.

PATRONES DE NAVEGACIÓN

GLOBAL NAVEGATION. Muestra un conjunto coherenet de botones que lleva al usuario a los puntos importantes de la interfaz.

CLEAREATRY POINTS. Tiene grupos de acciones fáciles, utiliza botones para accesar a las opciones.

COLOR-CODED SELECTION. El color predominante es el rosa que es el representativo

ANOTATED SCROLL BAR. no tiene la función de que cada vez que le damos al scroll mos muestra en donde estamos, sería una gran ayuda el hecho de saber en que lugar estamos
PYRAMID. tiene la página principal que te comunica con las demás y siempre tienes que regresar a la principal para poder hace las demás acciones.


Animated Transitions. Tiene ventanas y transiciones

21ª Sesión "BLOG DE PERSONAJE"

He decidido hacerle un blog a un amigo que tiene un BAR en San Miguel de Allende llamado "BAMBU", el publico al que esta dirigido es hombres y mujeres de 21 a 35 años, los cuales les guste un ambiente agradable mientras toman su bebida. Los actores varían según los gustos, puede llegar desde un chavo con su novia a comer algo, hasta un señor con sus amigos para tomar una cerveza después del trabajo. Su clase social es media alta, más alta que media ya que estamos hablando de una zona donde la gente gana bien o vive mucha gente de Estados Unidos, y el turismo es grande.

Cuenta con terraza, barra y dos secciones una que tiene mesas un poco más nice con manteles y copas de vino, donde la mayoría de la gente va a comer y la segunda otra sección en donde hay mesas de uso más rudo para los que deseen tomar más que comer.

21ª Sesión "REFLEXIÓN"

En esta sesión vimos lo que fue:

FILOSOFÍA: Enfoque o postura de la realidad. "USER CENTER DESING"

ROI (Returne of investiment). En cuanto tiempo me va a regresar lo que invertí.
Si a alguien le gusta mi página se a convertir en un usuario y va a recomendar tu sitio.

MÉTODO: "THE ELEMENTS OF USER EXPERIENCE". Esto habla de la experiencia de Usuario, el cual es muy importante, porque si no lo tienes satisfecho entonces lo que hagas no estará cumpliendo su objetivo.

En el siguiente cuadro vemos los elementos de la Experiencia de Usuario. En la cual tienes por ejemplo: LA ESTRATEGIA: es la idea donde se diseña el concepto del sitio. entre otras.


Todas estas etapas interactúan.

Para poder saber realmente cuales son las necesidades del usuario debemos preguntarnos ciertas cosas, por ejemplo, ¿Qué es lo que queremos obtener del sitio y qué es lo que los usuarios quieren del sitio?

Si no tenemos bien claro el objetivo del sitio no vamos a poder satisfacer al usuario, el cual es el más importante porque sin usuario no tenemos una necesidad que satisfacer.

20ª Sesión

Este día tuvimos el examen el cual lo sentí mucho más fácil que el primero, ya que tuvimos mucha practica con los patrones y el análisis de la página de Faustinus.

17a y 18a Sesión

PAGE LAYOUT
Como distribuir el contenido en la pantalla.

1. PRINCIPIOS

1. JERÁRQUICO
Organizar el contenido por tamaño, información, etc.
ESQUINA SUPERIOR IZQUIERDA. Se le llama también la esquina privilegiada, es lo primero que vez en un página de internet, algo muy raro porque en la fotografía la esquina superior derecha es la más importante.Podemos ver como en la siguiente página el logo esta en esta esquina, entonces si cumple con este principio.
ESPACIO EN BLANCO. Tienen muchos espacios en blanco y eso nos da una sensación de orden.
FUENTES CONGRUENTES. No se ve mucho la jerarquía de las tipografías, si se nota cuales son los títulos pero en algún momento se pueden confundir por el tamaño tan similar entre ellas.
COLORES Y CONTRASTE. Se utiliza el color azul para saber cual es el titulo y los temas importantes, aunque es muy monótono.
SUBORDINACIÓN.
FORMAS Y GRUPOS.





2. FLUJO. Se refiere a que la información este ordenada para que no te confundas y sepas que es lo que sigue. Podemos ver que la información esta bien ordenada y el usuario no se pierde entre tantos textos o imágenes.


3. AGRUPACIÓN
PROXIMIDAD. Todo lo que está cerca es congruente con lo que se muestra.
SIMILITUD. Hay formas iguales para las funciones iguales, por ejemplo el botón de buscar en donde te metas será igual del color rojo.
CONTINUIDAD. La relación de formas continuas tienen relación y es natural.
CIERRE. La vista tiende a cerrar espacios para agrupar lo relacionado. No tienen muchas imágenes que el ojo humano tienda a cerrar las imagines.


1. PATRONES DE JERARQUÍA
VISUAL FRAMEWORK. El fondo se mantiene igual, es blanco.
CENTRAL STAGE. Lo más importante está en medio de la página por ejemplo donde pones lo que quieres buscar.

2. PATRONES DE AGRUPACIÓN
TITLE SECTIONS. Las secciones tienen un título de donde se van desplegando otros títulos.
CARD STAGE. Cada vez que le das click a alguno de los títulos se abre la información en forma de tarjetas sin perder el mismo fondo.
CLOSE STAGE
CLOSABLE PANELS.
MOVABLE PANELS. No se pueden mover los paneles a tu antojo.

3. PATRONES DE FLUJO.
LEFT/ RIGTH ALIGNMENT. Se refiere a que se puede justificar la información a la derecha o izquierda según sea su caso, en este ejemplo podemos ver que la información de la página más importante está de lado derecho.
DIAGONAL BALANCE. Parece que esta muy lleno de información, pero esta bastaste equilibrado.



4. PATRONES DINÁMICOS.

RESPONSIVE DISCLOSURE. Siento que casi odas las páginas tienen este tipo de patrón ya que al dar click a una opción se abre el contenido que deseas ver. como el de la página de http://www.cinepolis.com.mx/indexmx.asp

RESPONSIVE ENABLING.Con este ejemplo es mucha más sencillo de entender en que se basa este patrón, cuando le das click a una opción se activa un contenido que no se podía seleccionar.

LIQUID LAYOUT. Al hacer pequeña la página la información se acomoda de forma que puedas seguir viendo el texto o las imágenes.

16a Sesión

Exposisición sobre aplicaciones de trabajo colaborativo, el caul nos va ayudar al proyecto que tenemos en la clase de Desarrollo Humano. hemos tenido una buena respuesta de nuestros compañeros de clases lo cual agradecemos porque al ser el ultimo equipo en exponer teniamos menos tiempo para que utilizaran la aplicación.

En la segunda hora tuvimos una visita de un diseñador gráfico el cual nos dio una platica muy interesante de algo que casi no te dcen en clases, nos hablo de los clientes, lo importante que es tener una idea y poder llevarla a cabo hasta el final a pesar de los diferentes factores que aparecen durante el proceso.

15a Sesión

Mis compañeros expusieron sobre las Aplicaciones para compartir contenido. Empezaron con un historia sobre como es que en el tiempo el hombre se ha facilitado la tarea de la comunicación, la computadora llegó a facilitar la vida de los seres humanos aumentando la rapidez con que se comunicaban.
Después llegó el Internet, con él el WEB 1.0 En donde sólo ves el contenido en lenguaje HTML y HTTP.
WEB 2.0, Es la colaboración de servicios que remplacen las aplicaciones de escritorio.

la interacción entre los usuarios marca la diferencia. nosotros podemos compartir videos, audio, voz, datos, ficheros, fotos, entre otras cosas, existen varias interfaces para esto, unas de ellas son. facebook, youtube, mesenger, twitter, emule, etc.

Vimos también otros tipos de PATRONES DE NAVEGACIÓN:

1. BREAD CRUMBS.
2. SEQUENCE MAP
3.COLOR CODED SECTION
4.ANOTATE SCROLL BACK

La siguiente páfina que analizaré es UNIVISIÓN

http://www.univision.com/content/channel.jhtml?chid=6&schid=1514

Tiene el patrón que vimos de COLOR CODED SELECTION cada vez que abrimos una sección nueva ya sea de música, mujer, noticias, la página tiene un color especifico, la de MUJER por ejemplo es de color rosa.



http://www.univision.com/content/channel.jhtml;jsessionid=FBPNYULVAPNSKCWIAA4SFFAKZAADWIWC?chid=10

Entraría en la clasificación de contenido porque sobre entretenimiento.

PATRONES DE USO


1. SAVE EXPLORATION. Puedes regresar y cambiar de decisión si así lo deseas.

2. INSTANT GRATIFICATION. Su respuesta no es tan rápida.

3. SATISFICING. Puedes hacer una búsqueda de cosas que te interesan o simplemente para poder entretenerte un rato.

4. CHANGES IN MIDSTREAM. Puedes regresar a la página principal si donde diste click no era lo que esperabas.

5. DEFERRED CHOICES. Si deseas ingresar debes completar un formulario específico.

6. INCREMENTAL CONSTRUCTION. No puedes hacer ningún cambio.

7. HABITUATION. Las acciones a las que estas acostumbrado usar en una página es la misma.

8.SPACIAL MEMORY. han cambiado su interfaz pero no cambia mucho, tiene mucho contenido y casi siempre está en el mismo lugar para que la gente lo encuentre facilmente.Hace poco cambiaron su interfaz pero ahora está mucho mejor, más organizado.

9. PROSPECTIVE MEMORY. No lo tiene.

10. STREAMTINED REPETITION. Recuerda los datos al iniciar sesión.

11. KEYBOARD ONLY. No tiene comandos rápidos, pero puedes utilizar el mouse y teclado sin ningún problema.

12. OTHER PEOPLE. Tiene una ventana para atención al cliente.

Su estructura física es de ONE WINDOW PAGING ya que sólo abre una página a la vez.


PATRONES DE ORGANIZACIÓN DE CONTENIDO.

ONE-WINDOW DRILL DOWN. La clasificación de la información esta un poco saturada, pero no es dificil de encontrar lo que buscas.

Su clasificación según su uso es de Publicación ya que muestra información para personas que quieran estar informadas de salud, noticias, espectáculos, situaciones legales entre otras muchas cosas.

PATRONES CONCEPTUALES

WIZARD. Te guía paso a paso lo que debes hacer por ejemplo para inscribirte.
INTRIGUINS BRANCHES. Le das click en un icono y te lleva a la información deseada.


PATRONES DE NAVEGACIÓN

GLOBAL NAVEGATION. Puedes saltar a otras opciones de forma fácil y sencilla.