Category: Diseño

A pesar de que mi trabajo es realizar, actualizar, mantener aplicaciones y sitios web. Había estado tan ocupado que no había podido dedicar tiempo a mi blog, que al igual que todo sistema informático requiere mantenimiento cada cierto tiempo.

Desde que inicié este blog en el 2005. He tenido un diseño y paleta de colores similar, pero cada cierto tiempo debo cambiar la plantilla de WordPress porque la han dejado de mantener o debo adaptarla a las nuevas tecnologías. La última vez que lo hice fue en el 2019 (lee para conocer mi experiencia en ese entonces) pero el diseño era exactamente igual al de la modificación del 2014.

Principales cambios de mi blog

Cambios a la plantilla

Primero fue actualizar la plantilla, pues la que utilizaba fue descontinuada y no soportaba muchas características de personalización de WordPress. Utilicé una llamada Autor por recomendación de Richzendy, que era similar al diseño anterior pero con la barra a la izquierda (que es mejor para nuestro idioma).

Cambios a los diseño

Luego fue actualizar el fondo y el Skatux (mi logo del pingüino Tux). El diseño lo llevaba usando desde el 2010, en el 2014-2015 usé uno con un teléfono de Firefox OS en la mano y una gorra con colores de Mozilla, pero luego de volver al original y mirarlo en el 2021 me di cuenta que ya no representa mi actual yo.

El primer cambio fue la gorra, ya no la uso para atrás como en mi adolescencia; quité la muñequera de punk y le puse una deportiva por la misma razón; decidí cambiar el color a vino tinto por el equipo de fútbol de Venezuela; mantuve el logo de Arch y la patineta porque sigo usándolos. Finalmente cambié el teléfono por uno con iOS porque es lo que uso desde hace varios años y en vez de tener auriculares le puse unos AirPods (esto me dio risa porque en el 2010 ese tipo de audífonos no existían)

Skatux del 2010
Skatux del 2010
Skatux del 2021
Skatux del 2021

Otro cambio realizado fue el fondo, ésta vez iba a hacer la 3ra iteración del mismo. Lo primero que hice fue actualizar la imagen del PS4 por un PS5. Quité tecnologías y aplicaciones que ya no uso, agregué de nuevas que uso como VueJS, PHPStorm, WebAssembly, entre otros. Los fondos me han permitido ver mi evolución a lo largo de estos años.

Fondo de Skatox.com del 2010
Fondo del 2010
Fondo de Skatox.com del 2014
Fondo del 2014
Fondo de Skatox.com del 2021
Fondo del 2021

Me llamó la atención realizar estos cambios, porque pude ver cómo he avanzado en la pasada década y como la tecnología avanza. Ya con estos cambios puedo dar una imagen mas renovada para la próxima década.

Cambios técnicos

Respecto a los cambios técnicos, la plantilla del blog es usa un tema hijo desde el inicio (antes hacía hacks al tema original), se aumentó la versión de PHP 7.2 a 7.4. Actualicé todos los plugins. Revisé que el tema tenga buena usabilidad para las personas con discapacidades visuales y demás.

Fue una grata experiencia actualizar todo el sitio después de varios años y no hacer modificaciones menores, siento que ahora la página vuelve a ser más mi imagen y espero seguir retomando publicación de artículo.

La entrada Actualización del diseño de mi Blog luego de 7 años se publicó primero en El blog de Skatox.

A 45min talk exploring what is to be to find jobs as graphic designer using only free software, and a deeper talk on how to change things.

Final words for posterity:

Do not sacrifice what you believe in for what others expect from you. Never. Is not worth it.

If you believe you’re good enough and you support what you use, and if that’s not a job that’s gonna provide you the freedom you need, then move to the next one.

It’s gonna be hard, but you’re gonna find your place in the world.

This post has a nicer formatting that can be seen at it's original source at tatica.org , so feel free to hit the link and read better version!

I’ve been trying Canva since a few months ago, and truth is, it has blown my mind. HEY, I still LOVE inkscape, but when I started giving workshops to people who wanted to improve their social networks, reality was that my students were not experts on design, and tools like this became my allies.

I’ve always supported Freeware, since those are simply apps that have a free version along their paid features. Best from Canva is that their free version doesn’t expire, which is definitely a highlight. And that’s why today I want to tel you some of the pros and cons that I found along the way.

