Nueva versión de ColorStyler

Bueno lo prometido es deuda, ya hemos vuelto con una nueva versión de colorstyler en la que hemos mejorado el aspecto visual y algunas recomendaciones de todas aquellas personas que han probado nuestro programa. Muchas gracias a todos.

 

Recordar que la hemos subido a la forja.

 

 https://forja.rediris.es/frs/?group_id=144

Otorgada mención especial

Hola a todos ya estamos aquí de nuevo,  después de saber que nuestro proyecto no a sido seleccionadazo o para la final, pero no pasa nada porque al menos nos han otorgado una mención especial, que nos ha subido un poco la moral que se nos reconozca un poco todo el esfuerzo realizado.

http://concurso-softwarelibre.us.es/noticias.html#finalistas

Unas merecidas vacaciones

Damos por terminado el proyecto de cara al concurso , continuaremos con el despues de vacaciones , por ahora nos cogemos una semana sabática para desconectar. En la forja encontrareis tanto el proyecto como toda la documentación que hemos ido generando a lo largo de este periodo de tiempo . Podeis encontrarlo todo aqui :

https://forja.rediris.es/projects/colorstyler/ 

Hasta despues de Semana Santa ;)

Nueva version y Documentacion

Poco a poco se va acercando el final del concurso , lamentablemente no vamos a poder acabar todos los detalles que hubiesemos querido pero aun asi estamos bastante contentos con el resultado aunque sabiendo que no esta acabado al 100% . Hoy hemos subido una nueva version a la forja en la que hemos mejorado una serie de detalles asi como añadido nuevas funciones al API del sistema. Las nuevas funciones añadidas son :

