Análisis de experimentos

Código

En la parte de código se estuvo trabajando los últimos 3 días de esta semana, teniendo como meta agregar diccionarios que contuvieran marcas y tipos de productos para poder filtrar de una manera más organizada los tipos de certificaciones que puede tener cada producto por su tipo, así como por la marca.

Por ejemplo un tipo de producto es el aceite que puede tener ciertas certficaciones solamente y de esta manera lograr restringir la búsqueda para que no sea muy extenso el número de posibilidades a elegir de certificaciones.

En las herramientas del navegador se puede ver como se identifican las marcas y los tipos de producto.

La marca es 'Cristal' y el tipo es 'Aceite'.

La marca es 'undefined' ya que esa marca no esta incluida en el diccionario.

Y de esta manera hacer el filtro como sigue:
Tipo de producto > Marca > Certificaciones posibles


También se agregó la tienda HEB al dominio permitido por la extensión para poder hacer también búsqueda de productos ahi y de esa manera cumplir con el requisito de que la extensión se pueda usar en dos tiendas en línea.

HEB online.

Sin embargo la página de HEB esta protegida de alguna manera para no agregar jquery ni javascripts en su contenido, por lo que se estará trabajando en eso lo que resta de esta semana para solucionar ese problema.

El código se encuentra en el repositorio.


Redacción de tesis

Se trabajó en la redacción los primeros días de esta semana y se realizaron los siguientes avances:

• Corrección de ortografía
• Corrección en bibliografía
• Se agregaron algunos experimentos de usabilidad para analizar los resultados.

En la siguiente semana se espera ya tener el sistema de alguna manera más completa para empezar a hacer las pruebas y checar si funciona en diferentes tiendas en línea y hacer los experimentos de rendimiento.

Análisis de experimentos; agregaciones pendientes

Herramienta web

Esta semana se avanzó en la extensión de Chrome para mostrar algo más amigable y un diseño que sea muy semejante al que se quedará al final.

Se cambió la manera de mostrar el sidebar ya que antiguamente se mostraba como un elemento que aparecía y desaparecía al momento de picar al botón del plugin que se muestra al lado de la barra de direcciones del navegador. El plugin se veía de esta manera:

Versión antigua

Versión antigua

Como se puede ver en las capturas de pantalla, el plugin tenía colores muy claros que se perdían con la página web de la tienda en línea, así que se decidió cambiar estos colores, además de agregar las transiciones al momento de esconder o mostrar la información.

En seguida se muestran una serie de capturas de pantallas, de como fue cambiando la vista del plugin durante esta semana de trabajo:

Se agregó un botón en la esquina derecha superior para el sidebar.

El sidebar desplegado.

Se modificó el color del botón y se agregó un icono que represente el plugin.

Se cambio el color del sidebar.

Se agregaron los eventos de javascript.

Después de cambiar colores y haber agregado las transiciones se investigó como poder combinar colores de texto y fondo, teniendo en cuenta que se quiere que el plugin tenga un fondo que contraste, entonces se buscó que paleta de colores sería adecuada, se encontró la página http://colorschemedesigner.com/ , y se utilizó por lo pronto la siguiente paleta de colores generada http://colorschemedesigner.com/#2P41Tg0sSw0w0, es sólo una sugerencia ya que los colores aún no están completamente definidos, lo único que se tiene pensado es que el color del sidebar no debe ser blanco ya que se confunde con el fondo de la tienda.

Paleta de colores.

Después de investigar como poder combinar colores (aún falta una elección definitiva), se buscó si existía ya alguna manera de mostrar de manera amigable, clara y rápida la información ambiental de productos, se encontraron dos etiquetas que parecen ser buenas opciones para poder partir de esta información para representar y mostrar:

http://iopscience.iop.org/1748-9326/6/1/014017/fulltext/

http://www.greencirclecertified.com/multi-attribute.html

Se agregaron algunos de estos datos solo a manera de prueba, para ver la manera en que se van a mostrar los datos, así es como está actualmente el plugin:

Versión actual.

Aún hay que modificar la manera de visualizar la información, ya que hay que agruparla y ver si está bien mostrarla con gráficas, estrellas, iconos de colores o cualquier otra forma de representar los datos y elegir la mejor para mostrar más datos ecológicos con menos elementos y de la manera mas clara y ordenada.

El video para mostrar el funcionamiento actual que se tiene del plugin:

El código se encuentra en el repositorio.

Redacción de Tesis