NOTE: This is a comparison made between Inkscape (in case you’re an Illustrator user the comparison would fit just fine)  and Canva’s free version.

Inkscape

Pro

  • Absolute control over vectors, both in shape and color.
  • Absolute control on gradients.
  • Wider design freedom.
  • Export to any available format.
  • No need for an internet connection to design.
  • Editable vector that works on any design app.

 

Cons

  • Final original vector files are larger, so take longer to share (specially when you embed a bitmap)
  • If you want a template, you have to download it.
  • If you want to add some graphics, same, you have to download them>

Canva

Pro

  • Real time contribution.
  • Graphics and Photos gallery included (quite enough even at the free version)
  • Pre-built Templates to save time (both static and animated)
  • Graphics available at your computer and phone. (only online)

Cons

  • Terrible gradient management.
  • Only png downloads available (free)
  • Can’t add fonts (free)
  • Can’t edit shapes, and several times, can’t edit colors either.
  • No internet, no Canva.

Which one is the best? It will depend on the purpose you need. Truth is that the high content demand that comes from social media and the insane grow of creators, has lead to this kind of graphic assistant to become into a necessity.

Both apps have their pros and cons, and at the end, which one to use will only depend on the expertise of the designer, and the future uses for the graphic you want to create.

and you, what’s your opinion on both apps?

This post has a nicer formatting that can be seen at it's original source at tatica.org , so feel free to hit the link and read better version!

A couple of friends were curious about how I did my ghost picture for my recent project. Just in case you have no idea what I’m talking, I started a small photo-project to explore light and shadows and as usual, tell stories… long time I didn’t do it, right?

I tried to record it 2 times with Gnome’s desktop recorder but kept failing (I was an avid user of recordmydesktop), so finally on my 3rd attempt I used SimpleScreenRecorder which ended up being super easy to use, and not lagy at all. Since I got the recording on the 3rd time, this is not the picture I posted (probably better after so much damn practice, but who cares), so if you see differences between both, now you know the reason.

Here’s the TimeLapse video of the edit because I doubt you want to see 39mins of me cleaning sky and fabrics with a mouse, however, since I know people might get bored, below the video you will find a list of some of the parameters I used for the full edit.

After selecting the images that would help me archive the final output I started the editing. I used darktable for the pre-processing and get the main black/white images. For most images I used pretty much the same modules (a few adjusts here and there to exposure since was working with 100% natural light):

  • Monochrome Module: Just because I like to have a base sample of the monochrome version.
  • Filmic
    • Middle Gray Luminance: 9.13%
    • White Relative Exposure: 2.81 EV
    • Black Relative Exposure: -7.98 EV
    • Contrast: 1.574
    • Shadows & Highlights: 2.25%
  • Equalizer (Check Video)
  • And a bit of Highpass to help my old camera (Check Video)

Once that was done, copied the style to the rest of the pics and ended up with several images to play.

It’s mostly play with each image until you get the result you want. The GIMP process is hard to explain through steps, but there are a couple of tricks that I think are important to follow while doing this kind of edits:

  • Work with mask layers… If you use just the eraser, you will end up deleting things that you might need later. So use masks, own them… love them…
  • When come to fabric borders, use the curve and fine tune them easily.
  • Merging fabric isn’t easy and takes time. There’s no magic formula.

So for the editing part you will definitely will have to check the video and enjoy the 39min -to- 5min cut :)

This post has a nicer formatting that can be seen at it's original source at tatica.org , so feel free to hit the link and read better version!
Tomada de la web
La semana pasada publicamos la I parte de las herramientas web para negocios, esta semana venimos a presentarles la segunda y ultima parte de este tema. Como comentamos no estamos promocionando nada, ni estamos recibiendo ningún beneficio de nadie por mencionarlos, solo quisimos compartir un poco de la experiencia que hemos tenido con nuestra tienda el Kiosco Friki (cada herramienta la vamos mencionando, sin ningún orden en particular y enumerando, puedes leer referente a cada una de ellas aquí).



