Posts by carmen

Spotify para linux

3 de abril, 2012 - por | | Just for fun, Linux, Open Source

cebras corriendo librementeLa mayoría de las veces correr libremente te trae felicidad.

Después de unas cuantas semanas soportando los fallos en el comportamiento de spotify sobre wine que tenía instalada en mi ubuntu 11.04 me atrevo a instalar los paquetes para ubuntu que ofrece spotify.com

Os paso las instrucciones para lentillos como yo, :P, aunque en spotify os lo explican genial:

1. Abres el Terminal y editas este archivo: /etc/apt/sources.list

sudo vim /etc/apt/sources.list

2. Añades esta línea en la cabecera del archivo con in INSERT

deb http://repository.spotify.com stable non-free

3. Cierras el archivo guardando los cambios mediante un ESC y un :wq

4. Ejecutas los cambios mediante la siguiente orden:

sudo apt-get update

5. Instalas spotify:

sudo apt-get install spotify-client-qt

6. En aplicaciones, sonido y vídeo, tendrás tu enlace a la nueva aplicación. ¡A disfrutar de tu cuenta premium en spotify!

Un nuevo proyecto para grosshat: escuelainfantilvickie.es

23 de febrero, 2012 - por | | Proyectos

imagen de la home de escuelainfantilvickie.es

Cuando las profes de la guarde de Darío se enteraron de que nos dedicábamos al desarrollo web, nos pidieron que nos pusiéramos manos a la obra con su proyecto web. La oportunidad de trabajar para gente dedicada a la educación infantil y más en concreto, a la educación de nuestro peque, nos atrajo desde el primer momento. Así surgió escuelainfantilvickie.es. La idea fue empezar con un sitio muy clarito y bien organizado, principalmente orientado a las actividades que la escuela desarrolla con los peques, y a partir de ahí aportar progresivamente información relacionada.

Nuestra propuesta, como en proyectos anteriores de características similares, ha sido la de poner unas bases sencillas y flexibles, en las que todo el esfuerzo se concentre en aquellos recursos que ellas pueden crear (información, procesos de pedidos, etc.), y tener paciencia para ir poco a poco haciendo crecer ese punto de partida hasta algo que se parezca a lo que desean que sea el sitio. Siempre les recordamos a nuestros clientes que buena parte de su éxito está en sus manos: su tiempo para crear contenidos; sus ganas para pensar una y otra vez cuál es la mejor información; su esfuerzo para mantener informados a sus clientes y usuarios a través de noticias periódicas, etc.

Hemos escogido WordPress para el proyecto y le hemos dado la forma de un pequeño CMS. De esta forma, tenemos páginas para las distintas secciones de la escuela, entradas para las actividades que desarrollan, espacio para los menús diarios y noticias destacadas con la información más importante en cada momento del curso.

El esquema con el que empezamos es muy sencillo: navegación a las diferentes secciones que nos presentan la organización de la escuela, home con espacio para las noticias destacadas (mediante slide – jquery), las últimas actividades, menu diario, localización, psicomotricidad y datos de contacto.

Son muchas cosas con las que han tenido que manejarse: gestor de contenidos del sitio, cuentas de correo, lanzamiento y presentación del sitio, etc. Para todo ello han contado y siguen contando con el asesoramiento continuado de grosshat.

Esperamos que el proyecto web tenga mucho éxito, :).

Un nuevo proyecto de grosshat: moratayasociados.com

23 de enero, 2012 - por | | Proyectos

imagen de la home de moratayasociados.com

Hace unos meses se nos presentó la oportunidad de trabajar para gente dedicada a la producción artística y organización de actividades escénicas: moratayasociados.com. La idea ha sido desarrollar un sitio claro, elegante y organizado. Principalmente orientado a presentar su labor de producción artística en la web.

A diferencia de nuestros proyectos anteriores, morata y asociados es un “proyecto web escaparate”. El cliente nos insistió en la necesidad de enfocar su negocio a la web y presentarse, con el proyecto, a sus potenciales clientes. Así que con moratayasociados.com nos hemos esforzado en el planteamiento de las necesidades del negocio. Hemos conseguido que el sitio tenga una buena organización en cuanto a dicho objetivo y que sea muy sencillo de navegar de cara al usuario.

Hemos escogido WordPress para el proyecto y le hemos dado la forma de sitio web prescindiendo de su funcionalidad principal de blog. WordPress, como recurso tecnológico, es completamente maleable y pueden hacerse multitud de desarrollos personalizados a partir del mismo. Incluso el de prescindir de su naturaleza, :).

