Categories
BackEnd Develop FrontEnd Design FrontEnd Develop xarop2020

Xarop 2020

Creation Date: 1998-03-25T05:00:00Z

22 anys d’història

Des de el 1998 online, sense interrupció però sense gaire dedicació.

#EnCasaDeHerreroCuchilloDePalo diuen en castellà. I aquí sempre ha estat així.

xarop.com

Ja torna tocar a fer una nova renovació. Aquest cop la vull documentar i fer-ho com si fos per a un dels meus millors clients.

Comencem amb una llista per ordenar el procés i anar pas a pas:

  1. Redisseny del branding
  2. Disseny de la nova web
    1. BackEnd
    2. FrontEnd
      1. Wireframes
      2. Disseny UI/UX
      3. Prototipatge
      4. Desenvolupament
Categories
FrontEnd Design Portfolio

xarop card

En casa de herrero cuchillo de palo.
Ya era hora que me diseñara unas tarjetas de visita.
Aquí 3 alternativas.
Categories
FrontEnd Design UI/UX

10 herramientas básicas para el diseño web freelance

Trabajar como freelance requiere generarse un entorno adecuado para realizar con éxito los proyectos, dedicar el tiempo necesario en un espacio físico adecuado y tranquilo lo mas alejado posible de distracciones (domésticas, ociosas, etc.)

En este post reflejo mis 10 herramientas fundamentales para el desarrollo de mis tareas, no son todas ni son las mejores, simplemente son con las que me siento mas cómodo.

Lo indispensable es un hardware, en mi caso un ordenador portátil ligero pero potente, con buena pantalla (16″, 1600x900px) y tarjeta gráfica dedicada. He elegido un portátil porque si se da al caso puedes transportarlo a casa del cliente, reuniones o trabajar ocasionalmente fuera de la oficina. Para mas comodidad en la oficina tengo un monitor extra (23″, 1920×1080) y un ratón y un teclado completo mas ergonómicos, así como una impresora que cada vez utilizo menos. Para estar conectado permanentemente e incluso realizar alguna tarea (consultar y responder emails, twittear, etc) se ha hecho indispensable un móvil con tarifa de datos, en mi caso un Android de HTC. También dispongo de un pequeño netbook con SO Jolycloud que por su ligereza (menos de 1kg) transporto a eventos o reuniones dónde el móvil se queda corto y  el portátil pesado.

A pesar que en este mundo OSX de Apple es el SO mas utilizado como Sistema Operativo, en el portátil de oficina actualmente utilizo Windows 7.

Las aplicaciones básicas las podemos dividir en 2 tipos, las desktop (que te instalas localmente en tu ordenador) y las online (aplicaciones y u utilidades que viven y funcionan en la internet, “la nube”). Para mi el ideal seria que todas estuviesen en la nube, por lo que no dependerías de un hardware único y concreto sino que podrías acceder a ellas desde cualquier dispositivo. Existen aplicaciones gráficas y de programación online, pero aun no son lo suficientemente potentes y manejables para poder desarrollar un proyecto con agilidad. Actualmente de las 10 aplicaciones que mas utilizo únicamente tengo 3 instaladas en mi ordenador (el navegador, el editor gráfico y el editor web)

  1. Navegador web: Es la aplicación reina, siempre abierta, además de  buscar información es el puente para utilizar todas las aplicaciones, herramientas y utilidades online, así como, gracias a sus plugins, ayudarme a realizar algunas tareas básicas en el desarrollo web (inspeccionar y ajustar códigos, capturar pantalla, etc.). Actualmente utilizo Chrome por su velocidad y simplicidad aunque también tengo instalado Firefox, Safari, Explorer y Opera para testear los sitios que desarrollo.
  2. Editor gráfico: Los diseños, después de plantearlos por escrito y esbozarlos en papel hay que plasmarlos en imagen. En este caso Fireworks de Adobe es mi segundo software mas utilizado ya que está específicamente pensado para este propósito (diseño web). Puntualmente utilizo Photoshop para algún retoque fotográfico, y flash y algún editor de vídeo para las animaciones.
  3. Editor web: Para maquetar y “picar código” (HTML, CSS, PHP, js, …) desde ya hace muchos años utilizo Dreamweaver, también lo utilizo como administrador de ficheros y cliente FTP de mis sitios.
  4. Email: El correo electrónico es fundamental, y poder disponer de él desde cualquier dispositivo (móvil, netbook, tablet, etc) y desde cualquier sitio es vital, por eso he optado por  Gmail de Google, es rápido y potente y en él tengo todas mis cuentas de correo. Desde el mismo utilizo la mensajería instantánea que ofrece la plataforma de Gtalk integrada y sin salir de la web.
  5. Ofimática: Aun Microsoft Office es la suite más utilizada, yo en local la he sustituido por Open Office (abierta y gratuita), pero básicamente utilizo Google Docs para lealizar los presupuestos, facturas, presentaciones, etc. ya que estos documentos se quedan en la nube y puedo consultarlos y editarlos desde cualquier sitio.
  6. Almacenamiento/backups: Disponer de una copia de seguridad de tus ficheros, sincronizarlos desde los diversos ordenadores y a la vez poder acceder a ellos desde cualquier sitio ha hecho de Dropbox una herramienta imprescindible.
  7. Redes Sociales: Estar al día, ver que hacen los colegas, observar tendencias, compartir conocimientos, etc. etc. hacen las redes sociales un medio que  ningún profesional puede despreciar. En LinkedIn tengo mi CV y mis contactos mas profesionales (posibles clientes), twitter es básico para intercambiar feedback con los colegas de oficio y facebook con el mundo en general.
  8. CMS: Para construir y, a posterior, gestionar una web, la mejor alternativa es utilizar un gestor de contenidos (Content Manager System) WordPress es gratuito, sencillo y potente gracias a la cantidad de desarrolladores y plugins que dispone esta plataforma.
  9. RSS: Existen cantidad de blogs interesantes, siempre dedico un momento al día para consultar los posts nuevos en el agregador de feeds, en mi caso Google Reader.
  10. Gestor de tareas: Gestionar las tareas es básico para una buena productividad, y más si trabajas en equipo.  Hiveminder es una buena plataforma online para este menester.