$API->Opuesto([Color_sin_#]);
Función: Calcula el color opuesto.

$API->Triada([Color_sin_#]);
Función: A partir de un color calculo los colores de la triada.

$API->Monocromo([Color_sin_#]);
Función: Calcula los colores análogos, uno hacia el blanco y otro al negro.

$API->ConvertDectoHex([Decimal],&[Hexadecimal]);
Función: Convierte un numero decimal a hexadecimal.

$API->Converthextodec($[Hexadecimal],&[Decimal]);
Función: Convierte un numero hexadecimal a decimal.

$API->contrast([Color_sin_#],[Color_sin_#]);
Función: Devuelve el valor del contraste de los dos colores.

$API->shine([Color_sin_#],&[Color_sin_#]);
Función: Devuelve el brillo del color;

$API->createCSS([ ruta_al_fichero ], [Array_datos])
Función: Crea una copia del CSS del template dentro de la carpeta SAMPLES y dentro de una carpeta creada con el nombre del año+mes+hora+minutos+segundos+(un random entre 1000 y 9999)

$API->editCSS([ruta_al_fichero ],[ Array_datos])
Función: Edita el CSS creado con anterioridad con los parámetros pasados por el array

$API->buildHTML([ ruta_al_fichero ], [ ruta_y_nombre_fichero_a_crear])
Función: Construye el index.html para descargar, creando una copia del index de template incluyendo la vinculación al estilo creado

$API->addFile([ruta_y_nombre_fichero],[ruta_y_nombre_donde_colocar_fichero)
Función: Añade al Zip el fichero especificado con el nombre y la ruta especificada

$API->saveZip([ruta_y_nombre_con_el_que_guardar_el_fichero])
Función: Crear el Zip en la carpeta que se le especifica y con el nombre que se le especifica a través de la ruta . El zip se creará con los ficheros que se han ido añadiendo con la función addFile

$API->downloadZip([ruta_donde_crear_zip_y_nombre_zip])
Función: muestra el Zip a descargar a partir de la ruta al fichero
—————————————————————————-

Podeis consultar las funciones del nuevo API v2.0 con más detalle en la documentación de la Forja al igual que otra serie de documentos en los que explicamos con detalle el funcionamiento de gran parte de la aplicación

https://forja.rediris.es/docman/?group_id=144

—————————————————————————-

La Version 1.01 de ColorStyler la podeis descargar de:

 https://forja.rediris.es/frs/?group_id=144

Un pequeño FAQ del proyecto

Ya queda poco para que culmine el plazo de entrega del proyecto y esperamos poder
llegar a tiempo ya que despues de haber dedicado tanto tiempo al proyecto queremos
ver cuales son las sensaciones de la gente al verlo . Durante el desarrollo del proyecto
no hemos tal vez dado una información demasiado precisa sobre las características del
proyecto tambien debido a que como los plazos del concurso tampoco han sido muy
largos y además hemos tenido que llevar el curso al dia no hemos tal vez dado la suficiente
información de cara a los lectores del blog . Asi que a continuación os redacto las principales
dudas y una definición más clara de este

Que es colorstyler?

ColorStyler es una aplicación creada con el proposito de solucionar el problema que mucha
gente tiene a la hora de hacer una web , conseguir un diseño , una gama de colores ,
validar el codigo XHTML , CSS solucionar los problemas entre los distintos navegadores …
y una larga lista de etc . Aqui es donde entra la aplicación que hemos creado se encarga de
solucionar todos esos problemas pero desde una visión mucho más sencilla intentando
abarcar tanto a gente con conocimientos avanzados de XHTML y/o CSS como para los
principiantes en la creación de webs .Por ejemplo:

la gente con conocimientos avanzados de XHTML y/o CSS  seguro que siempre se ha
encontrado con la dificultad a la hora de saber con que colores iba a colorear  su web ,
que color para los enlaces , que color para el texto , en este navegador se ve bien , en este
no  …

Las dificultades de los principiantes  son otras : como pongo este div aqui? , que propiedad
tengo que poner para que haga esto? ,  porque se me descoloca todo? ……

Aqui es donde entra nuestra aplicación a los ”profesionales” les proporcionarmos una serie
de colores a partir de un solo color que mediante técnicas que ya hemos explicado en el blog
como la Triada , Opuesto o Monocromo creamos un abanico de colores que en mayor o menor
medida tienen una relación con el color seleccionado , esto en gran medida ayuda a no perder
el tiempo buscando / probando colores con photoshop

A los ”principiantes” les proporcionamos la posibilidad de mediante una serie de sencillos
pasos confeccionar una web validada y personalizable

Como funciona ?

Hemos creado una aplicación muy fuerte estructuralmente , es decir , nuestro proposito
desde un principio era poder dar la posibilidad al usuario de que si llegado el momento desea
crear un nuevo paso que no esta por defecto con el programa poder hacerlo facilmente , para
ello hemos creado un API que a traves de sencillas funciones claramente explicadas en la
documentación del proyecto poder crear un paso sin por ello tener que saber como funciona
la aplicación por dentro , esto puede ser de gran ayuda a quien quiera modificar la aplicación
para adaptarla a sus necesidades.

La aplicación muestra los pasos que tiene registrados en el orden que se le expecifica mediante
un archivo de configuración y muestra los pasos siguiendo ese orden

Si quiero adaptarla a mis necesidades puedo?

Sin duda SI la aplicación ha sido creada para que cada uno de sus partes pueda ser modificada
sin por ello afectar a lo demás . Por ejemplo :

INTERFAZ

el interfaz de la web puede ser modificado cambiando su aspecto sin que por ello la aplicación
deje de funcionar .  Esto es debido a que hemos separado el codigo de la apariencia.
creando un HTML en que coloquemos los siguiente tags :

  • {contenido}
  • {template}
  • {css}
  • {js}

y ya está la aplicación ya funciona.

IDIOMAS

Al igual que con el interfaz tambien hemos incluido la posibilidad de poder adaptar la aplicación a
otros idiomas para ellos hemos creado un fichero que se encuentra en la carpeta /language en el que se pueden colocar la traducción de los tags mediante la funcion de php DEFINE()
y desde el archivo de configuración especificar el idioma que deseamos usar

INTERFAZ DE UN PASO 

tal y como hemos explicado en la interfaz del programa en general tambien podemos modificar
la interfaz de cada uno de los pasos en caso de querer adaptarlos a nuestras necesidades
sin que por ello el paso deje de funcionar

Es facil de instalar?

Facil no , FACILISIMO  solo necesitamos tener apache y php funcionando en el pc donde deseamos
instalarlo y descomprimir el contenido del zip en la carpeta raiz del localhost en el caso de WAMPSERVER es la carpeta WWW. Y ya esta solo haciendo eso ya lo tendras funcionando

Primera Version disponible

Como ya visteis en el post anterior incluimos 2 capturas del programa , ahora os traemos una primera release aunque todavia por terminar ya se puede ver a grandes rasgos en que consistirá el programa.

Aunque todavia no habiamos hecho uso de la forja para subir ficheros hoy hemos agregado la primera version manejable del programa junto un manual para la creación de nuevos pasos por parte del usuario.

 Enlaces

primera versión :  Colorstyler.rar
Documentacion : Creación de un nuevo paso

Esperamos vuestras opiniones ;)

Primeros pantallazos

Bueno ya tenemos los primeros pantallazos de la aplicación en funcionamiento, es un poco tarde pero con las horas de trabajo que le estamos metiendo al proyecto seguro que la tenemos acabada!!!

estructura

color

Reanudamos la marcha

Bueno hemos tenido apartado el proyecto un tiempo debido a la suma de examenes + entrega de practicas finales , etc … . Pero hemos vuelto a ponernos manos  la obra dentro de muy poco empezaremos a poner screens del programa asi como a darle uso a la forja que la tenemos abandonada . En parte no hemos estado dando detalles del programa porque nuestro proyecto requiere mucha labor de investigacion sobre el algo que en principio parece tan cotidiano como es el color .Pero para entender el color y sus particularidades asi como las formulas matemáticas que nos permitirán poder dar color a los diseños hemos necesitado de mucho tiempo para
la busqueda, entendimiento y sobretodo aplicación de esos conocimientos a algo
factible que podamos usar. Por eso es posible que muchos de los post que hemos ido incluyendo en este blog no hayan sido demasiado interesantes por su denso contenido y a veces poco agradable de leer pero si se os ha hecho pesado a vosotros leer estos post muy resumidos no os podeis hacer una idea de lo que ha sido para nosotros xD

Pero hemos vuelto y en breves comenzaremos a sacar Betas del programa que espero 
que os guste ;)

Formulas Abiertas para garantizar la aprobación de la w3c de las webs generadas!!!

Dos colores proporcionan buena visibilidad del color si la diferencia del brillo y la diferencia del color entre los dos colores son mayor que una gama del sistema.

El brillo del color es determinado por el fórmula siguiente:
((Valor rojo X 299) + (valor verde X 587) + (valor azul X 114)) /1000
Nota: Este algoritmo se toma de un fórmula para convertir valores del RGB a los valores de YIQ. Este valor del brillo da un brillo percibido para un color.

La diferencia del color es determinada por el fórmula siguiente:
(máximo (valor rojo 1, valor rojo 2) – mínimo (valor rojo 1, valor rojo 2)) + (máximo (valor verde 1, valor verde 2) – mínimo (valor verde 1, valor verde 2)) + (máximo (valor azul 1, valor azul 2) – mínimo (valor azul 1, valor azul 2))

La rabia para la diferencia del brillo del color es 125. La gama para la diferencia del color es 500.

PD:Extraido de la http://www.w3c.es/

links interesantes sobre la combersión de los formatos del color,para poder facilitar el manejo:

http://www.cs.rit.edu/~ncs/color/t_convert.html

http://es.wikipedia.org/wiki/YIQ

http://juicystudio.com/services/colourcontrast-es.php

http://www.snook.ca/technical/colour_contrast/colour.html

Colorear los fundamentos

El color es la característica perceptiva de la luz descrita por un nombre del color. Específicamente, el color es ligero, y la luz se compone de muchos colores, nosotros consideramos los colores según el espectro visual: rojo, anaranjado, amarillo, verde, azul, y violeta. Los objetos absorben ciertas longitudes de onda y reflejan otras de nuevo al espectador. Percibimos estas longitudes de onda como color.
Un color se describe en tres maneras:
31 / 41
1.Por su nombre.
2. Por su puerza o degradado,
3. Por su valor o ligereza.
Aunque son rosadas, carmesí, y fresa son todas las variaciones del rojo del color, cada tonalidad son distintas y distinguidas por su croma, saturación, intensidad, y valor.
Croma: Cómo es puro una tonalidad está en lo referente a gris Saturación: El grado de pureza de una tonalidad. Intensidad: El brillo o la matidez de una tonalidad. Uno puede bajar la intensidad agregando blanco o negro. Luminiscencia/valor: Una medida de la cantidad de luz reflejó de una tonalidad. Esas tonalidades con un alto contenido del blanco tienen una luminiscencia más alta o la valoran.
La cortina y el tinte son los términos que refieren a una variación de una tonalidad.
Cortina: Una tonalidad produjo por la adición del negro. Tinte: Una tonalidad produjo por la adición del blanco.

Entradas siguientes »