Sesión 21 Contenido

Analaizamos el plano de estrategia:

STRATEGY Plane:

1.- Necesidades del Usuario: Abarca también el perfil del usuario.
User needs- ¿Qué quieren nuestros usuarios obtener del sitio?
Con segmetación, usabilidad, estudio de mercado, intuición.

2.- Objetivo del Sitio:
Metas del negocio, identidad de marca y métricas de logro.
Metas del negocio: ¿Qué se busca lograr?
Identidad de la marca: que aspectos de la identidad de la marca se desean dar a conocer. Cómo ayuda el sitio a posicionar tu marca.
Métricas del logro: Nos sirve para saber como se están envolviendo los objetivos del sitio con los del usuario, se puede hacer através de una gráfica, en algunos caso se mide a través de las ganacias.
Site objectives- ¿Qué queremos obtener de este sitio?
User needs- ¿Qué quieren nuestros usuarios obtener del sitio?
Cuando estás 2 preguntas tengan la misma respuesta se podrá lograr un impacto interesante de la página.

3.- Perfil del Usuario:
a) Segmentación de Actores: Actores no es lo mismo que usuarios.
Se refiere tanto a los clientes como a los patrocionadores, la competencia, los departamentos funcionales para el proyecto, los dueños, empresarios, estudiantes, todos los que tengan que ver con el proyecto del sitio o blog. y después de esto hacemos la segmentación del usuario.

b) Segmentación o perfil de usuario:
-demografía, psicología, según objetivos, nivel tecnológico, cultura virtual, lugar de acceso, plataforma, orientación profesional, otros atributos.

c) Se pueden hacer fichas con fotografía de cada uno de los usuarios de forma general.


4.- Modelo del Negocio: Abarca el saber las necesidades del usuario y los objetivos, identificar los obejtivos de nuestro negocio. Entender los problemas para poder resolverlos.
Panorama general, la ubicación del mercado. Componentes: identidad, interactividad.
DESCRIPCIÓN GENERAL: Roles y Servicios
Roles: alguien que aporta(un provedor o incluso el usuario), alguien que administra y alguien que utiliza la información (el usuario, seguidores,etc.).
Servicios: Informar,compartir información, permitir aportaciones de otras personas,etc.

Sesión 21 Reflexión

En esta sesión vimos con más detenimiento el plano de estrategia y sus componenentes, de los cuáles se dejo el trabajo Extraclase.

En la segunda hora expuso un diseñador (Jacobo) quien nos hablo sobre la creación de la página queretaro.travel. Algo que me llamo la atención fue el como se distribuyeron los equipos de trabajo porque fueron especialistas en cada rama los que se encargaron de construir la página para que esta pudierá tener éxito. La manera en como está construida la página es bastante funcional y explicita ya que el usuario encuentra lo que le gusta y no se pierde dentro de ella. Me parece muy bien que el maestro nos lleve invitados a la clase porque cada uno tiene una visión y aportación diferente del diseño que nos puede ser muy útil en lavida laboral.

Comenté en los blogs de: Josué, Sandra y Wong

Sesión 20 Extraclase: Proyecto sitio de la Nación y Blog del Personaje

PROYECTO DE LA PÁGINA DE LA NACIÓN
Ubicar el objetivo del sitio para el plano de estrategia, analizar el sitio desde la página principal y hacer el mapa del sitio.

El sitio que me toco es: El Instituto Nacional de las Mujeres, el cual trabaja para crear una cultura de igualdad libre de violencia y discriminación, capaz de propiciar el desarrollo integral de todas las mujeres mexicanas y permitir, tanto a hombres como a mujeres por igual, ejercer plenamente todos sus derechos, así como participar equitativamente en la vida política, cultural, económica y social del país.