El esquema con el que empezamos es muy sencillo: home con presentación, planteamiento y división del negocio; llamadas a la acción para que el potencial cliente pueda contactar con la empresa fácilmente; páginas para cada una de las secciones principales (experiencia, proyectos, etc.). La elegancia del sitio se basa en las presentaciones de imágenes (definidas mediante jquery).

Esperamos que tenga éxito en la red, :)

Plugin de Gimp Save for Web para Ubuntu

15 de noviembre, 2011 - por | | Open Source, Tips

Me gustaría explicar cómo instalar el plugin de Gimp 2.6, Save for Web, para Ubuntu 11.04. Creo que es una de las opciones más útiles de Gimp de cara a la optimización de las imágenes si trabajas para la web. Y es tan fácil como ésto.

Abres la consola y escribes la siguiente orden:

sudo aptitude install gimp-plugin-registry

Una vez que se ha instalado el paquete completo, haces un Exit para salir de la consola, abres el Gimp y voilà. Ya tienes la opción disponible en el menú de Archivo.

Espero que os sirva, :)

Instalar OpenOffice 3.3. para Ubuntu

28 de septiembre, 2011 - por | 5 comentarios | Linux

Muchas veces tengo dificultades para encontrar la ayuda concreta a la instalación de un nuevo paquete para Ubuntu. Dado que en esta ocasión me ha costado horrores dar con la solución, os paso a explicar, de la forma más sencilla, cómo se instala Oppen Office 3 en español para Ubuntu mediante Consola/Terminal.

1. Desacarga Oppen Office 3.3. desde su sitio oficial en español. Esta es la ruta. Para que te sea más fácil, guarda el paquete en el directorio de Descargas/

2. Abre la consola y vete al directorio en el que te has descargado el paquete. Como hemos quedado, en Descargas/. Escribe esta orden y dale al intro.

 ~$ cd Desacargas/

3. Escribe un ls y otra vez intro. Verás, entre todos los documentos que tengas en el directorio, el siguiente paquete de OpenOffice: OOo_3.3.0_Linux_x86_install-deb_es.tar.gz

4. Descomprime el paquete en el mismo directorio Descargas/. Escribe el siguiente comando e intro.

 ~/Descargas$ tar xvzf OOo_3.3.0_Linux_x86_install-deb_es.tar.gz 

5. Una vez descomprimido, entra en el nuevo directorio llamado OOO330_m20_native_packed-1_es.9567/ mediante un cd. Si haces un ls dentro del directorio, verás que hay una carpeta que dice DBES.

Pues bien, accede a DBES mediante un cd DBES/ y ejecuta la siguiente orden:

 ~/Descargas/OOO330_m20_native_packed-1_es.9567/DEBS$ sudo dpkg -i *.deb 

Despues de pedirte contraseña sudo, comenzará el proceso de descompresión de los paquetes de OpenOffice 3.3.

6. Una vez que se han instalado estos paquetes, debes entrar en el directorio desktop-integration que se encuentra en el directorio en el que te encuentras. Recuerda, DBES/. Entra en el directorio y ejecuta la siguiente orden:

 ~/Descargas/OOO330_m20_native_packed-1_es.9567/DEBS/desktop-integration$ sudo dpkg -i *.deb 

¿Para qué hacemos ésto? Para que la instalación se integre en el escritorio y en el menú Aplicaciones/Oficina te aparezcan los accesos directos a cada una de las aplicaciones.

No hace falta que reinicies el equipo. Prueba que el nuevo OpenOffice te funciona. Y recuerda, es importante, antes de comenzar con la instalación, desinstalar el openoffice de la máquina si es que lo tenías instalado con anterioridad. Para ello ejecuta esta orden en la consola.

 sudo apt-get remove openoffice* 

Charla de Nate Koechley, desarrollador front de Yahoo! – séptima entrega -

20 de julio, 2009 - por | | Análisis, Frontend

El 18 de marzo se publicó en YUI Theater la charla de Nate Koechley, primer ingeniero front de yahoo! Grosshat ha pensado que sería interesante traducir al español algunas partes con mucha sustancia de la transcripción de la charla, ya que resultan muy esclarecedoras sobre el desconocido papel que desempeña el desarrollador front en las empresas que se dedican a la web (frontend engineer en USA).