Para continuar, vamos a mencionar otra de las herramientas de Google que decidimos utilizar recientemente, los Formularios [11] de Google Drive (lee todo lo necesario para personalizarlos aquí), con estos formularios pudimos colocar en nuestra página (blog), las secciones de Contacto y Pedidos, para que los clientes puedan comunicarse con nosotros, de una manera más cómoda. Como verán poco a poco hemos ido cubriendo distintos aspectos para beneficio tanto de nosotros como de toda la gente a la que queremos llegar. Otra opción, que puede ser de mucha ayuda es la inclusión de los Calendarios [12] de Google, por supuesto dependerá de la información que quieran suministrar, por ejemplo, en este blog tenemos la sección de Eventos de SL utilizando esta funcionalidad.

Adicional a todos estos servicios, es importante tener presencia en las diferentes Redes Sociales, sobre todo las más populares, aunque esto puede variar de acuerdo al país y a los criterios que cada tienda/producto requiere para publicitarse, nosotros actualmente usamos Facebook [13] como página, no como perfil (esto es importante porque no son lo mismo, ni tienen las misma manera de trabajar). Twitter [14], Instagram [15], Pinterest, Google+ (perfil y pagina), Tumblr [16] (aunque esta, la tenemos un poco abandonada). A veces pensamos que no podemos estar en todas, porque realmente el tiempo no da para tanto, pero como todo tiene solución, la mayoría de las redes sociales cuentan con integración entre ellas, lo que permite que se repliquen las informaciones, publicando sólo en una de ellas. En el caso de nosotros tenemos:
  • Integración Facebook a Twitter y viceversa, es decir, lo que se publique en una se enviará a la otra automáticamente (es importante publicar solo en una a la vez, ya que se crearía redundancia de información).
  • Integración Tumblr -> Twitter y al estar Twitter -> Facebook se replica el mensaje, aunque sinceramente hace mucho no publicamos en Tumblr.
  • Integración Instagram -> Twitter y como ya les mencioné se publica tambien en Facebook.
  • adicionalmente el blog publica automáticamente en Google+ y los botones con los que cuenta permite publicar en varias redes sociales.
Otra manera de jugar con el tiempo, es utilizando herramientas para el manejo de las redes sociales, inicialmente usábamos Autotuits, ahora llamada OctopuSocial [17], la cual es una excelente herramienta para administrar Redes Sociales, recomendada al 100%, solo que se debe pagar una cuota mensual por los servicios, y por el momento decidimos invertir en otros aspectos, por lo que decidimos buscar una gratuita, en este caso me recomendaron Hootsuite [18] que permite también programar tus tuits, además puedes tener varias cuentas y varias redes sociales (máximo cinco en la versión gratuita), esta herramienta también tiene una opción pro con funciones adicionales y mayor manejo de Redes Sociales (la que usamos tiene menos funciones que la paga, pero por el momento nos resulta útil). Adicionalmente, desde hace unos meses Facebook también permite programar publicaciones y son de gran ayuda, además teniendo las integraciones antes mencionadas tendrás en todas tus redes sociales informaciones al día.

Cabe destacar, que si realmente quieres tener novedades para cada día, es importante que te sientes por lo menos una vez al mes a planificar estas noticias o publicaciones y luego dedicarte a programarlas, quizás consideres que es un trabajo algo tedioso, pero se realiza una vez y luego te deja tiempo libre para otras labores, nosotros usamos este Almanaque tanto en digital para las informaciones a programar, como impreso para otros recordatorios importantes. También tenemos algunos formatos [19] entre ellos: planificadores semanales, almanaques, formatos para listas, notas, entre otros, todos hechos con la suite ofimatica LibreOffice [20]. Puedes usar estos formatos que tenemos publicados, están listos para imprimir, pero siempre recuerda no comercializarlos como lo refleja su licencia y ademas coméntanos si haces uso de ellos, así sabemos que opinas.

Es importante señalar, que también utilizamos LibreOffice, para hacer nuestro catalogo de productos, nuestros volantes y material POP que colocamos en los empaques y bolsas, para llevar nuestros Ingresos y Egresos, para los inventarios de materiales y productos, para control de costos, entre muchas otras cosas, recordándoles siempre que toda nuestra labor es hecha con herramientas de fácil acceso para cualquier ser humano, sin necesidad de depender de una empresa o de un sistema o de algo mas sofisticado y que genere costos adicionales.