Objetivo del sitio: Plano de Estrategia
El objetivo del sitio del Instituto Nacional de las Mujeres (http://www.inmujeres.gob.mx/) es el proporcionar a todas las mujeres mexicanas información sobre el instituto desde su creación hasta la ayuda y congresos en diferentes estados que se proporcionan, además de promover y fomentar las condiciones que den lugar a la NO discriminación; a la igualdad de oportunidades y de trato entre los géneros, el ejercicio de todos los derechos de las mujeres y su participación equitativa.

Análisis de la Página

FRAMEWORK
Esta desarrollada en un Framework porque es una página que a pesar de no tener animaciones o movimiento contiene mucha información y enlaces a diferentes páginas los que la hace dinámica, además de tener una estructura única.

TIPO DE INTERFAZ
Es de Publicación ya que su objetivo es comunicar información relevante para que sea conocida.

InMujeres análisis
Mapa de Sitio InMujeres

BLOG DEL PERSONAJE

Definir los usuarios

segmentación delmercado

Sesión 20 Contenido

Comenzamos con la Unidad 4: DISEÑO CENTRADO EN EL USUARIO

Filosofía: El enfoque de la realidad para la construcción de las páginas.

Método: El metodo es el camino para llegar a algo, ‘’odo’’ es camino y met viene de meta. Hace referencia al medio para llegar a un fin. En su significado original esta palabra nos indica que el camino conduce a un lugar. Un método es una serie de pasos sucesivos, conducen a una meta.

User Center Design

Filosofía: el interés del usuario (ROI: Return on Investment), su interés es caro pero su regreso de la inversión es muy alto. Normalmente el ROI se mide por el dinero pero una medida común para el retorno de la inversión es el tipo de conversión (conversion rate) la cual es la eficacia de una experiencia del usuario.

Metodología:

Interfaz- lo hace mucha gente,se vuelve en líder del campo, sus ganacias son sorprendentes y es permanente.

Skin- lo hace una persona, se vuelven en seguidores mas no en líderes, sus ganacias son pocas y es efímero.

The elements of User Experience (libro de Jesse James Garrett)

1.- Strategy: La estrategia de la idea del proyecto, se refiere al provecho que el usuario quiere obtener de nuestro sitio. Tan sencillo como el siguiente ejemplo, un sitio de libros, el usuario lo que desea es comprar libros y lo que nosotros queremos es venderlos. Las necesidades del usuario son las metas de nuestro sitio y los objetivos del sitio son nuestras metas en los negocios, por ejemplo: obtener $1 millon de dolares en un año a través del nuestra página Web, o Informar a los votantes sobre los candidatos en las próximas elecciones.

2.- Scope (enfoque, ámbito, campo de aplicación): La estructura define la manera en la cual varias características/herramientas y funciones del sitio funcionarán, estás dos cosas constituyen al enfoque/ámbito del sitio.

3.- Structure: La estructura define como los usuarios llegan a la página y a dónde pueden ir cuando hayan terminado. Es el como se despliega una página al hacer uso de ella. Es la ARQUITECTURA de la INFORMACIÓN, el arreglo de los elementos del contenido dentro del espacio de información.

4.- Skeleton:La colocación de botones, tablas,fotos, y bloques de texto. El esqueleto es diseñado para optimizar el arreglo de esos elementos para un máximo efecto y eficiencia.

5.- Surface: Donde se da el ''look and feel'', su preocupación es el diseño visual, como luce el producto terminado. Es el diseño de los botones, las tablas, la selección de fotos, el color de los bloques de texto,etc.

Sesión 20 Reflexión

En está sesión entramos con el tema  4: DISEÑO CENTRADO EN EL USUARIO, en lo personal es el tema que más me llama la atención por que dentro de este se aplica todo lo que hemos visto anteriormente para poder crear páginas realmente interesantes y funcionales. También se que lo que vimos en esta sesión será explicado paso a paso con más detalle, es decir los planos o elementos: estrategia,enfoque, estructura, esqueleto y superficie.

También desde está clase cambio un poco la forma de postear las tares:
1.- Reflexión/Aportaciones
2.-Contenido de la clase
3.- Extraclase: la cual se divide en 2: El Blog del Personaje y el proyecto de nación.org

Comenté en los blogs de: Nuria,Nohely y Zaida

Sesión 19 Reflexión

En está sesión tuvimos nuestro segundo examen parcial, en el que en mi opinión estuvo un poco más sencillo que el anterior por el tipo de preguntas, aunque tuve confusión en 2 preguntas pero al final lo pude resolver. El examen abarco todos los tipos de patrones que vimos: de usuario, organización de contenido, navegación, Layout. Espero que a todos nos vaya mejor en este periodo.

Comenté en los blogs de:Jessica, Chely y Clau

Sesión 19 Extraclase (no hubo)

Está vez por motivo del examen no hubo extra clase

Sesión19 Blog del Personaje

El sábado tuve la cita con Luisa Liedo, su negocio abarca todo estilo de Guayaberas, las cuáles se las recomiendo mucho, son de muy buena calidad y buen gusto. Tuve el gusto de ir a conocer su tienda y ver su trabajo, Luisa es una mujer dedicada, visionaria, entre otras muchas cualidades, su negocio va enfocado principalmente a hombres de todas las edades, desde jóvenes como nosotros en adelante, además cuenta con una colección de guayaberas para niños, también está empezando a trabajar un poco en las Guayaberas para mujer.

En un principio le explique a Luisa lo qué era un blog y para que servía, hablando con ella en persona pude entender como quería su blog, la información que le interesaba dar a conocer y sobre todo el público al que va dirigido. Me comentó también la gama de colores que le gustaría usar para proyectar la imagen de su negocio.
Me encanto poder conocerla ya que era precisamente el tipo de persona a la que le quería hacer su blog y el enfoque de su negocio es verdaderamente innovador, ya que no existe ninguna otra tienda en Querétaro que venda Guayaberas y con la calidad de sus diseño y al gusto del cliente.

Sesión 18 Extraclase

3.- Closable Panels : Microsoft Word es un programa que nos permite usar el panel de herramientas conforme la vayamos requiriendo, podemos cerrar las herramientas que por el momento no utilizamos.


4.- Movable Panels: Como en myspace el usuario decide que desea colocar y que no en los paneles que aparecen en su página.



PATRONES DE FLUJO:

1.-Left/Right Alignment: La página del periódico New York Times utiliza este tipo de patrón ya que sabe exactamente que datos alinear a la izquierda y a la derecha (en donde se encuentra la noticia más relevante).



2.- Diagonal Balance: Un ejemplo es el calibrador de pantalla de la computadora en el cual podemos ajustar el brillo y color que queremos que nuestra pantalla tenga.


PATRONES DINÁMICOS:

1.-Responsive Disclosure: La página de mix up me va mostrando páginas diferentes conforme a lo que el usuario escribe en la ventana del bucador de mix up y este inmediatamente te da una respuesta cuando oprime el icono de la lupa.


2.-Responsive Enabling: En la página de la Wiki grupal podemos habilitar algunas funciones que nos faciliten su uso como las que se ven en la foto:


3.-Liquid layout: Una página del tenista Nadal es precisamente de este tipo ya que al momento de minimizarla, la información del menú se acomoda para que el usuario pueda ver los mismo que al maximizarla, con esto la página se vuelve más flexible para la comodidad de los que la visitan.

Sesión 18 Blog del personaje

Ahora comento que con respecto al blog de mi personaje haré un cambio, ya no será sobre Anclaje como he venido posteando hasta el momento, el blog de mi personaje será sobre una persona con la que me entrevistaré en la semana para conocerla y saber qué es a lo que exactamente se dedica, y cómo podemos llegar al público al que esta dirigido su negocio. En cuanto tenga la entrevista con ella continuare escribiendo el proceso del blog del personaje.

Sesión 18 Reflexión

En está sesión terminamos de ver los patrones de AGRUPACIÓN para después terminar con los de FLUJO Y los DINÁMICOS

3.- Closable Panels : Puedes abrir o cerrar una ventana conforme la vayas necesitando.
4.- Movable Panels (continuidad): El usuario decide que poner y que quitar en los paneles.

PATRONES DE FLUJO:
1.-Left/Right Alignment: La manera en la que el contenido se va distribuyendo tanto a la izquierda como a la derecha.

2.- Diagonal Balance: Cuando escoges un objeto el cual tiene una opción de balance. (como el panel de los colores)

PATRONES DINÁMICOS:

1.-Responsive Disclosure: Se abren ventana de acuerdo a lo que respondes. Conforme a lo que vas escribiendo la interfaz te va dando respuesta.

2.-Responsive Enabling: Cuando habilitas funciones(por ejemplo: aprietas una palomita y te abre una ventana o te muetra información)

3.-Liquid layout: Cuando el usuario maximiza o minimiza una ventana y al momento de hacerlo la página respeta y muestra la misma información.

Está vez comente en los blogs de: Ana Pau, Alysson y Bianca.

Sesión 17 Blog del personaje

Anclaje ofrece un servicio llamado CLOUD COMPUTING, pero ¿A qué se refiere?

Imagina poder trabajar en cualquier parte donde exista conexión a Internet, evitar la pérdida de información por una falla de tu computadora, mantener respaldos regulares de tu información, tener toda tu información segura y poder lograr un verdadero trabajo en equipo.

Esto es realidad gracias al Cloud Computing, con esta nueva tendencia, los sistemas se mudarán a Internet, permitiendo trabajar desde cualquier parte, con seguridad y tu equipo completo de trabajo. Acércate a nosotros para conocer como te podemos ayudar, cualquier sistema que necesites, podemos desarrollarlo.




Beneficios:
-Trabaja desde cualquier parte en donde exista conexión a Internet.
-Aprovecha el trabajo en equipo a su máximo potencial.
-Mantén tu información segura y con respaldos.
-No más pérdida de información.
-Posibilidad de trabajar con y sin conexión activa.
-Redundancia de datos inexistente.
-Software amigable y atractivo.

Sesión 17 Reflexión

En esta sesión vimos algunos temas los cuales se me hicieron muy interesantes y más obvios de precisar en una página al momento de hacer un análisis. A continuación presente las definiciones de los temas vistos:

PAGE LAYOUT: tiene varias ramas como:

PRINCIPIOS: que se divide en: Jerarquía, Flujo y Agrupación

Jerarquía: Consiste en ordenar los espacios, temas, objetos o palabras para que la página se vea agradable y dependiendo a lo que quiera ver el usuario. Se divide en:
-Esquina superior izquierda: La esquina con mayor peso visual dentro de la página.
-Espacio en blanco: utilizarlo como mensaje, da la sensación de orden.
-Fuentes Congruentes: Características de acuerdo a la jerarquía e importancia. Las diferencias son parte del mensaje.
-Colores y Contrastes: Utilizarlos por legibilidad. Dar orden lo cual es parte del mensaje.
-Subordinación: La colocación congruente con jerarquía.
-Formas y grupo: Formas que ayudan a agrupar (como los cuadrados, círculos, etc.)

Flujo: Como fluye la información de acuerdo a las necesidades que demanda el usuario.

Agrupación: Se divide en:
-Proximidad: lo que está junto se relaciona.
-Similaridad: Lo que se parece está relacionado (formas iguales = funciones iguales).
-Continuidad: La visión de formas continuas con relación es natural.
-Cierre: La vista tiende a cerrar espacios para agrupar lo relacionado.


PATRONES DE JERARQUÍA:
1.- Visual Framework: que todas las páginas de un sitio tengan la misma estructura para el contenido.

2.- Central Stage: En la parte del centro de la página este el contenido más importante.

PATRONES DE AGRUPACIÓN:
1.- Titled Sections: Cada sección lleva su título y sus respectivos subtemas.
2.- Card Stack: Cada agrupación es como una tarjeta.

Comente en los blogs de: Sandra,Jessica y Emanuel.

Sesión 17 Extraclase

PAGE LAYOUT:

PRINCIPIOS: Jerarquía, Flujo y Agrupación

Jerarquía:

1.-Esquina superior izquierda: La página del US OPEN es un ejemplo porque mi vista se enfoca en un principio al lado izquierdo en donde se encunetra precisamente el logotipo.

-Espacio en blanco: Swatch es una página que utiliza bastante los espacios en blanco con lo cuál proporciona una sensación de equilibrio y orden visual.

-Fuentes Congruentes: Esta página respeta la jerarquía de los temas de acuerdo a su importancia haciendo uso del tamaño y colores en la tipografía.


-Colores y Contrastes: En lapágina de Nike ordena los títulos por colores para hacer notar una diferencia entre ellos, además que proporciona cierto orden en la estructura.

-Subordinación: KENZO posiciona los temas de manera congruente y con jerarquía,como podemos ver del lado izquierdo de la página se muestra el título de FEMME con una tipografía más grande y de diferente color y de ella se despliegan sus repectivos subtemas.


-Formas y grupos: En esta página se acomoda la información en cuadros para mantener un orden y separar las secciones.

Flujo:
ejemplo: InDesign es un programa que te permite filtrarte en el contenido deacuerdo a tus requisitos, paso a paso.







contra-ejemplo: Maya es un programa que por default establece un formato, elusuario no tiene la opción de elegir los parámetros.



Agrupación:
-Proximidad: En la siguiente página se muestran diferentes cuadros juntos, todos ellos tienen que ver con temas respectivos al Manchester United.

-Similaridad: En la página de a! Diseño por ejemplo todos los temas del directorio del lado izquierdo tienen el mismo formato lo que guarda una cierta congruencia para el usuario.



-Continuidad: En la página de VOGUE los cuadros (mostrados en la imágen) son formas continuas que están relacionadas con un cierto tema.


-Cierre: Adobe,su página completa contiene muchas zonas con información, sin embargo por lo mismo la vista va agrupando la información que tiene relación entre sí.



PATRONES DE JERARQUÍA:

1.- Visual Framework: La página de Pedigree dentro de su contenido se mantiene la misma estructura para todas las secciones.

2.- Central Stage: En el centro de la página de Ford se maneja el contenido más importante.


PATRONES DE AGRUPACIÓN:
1.- Titled Sections: Del lado izquierdo de esta página se encuentran lo temas más importantes a tratar de los cuales se despliegan sus respectivos subtemas.
ejemplo:


contra-ejemplo: Por el contrario en la página de LG se encuentran del lado derecho los temas pero no se muestra el contenido dentro de ellos. Sería más comodo para el usuario verlos desde la lista principal para poder darle click desde ahí a estar dando clicks continuamente y esperar a que cada página se cargue y poder encontrar el producto de su interés.


2.- Card Stack: Cada agrupación es como una tarjeta.
ejemplo: En la página de ''Alice in Wonderland'', la manera en la que se presentan las imágenes de la galería es en forma de tarjetas que aparecen conforme al usuario lo requiera.

contra-ejemplo: Las agrupaciones de la página ATP muestra cada agrupación en forma de listas.

sesión 16 Reflexión

EXPOSICIÓN: Aplicaciones del trabajo colaborativo:
El software del trabajo grupal mejora el rendimiento en general de todo el proceso productivo. Es una herramienta poderosa que permite compartir toda clase de conocimiento relativo a una organización.
Ventajas: ayuda al trabajo en grupo, permite compartir conocimientos y experiencias, autmatiza sus actividades, ayuda a crear una memoria a la organización.
____________

El maestro llevo un invitado a la clase, un diseñador gráfico reconocido. El nos hablo de un tema que en lo personal me pareció muy interesante e importante para todos, un tema del cuál no nos hablan normalmente en clase, que es el cómo se lleva a cabo el diseño gráfico en la vida real y el trato con los clientes. En mi punto de vista nos mostró una serie de pasos que tenemos que tomar en cuenta para hacer un diseño:

1. Idea
2. El perfil del negocio
3. Necesidad
4. Las limitaciones,
5. FT(factor terrorífico)

Una página que hizo fue:
www.faustinus.com



En está sesión comente en los blogs de: Nuria, Miguel y Klau

sesión 16 Blog del personaje

Anclaje ofrece servicios: Web 2.0 /Creación de sitios de Internet
¿Qué es?
Un sitio de Internet está compuesto por varias página, estás páginas contienen información referente a las ofertas de la empresa o individuo propietario del mismo. El término Web 2.0 envuelve una serie de servicios y de funciones presentes en los sitios de Internet de redes sociales, donde los sitios de Internet dejan de ser estáticos, para convertirse en dinámicos.
Anclaje se encarga de desarrollar tu sitio de Internet desde el concepto inicial (diseño y desarrollo) hasta su publicación (hospedaje y dominio), teniendo así todos los servicios concentrados en un solo proveedor, brindándole comodidad y conveniencia a sus necesidades de publicidad.

BENEFICIOS:

• Publicidad constante los 365 días del año, las 24 horas del día.
• Creación de nuevos canales de comunicación para con el cliente (directos e indirectos).
• Correo electrónico personalizado.
• Presentación de tu empresa y todos los productos/servicios que ofreces.
• Seriedad y confianza para tus clientes.
• Posibilidad de recolectar información de manera rápida y sencilla.

sesión 16 Extraclase (no hubo)

En está sesión no hubo extra clase pero yo la utilizare para completar lo que me falto en la extra clase de la sesión pasada (15) que fue analizar los 12 tipos de patrones de usuario con forme a la pagina que elegí (Carolina Herrera)

Patrones de Usuario CH ">

Sesión 15 Extraclase

CH Analizando la página ">

sesión15 Reflexión

En esta sesión vimos la exposición de APLICACIONES PARA COMPARTIR CONTENIDO.
Mis compañeros empezaron a definir lo que es:
Web 1.0: solo vez la página y el contenido, el usuario no puede interactuar con él.
Web 2.0: Aplicaciones que generan la colaboración y servicios que remplazan las aplicaciones de escritorio.
De igual manera crearon una cuenta para el grupo en: slideshare.com, en la cuál anexe la exposición de las wikis.

En la segunda hora vimos los PATRONES DE NAVEGACIÓN: DE SEÑALES:
1.- Bread crumbs: contiene botones que nos permiten navegar dentro de unapágina como: HOME, OPTIONS, etc.
2.- Sequence Maps: es una secuencia que nos va diciendo donde estamos por paso: paso1, paso2, paso3,etc.
3.- Color-coded section: son espacios dentro de la página con colores, texturas para hacer resaltar la información.
4.- Anotated scroll bar: cuando hago scroll y me aparece un globito donde aparece en que página voy. Como en Adobe PDF o Word.

Comenté en los blogs de: Alysson, María José y Paulina Gutiérrez

Sesión 15 Blog del personaje

Anclaje cuenta con un método llamado E-Mail Marketing que sirve para que las empresas contacten a sus clientes, ya que cuentan con bases de datos de toda larepública mexicana, divididas por estados y algunos por segmentos más pequeños y especializados. Anclaje transmite tu mensaje aprovechando que los clientes potenciales de las empresas tienen el mensaje en la comodidad de su bandeja de entrada.

Los beneficios del e-mail Marketing son:

• Contacto directo con tus clientes potenciales, donde sea que revisen su correo elctrónico.
• No intrusivo o molesto, Anclaje respeta todas las normas anti-SPAM vigentes.
• Anclaje revisa constantemente las bases de datos para evitar correos basura, además tienen el método probado para envío, saben cuando y como.