Nuestra traducción de la séptima parte de la charla

Ahora vamos a echarle un vistazo a la perspectiva histórica hablando sobre algunas de las creencias y principios. Me gustarÍa profundizar en algunas de las principales partes de la tecnología que tienen que tener en cuenta un ingeniero del interfaz.

Lo primero es el contenido de la capa: la capa HTML. Debe ser lo primero en el día a día de trabajo – queremos conseguir unas base sólida, antes de comenzar con otras partes tecnológicas. Antes de ponerte a escribir HTML tienes que definir en qué tipo de HTML vas a escribir mediante el doctype. ¿Qué es el doctype? El doctype es lo primero que aparece en un documento HTML. El elemento contiene una indicación sobre la definición del tipo de documento – lo cual sirve de indicación definitoria para el lector de la hoja, es decir, es una explicación de la tecnología que estás utilizando. En la práctica esto es importante porque da lugar a que los navegadores se comporten de modos diferentes. A principios de esta década, dado que los más modernos navegadores se estaban desarrollando, existía la preocupación de que si no se fijaban las singularidades de los viejos tiempos, los sitios que no se actualizasen podrían tener dificultades de renderización en los nuevos navegadores. Por lo que se quería ofrecer una forma de apoyar la idea de la compatibilidad con versiones anteriores, de sitios estrafalarios, a pesar de que los desarrolladores estaban empezando a crear más estándares basados en los sitios. Así que los vendedores de los navegadores eligieron el doctype como la forma de que los autores del documento – desarrolladores, fronted – optaran por alguno de los formatos existentes. En Yahoo!, utilizamos el HTML Estricto 4.01 DTD dentro de nuestro doctype, y esto, junto con varios otros doctypes, le dice al navegador el estándar que seguimos.

Una cosa más sobre el modo de los estándares vs al modo de las peculiaridades. Los navegadores realizan un gran trabajo como adivinos – somos capaces de lanzarles código propenso a errores pero los navegadores están diseñados para ser resistentes así que arreglan muchos de los fallos o hacen su mejor aproximación. Ellos hacen un buen trabajo de adivinación pero hacen un mejor trabajo si no tienen que adivinar en nuestro nombre. Así que como ingenieros fronted, nosostros debemos definir exactamente el lenguaje en el que escribimos – en este caso el HTML Estricto 4.01 – y eso nos asegurará obtener la mejor visualización posible.

La segunda cosa que me gustaría comentar sobre el marcado: ¿cuál es la presentación por defecto de los elementos HTML? ¿Cómo se pinta un elemento strong? ¿Y un H1? ¿Y una lista? Y son preguntas con trampa porque el marcado no tiene una presentación visual inherente – no hay nada en el HTML en sí mismo que diga que un elemento H1 tiene que ser grande y destacado y con mucho margen alrededor de él. Eso, en realidad, lo define la css dentro del navegador. Y así, darnos cuenta de que el marcado no tiene una visualización inherente nos libera para usarlo tal y como fue diseñado. El trabajo del marcado mejora el contenido de la página y se envuelve de aquellos elementos que le dan al contenido más significado. Podemos coger una cadena de texto y decir: esta es la cabecera. Podemos coger una serie de frases y decir: esto es una lista. Marcas lo que tienes y lo enriqueces con más significado.

Pero como ya he mencionado, los diferentes navegadores llaman al fichero interno CSS que nos proporciona la presentación de los elementos HTML, incluso de aquellos elementos que no forman parte del HTML en sí mismo. Esta es la razón por la que hemos creado, como parte de la librería YUI de Yahoo!, un fichero que se llama “CSS Reset”. Este fichero normaliza la presentación de los elementos HTML en diferentes navegadores. Si tienes un fichero CSS Reset, ya sea el de YUI o el que hayas desarrollado tú mismo, las páginas se van a ver iguales – hemos hecho que el navegador quiera usar nuestra preesentación inicial – reduciendo así el campo de juego. Así que en este caso ùedes cer que en la primera línea hay una cabecera h3 y, después, un h4, h5 y h6. Aquí obtenemos una lista y aquí otra. Y podríamos esperar que la lista se comportara con puntos o números – nosotros los hemos suprimido, así que sólo tratamos con HTML sin pensar en cómo podría verse en la página. Esto nos libera, realmente, y nos hace ocuparnos de qué elemento utilizar preocupándonos, únicamente, de su significado.