Otra herramienta que resulta bastante útil es la famosa "nube", ya que por medio de ella puedes tener a la mano (siempre que haya conexión) las informaciones, imágenes y/o formatos que necesitas para trabajar a diario. Una de las que usamos es Dropbox [21], en ella tenemos publicado entre otras cosas, nuestro catálogo y lista de precios, para que los clientes puedan descargarlo sin problema, al momento que lo necesiten. Google también cuenta con esta herramienta que es el mismo Google Drive [22] mencionado antes, también esta la herramienta web Evernote [23], que es una aplicación para la organización de información personal mediante la creacion de notas y organizable por medio de etiquetas.

Y por supuesto, ademas de los correos, redes sociales, y medios electrónicos, esta la telefonía convencional, y mejor aun las nuevas herramientas de comunicación como son WhatsApp [24] y Telegram [25], que te permiten interactuar mas cómodamente con tus clientes y en tiempo real, enviando imágenes, videos, audio, entre muchas otras opciones.

Por el momento consideramos que estas son las principales herramientas para negocios web, que además es importante recalcar que son herramientas libres, fáciles de usar, económicas y de beneficio para todos los nuevos emprendedores.

Cualquier duda, comentario o información puedes escribirnos a consulta_friki@kioscofriki.com.ve 
Y recuerda, si esta información te ayudó y quieres colaborarnos económicamente puedes hacer tu donación aquí
Tomada de la web
En esta publicación (que dividiremos en dos partes) vamos a darles algunas herramientas y consejos, para todos(as) aquellos(as) nuevos(as) emprendedores(as) que quieren tener su negocio en linea y están buscando buenas ideas para desempeñarse. Adicionalmente, para que sepan que no es necesario tener tanta infraestructura para comenzar. Es importante que sepan que estas recomendaciones son a título personal, en base a las experiencias que hemos tenido con nuestra tienda el Kiosco Friki, no estamos promocionando nada, ni estamos recibiendo ningún beneficio de nadie por mencionarlos. (cada herramienta la iremos mencionando, sin ningun orden en particular y enumerando, luego hablaremos un poco de ellas aquí).

Al comenzar con un nuevo negocio, deben saber y entender, que aún cuando no sea una tienda física se requiere el mismo esfuerzo y trabajo como si lo fuera (quizás hasta mas), porque deberán tener el tiempo para dedicarle a sus productos, más el tiempo para promoción, planificación, publicación, entre otros. Un detalle más a considerar, es el hecho de tener un conocimiento mínimo en el manejo de equipos electrónicos: computadoras, celulares, tabletas, cámaras, impresoras, entre muchos otros, y de no tener estos conocimientos, es recomendable tener cerca a alguien que los pueda apoyar, para así plasmar en la web todas las ideas que tengan en mente. Aún cuando no sean una tienda en linea, en este momento la tecnología es uno de los mayores recursos para la promoción de tiendas y productos, de una forma económica.

Nuestro nombre y eslogan
Para empezar debemos tener claro qué queremos ofrecer y vender, en base a eso estableceremos la temática, colores, logos, imágenes, y por su puesto crearemos un Nombre, hay personas que guardan imágenes y fotos en sus equipos o tableros como los que ofrece Pinterest [1], para ir creando temas que luego nos sirvan de inspiración (OJO, no para copiar). También pueden usar herramientas para generar paletas de colores en base a una imagen principal, como es el caso de Color Palette Generator [2], solo debes subir la imagen y ella te dará los colores que contiene. Luego de esto, si tenemos algún conocimiento mínimo para crear diseños podemos comenzar dándole forma al Nombre escogido, utilizando un tipo de fuente/letra (sin derechos de autor) de páginas como Dafont [3], y colores en función a nuestra idea, adicionalmente pueden crear un eslogan, y por supuesto un logo que será lo que distinga su marca, esto es importante porque recuerden que será la imagen que el cliente guarde en mente. Para crear nuestros imágenes y logos (y todos los diseños de productos del Kiosco Friki) utilizamos las herramientas Libres para diseño y edición Gimp [4] e Inkscape [5].
                                                