Después en mis bookmarks tengo infinidad de enlaces a herramientas para cosas mas específicas y a multitud de librerías de iconos, tipografías, imágenes, plantillas, tutoriales, etc.

¿Cuales son vuestras herramientas esenciales?

Categories
FrontEnd Design Portfolio Social Media

xarop 2011

xarop.com rediseño 2011

Se acaba el año y renovamos nuestra web.

He querido hacer una web mas visual y comercial, enfocada a vender los servicios de desarrollo web, y por lo tanto eliminar toda la publicidad ajena a el sitio.

He partido del tema de WordPress Boldy, de Site5.com, lo he traducido al español,  lo he adaptado a la identidad corporativa de xarop.com y lo he  modificado según  las necesidades de este sitio.

Los  medios sociales siguen integrados en el sitio, en este caso dando mas protagonismoo a twitter, facebook y LinkedIn y “relegando” a el resto a páginas interiores.

Realizamos el diseño de tu página web con un servicio completo, registro de dominio, alojamiento, diseño,  alta en buscadores, etc., cumpliendo con todas sus necesidades hasta conseguir un proyecto a tu medida.

¡Ayúdanos a mejorar!

[poll id=”5″]

Categories
FrontEnd Design

Snap Shots Plugin

Siguiendo con la mejora de esta web he instalado el plugin de WordPress que hace que los links a webs externas nos muestren un pequeño pantallazo de la web en si, lo podemos observar en este enlace a Snap Shots, si ponemos el cursor sobreel iconito que aparece al lado del hiperlink nos mostrará a modo de popup un screenshot o pantallazo de la página a enlazar.

Tenemos esta funcionalidad tanto a modo de pluguin para nuestro blog (WordPress, Blogger y TypePad) como para nuestro navegador (Firefox, Explorer y Safari).

www.snap.com

Categories
Social Media

Tu imagen en los comentarios

Gravatar permite, con un único registro, que tu avatar (icono, imagen personalizada, foto o como quieras decirle) aparezca en tus comentarios en blogs, foros o cualquier tipo de web o red social que integre este servicio.

Únicamente tienes que inscribirte y subir una imagen (que se recorta automáticamente a 80x80px.) que se relacionará con tu email en cualquier comentario que hagas en una web que soporte este sistema. El registro es muy sencillo y puedes subir tantas imágenes como emails desees.

Categories
Portfolio

Nuevo Template

Estrenamos un nuevo diseño.

xarop logo

En este caso he utilizado como base el tema para WordPress Deep Red de los suecos Arcsin al que he hecho algunos ajustes:

  • He hecho el tema mas ancho, para poder incluir fotos de 500px en los posts.
  • Textos mas grandes para ayudar a la legibilidad.
  • Ajustes varios en las plantillas PHP y hoja de estilos CSS.

También he aprovechado para actualizar a la versión 2.3.1 de WordPress y hacer el Theme compatible, incluyendo los tags.