• Se corrigió la ortografía de los capítulos 1 al 4.
• Se reescribió los objetivos y métodos de estudio que se encuentra en el apartado de resumen.
• Se agregó metodología basada en el desarrollo ágil al capitulo de Solución propuesta.
• Se agregó contenido al capítulo de evaluación.

Avances para la siguiente semana

• Se terminará el capítulo de Solución Propuesta.
• Se tendran los experimentos más definidos.
• La extensión mostrará los datos ecológicos seleccionados.
• La extensión funcionara en una segunda tienda en línea.
• Se agregarán imágenes de eco-etiquetas al capítulo 2.

Diseño experimental

Trabajo de la semana 8

Código

Los primeros 3 días de esta semana se comenzó a hacer el catalogo de los productos que se van a tener en la base de datos, utilizando Ruby on Rails como framework de desarrollo, SQLite para la base de datos y CSS para dar estilo al HTML.
Lo primero que se creó fue un Catálogo, en donde el catálogo tiene "Products" , a su vez los productos tienen "name", "trademark" y "ecolabels".

De esta manera se puede acceder al servidor y obtener un json que contenga el producto con su información, que hasta la fecha se limita a esos tres campos pero se irán agregando más cuando se tengas las características que se van a tomar en cuenta.

Este es el controlador que se tiene hasta ahora, para obtener json:


Y el ejemplo de la vista:



Estos cambios, y los demás para que funcione el servidor están en el repositorio: https://github.com/cecyurbina/EcoFriendlyPlugin

Para la siguiente semana se espera poder hacer consultas directamente del plugin, al servidor.

Redacción

Los siguientes dos días de esta semana se dedicaron a las correcciones de la semana pasada y las de esta semana, y un borrador del diseño experimental.

• Se arreglaron principalmente faltas de ortografía como acentos y puntuaciones.
• Se agregó mas datos a la autobiografía.
• Se arregló los URL de la biografía.
• Se terminó el resumen con lo que se tiene hasta ahora, faltan la conclusiones.
• Se hizo un borrador del diseño experimental.

Para la próxima entrega se terminaran todos los capitulos antes del capítulo 5, y se llenará con más informaciión el capítulo 5.

Implementación de la solución propuesta

Semana 7

Código

Esta semana se trabajó en  implementar un sidebar que pudiera ser colapsable. es decir que mostrara alguna a transición, con toggle("tiempo_seg") y/o toggleClass("class_css").

La función que se estuvo probando fue la de toogleClass aunque hace una transición el efecto no se ve muy amigable para el usuario ya que se esta poniendo el tamaño del sidebar en pixeles en vez de en porcentajes, para esto se utilizaron funciones básicas de jQuery, sin embargo el resultado no fue el esperado debido a las limitaciones. En esto se estuvo trabajando desde la entrega pasada que fue el día viernes 28 de febrero, hace 3 días, es por eso que se avanzó poco en la implementación pero se logró el objetivo de probar las transiciones.

Este avance de código se encuentra en https://github.com/cecyurbina/EcoFriendlyPlugin.

Para la próxima entrega se espera poder implementar estas funciones de jQuery pero con modificaciones propias de Javascript y CSS como se muestra en el siguiente ejemplo:

http://startbootstrap.com/templates/simple-sidebar.html

Otro tema que se estuvo trabajando en cuanto a la interfaz web fue checar si es o no posible incluir esta extensión en un navegador de dispositivo móvil, al entrar a Chrome web store desde un dispositivo Android este es el resultado: 

Tableta Android 4.4.2

Redacción

Esta semana se tuvieron muy pocos días (3 días) para trabajar en la redacción de la tesis, sin embargo se logró un avance en cuestión de corrección de errores y completar los capítulos anteriores al de solución propuesta.

Se utilizó \texttt{} para dar estilo a los nombres de herramientas, además se agregó a cada herramienta cuando es mencionada por primera vez una referencia de tipo \footnote que contiene la página oficial de los desarrolladores de esta herramienta.
Lo que da como resultado una pequeña referencia en la misma página en la que se hace mención de la herrmaienta, referenciado por un pequeño número que se pone automáticamente de acuerdo al orden en que fueron agregados.

También se agregó en el archivo .bib una referencia a un Estándar ISO usando @misc.

La lista de las características que se comparan en la tabla de trabajos relacionadas fue renombrada para mantener la consistencia.

Por último en el capítulo de Solución propuesta se agregaron cajas a las imágenes para poder separar el espacio que va a ocupar cada una, y se agrego la metodología tentativa que se va a seguir en el proceso de software.


Para la próxima semana en el código se va a realizar el avance ya dicho en la sección anterior y en la redacción las correcciones que aún faltan y lo de la semana correspondiente.