En nuestro caso cuando tuvimos el nombre en mente, lo primero que hicimos fue crear un correo de Gmail [6], ya que ofrece seguridad y adicionalmente la gente de Google cuenta con muchos servicios integrados, que podrás manejar con la cuenta previamente creada. El segundo paso debía ser crear la página web, pero como no teníamos los conocimientos, ni el tiempo para crearla, decidimos utilizar las opciones de Blogger [7] con las que cuenta Google, y adaptarlo a las necesidades que iban surgiendo (aún pensamos contratar una empresa para hacer una pagina más formal, pero por el momento nos mantenemos con el blog). Es importante que sepan que existen otras opciones como Wordpress [8], solo que blogspot ya viene integrado como comenté anteriormente, además cuenta con otras opciones como la galería de las imágenes, llamada Picasa web [9] que ahora redirecciona también a la galería de Google+ [10], donde fuimos creando los álbumes de cada uno de nuestros productos, para referir a nuestros clientes lo que estamos vendiendo.

Luego de unos meses, pagamos el nombre del dominio, específicamente www.kioscofriki.com.ve y ya de esta manera pudimos empezar a personalizarnos más, los clientes nos empezaron a conocer por medio de la página, y además creamos correos de contacto con nuestro dominio kioscofriki.com.ve, lo cual hace que sea mas formal al momento de enviar comunicaciones. Para la compra de dominios en Venezuela es por medio de la empresa CONATEL, específicamente en la sección Registro de Dominios. Y el mismo Google te permite crear y administrar estas cuentas con dominios específicos.

La próxima semana estaremos publicando la II parte de las Herramientas para Negocios Web, les recordamos que es una publicación hecha a título personal, y esperamos que nos comenten si les ha resultado útil o si tienen algunas herramientas adicionales a las mencionadas. Recuerda que para cualquier duda, comentario o información puedes escribirnos a consulta_friki@kioscofriki.com.ve

Y recuerda, si esta información te ayudó y quieres colaborarnos económicamente puedes hacer tu donación aquí
En esta oportunidad les traemos una aplicación bastante particular utilizada para el "Diseño de Interiores", llamada Sweet Home 3D (la página en español aquí). No tienen que ser arquitectos, ni diseñadores, simplemente al momento de tener que remodelar algún inmueble, les será de gran ayuda, como nos ha sucedido a nosotros que estamos en ese proceso de construir/remodelar nuestro apartamento. 

Siguiendo pasos muy sencillos podrán ubicar los espacios, paredes, pisos, techos, además del mobiliario y hasta las personas que en ella se van a encontrar, colocándole las medidas exactas y las dimensiones adecuadas, texturas, colores, entre otros. Lo mas importante no es solo que se puede organizar sino que como la herramienta da los totales en metros cuadrados de las medidas pueden hacer los cálculos del material a utilizar y por supuesto del dinero a necesitar según el costo de los mismos.
Como siempre debemos comenzar instalando la aplicación, en este caso pueden encontrar en la página oficial, la sección de descargas donde pueden encontrar el archivo correspondiente (aquí), pero adicionalmente también tenemos la aplicación en los repositorios del sistema, lo que nos facilita aún mas el trabajo, nos dirigimos al centro de software (si estamos en UBUNTU) y buscamos "Dulce Hogar 3D" o por consola como superusuario escribimos "aptitude install sweethome3d". 

A continuación les presentaremos una breve explicación de su uso, las imagenes referenciales se encontrarán debajo de la explicación y estarán identificadas por números a las cuales haremos referencia colocándolos entre paréntesis. Para consultas o comentarios escribir a consulta_friki@kioscofriki.com.ve

Al abrirla la aplicación, se nos presenta una ventana dividida en cuatro secciones. En el ángulo superior izquierdo (1), se presentan el mobiliario con el que se cuenta para colocar en los espacios de la casa. En el ángulo inferior izquierdo (2), se va generando el listado del mobiliario utilizado a medida que se va a colocando en los espacios de la casa. En el ángulo superior derecho (3), se encuentra el área donde se creará el diseño de la casa en 2D y en el ángulo inferior derecho (4), se va generando automáticamente el diseño en 3D. A todas estas secciones se les puede modificar el tamaño de acuerdo a lo que se requiera.
Imagen 01
Adicional a estas cuatro secciones, la aplicación cuenta con las correspondientes barras de herramientas, de menú y de iconos de accesos directo, en donde se encuentran las opciones generales para trabajar en el diseño de los ambientes. La barra de iconos, cuenta con las tradicionales acciones de nuevo, abrir y guardar, deshacer, rehacer, copiar, cortar y pegar.
A continuación de estas opciones presenta los iconos de crear paredes, crear habitaciones, establecer medidas e inserción de texto. Cada una de estas opciones se irán explicando a medida que se usen, así como los menúes con los que cuenta.
Imagen 02
Para empezar se tiene la opción de cargar de fondo la imagen del plano que se va a realizar, si la persona tiene conocimientos en la realización de planos puede omitir esta opción y comenzar a crear las paredes y espacios sin necesidad de tenerlo cargado, en nuestro caso vamos a colocar el plano del apartamento que estamos remodelando en este momento.
Para ellos nos dirigimos al Menú Plano -> Importar Imagen de Fondo (5). Lo cual abrirá una ventana adicional donde podrán buscar la imagen donde la tengan escaneada e importarla a la aplicación Sweet Home 3D, deberán ahcer clic en el botón Aceptar para añadirla o Cancelar para no colocar la imagen(6).
Imagen 03
Al tener el plano de fondo ya podrán comenzar a colocar las paredes, pisos, habitaciones y todo lo necesario (7), para ello simplemente hacemos clic en el icono que se encuentra en la barra de herramientas y nos situamos en el sitio donde queremos colocarla, y este mismo procedimiento para cada una de las partes que se quieran colocar en el diseño (8). Todo esto se debe hacer en el ángulo superior derecho de la aplicación (sección número 3, en la imagen 01), y a medida que se colocan se va mostrando la imagen 3D en el ángulo inferior derecho de cada una de las paredes, pisos, superficies, elementos ((sección número 4, en la imagen 01)

La aplicación presenta una serie de mensajes para realizar las respectivas acciones, en caso de no querer leerlos todas las veces, se tilda la opción "No Mostrar este consejo de Nuevo" y no lo vuelve a presentar.
Imagen 04
En caso de querer tener mas precisión en las medidas se pueden editar cada una de las partes colocadas simplemente haciendo doble clic sobre ellas y se modifican los valores correspondientes en el cuadro que se muestra (9).
En este cuadro se puede modificar el tamaño, los colores, las texturas, entre otros, luego de colocar los valores requeridos, se da clic en Aceptar para que tome estos valores o Cancelar para terminar con la edición. Luego podrán apreciar en la imagen 3D los valores colocados (10).
Imagen 05
Luego de tener lista todo el proceso del inmueble, se puede comenzar a colocar el mobiliario y los adicionales correspondientes (11). Como pueden ver a lo largo de las cuatro secciones con las que cuenta la aplicación (Imagen 01 de esta publicación), se presenta a un lado el mobiliario con el que se cuenta (Lado izquierdo arriba), y a medida que se colocan en sus lugares (Lado derecho arriba) se va generando un listado al respecto (Lado izquierdo abajo), y se va presentado en 3D (Lado derecho abajo).
Otro de los detalles interesantes con los que cuenta esta aplicación es la de poder hacer una "Visita Virtual" dentro del inmueble creado, lo cual crea un realismo único al momento de recorrerlo. Para habilitarlo sólo se deben dirigir al menú Vista 3D -> "Visita Virtual" y les presentará una vista de manera que pueden ir recorriendo cada una de las áreas del mobiliario.
Imagen 06
La aplicación cuenta con muchas opciones, en esta publicación les presentamos las básicas para arrancar a trabajar, de aquí en adelante queda de parte de ustedes usar la aplicación y conocerla aun más.
Como comentario adicional las imágenes 05 y 06 corresponden al apartamento de quienes escribimos este blog, para aquellos que tienen dudas del verdadero uso de la aplicación, sinceramente, ayuda mucho en los casos de remodelación y mejoras a algún mobiliario.

Ya saben para cualquier duda, comentario o información sobre otros eventos puedes escribirnos a consulta_friki@kioscofriki.com.ve 
Y recuerda, si esta información te ayudó y quieres colaborarnos económicamente puedes hacer tu donación aquí