 Bon, espero que estéis disfrutando de Workham torrelo dones. Pasamos por el podcast a contar vuestras impresiones, a decir, la verdad, que é a mejor Workham en la que habéis estado, en la vida, porque cada Workham supera o anterior, es así, esta é a última, luego, que se le va a hacer? La charla de ahora de Ximena Catalina, eu creo que os va a encantar, como las demás, por supuesto, pero Ximena é conocida porque tiene muchos proyectos muy exitosos, con WordPress, pero, en esta charla, no va a hablar nos de uno de sus proyectos que habría sido valiosísimo, nos va a hablar de su faceta como diseñadora, ella é diseñadora de interacción, muy, muy buena, ha trabajado para marcas muy punteras, também para empresas pequeñas, e nos va a contar los secretos para hacer diseñar unha web sin tener conocimentos de diseñador e, además, de una manera brillante. Adelante Ximena, no te quero quitar tiempo, te admiro mucho e estou deseando ver tu charla. Muchas gracias, Dana, por la presentación. La voy a poner mi currículum para que luego me hagas una recomendación de LinkedIn porque... Se estáis hoy aquí, yo estoy segura que es porque muchas veces os habís enfrentado al reto de tener que hacer una página web. E, se habéis hecho una página web, es muy probable, se non sois diseñadores, que quando finalmente os habís terminado os habís dado cuenta de que el resultado no era exactamente el que estaba en vuestra cabeza. Entonces, yo lo que os quiero explicar es como se hacéis unha web para vosotros mismos o para un cliente con cuatro tips sencillos, como podeis personalizar esa web en WordPress para que queda como se lo hubiese hecho un diseñador. E todo esto empieza normalmente quando decíslo de pues me monta unha web, yo voy a montar unha web, me instalo en WordPress y será por falta de recursos. Hay miles de temas. Escojo un tema, un tema que tiene un diseño fantástico. A continuación, muchos de esos temas traen ya demos de webs. Puedo poner unha demo de la web que esté bien diseñada con una estructura chula, con los colores adecuados, con los textos e simplemente me dedico a reemplazar aquellas cosas que necesito para mi propia web o para mi marca. Me voy a unha de las miles de webs que hay en Internet que es una paleta de colores. Las hay que quedan... Tengo mi color de marca, lo pongo e me da otros cinco, seis, cuatro colores que combinan con el. Unha tipografía de calidad en Google Fonts que son todas bastante buenas, unha, dos, tres e luego un montón de recursos gratuitos de calidad por Internet. Puedo escoger buenos iconos, podes coger buenas fotografías, podes coger buenas ilustraciones de contento. Quando eu já tengo todo esto un tema bien diseñado, unha demo con la estructura adecuada que tiene un aspecto buenísimo. Los colores, la tipografía, los iconos, de repente o resultado é esto. E bueno, a ver, ni tan mal podis pensar pero es posible que sí esté un pouco distanciada e, en realidad, isto está un poquito máis cercano se se parece algo así. É un pouco circo e é muy frustrante porque a maioria de nós que vivimos en un entorno máis visual somos capaces de saber cuándo un diseño não é o bastante bueno pero não sabemos que é o que ha falhado. Que é o que ha falhado porque isto me ha quedado en modo circo. O web é melhor que nada. Sim. O web é publicable e seguramente visitable por personas e hasta venda. Pero é profissional. É o resultado que eu tenia na cabeça. Seguramente não. Que ha falhado? O que falha normalmente de como pensamos os diseñadores a como pensa o resto de gente que hace web que no son diseñadores profissionales de gente que crea contenidos ou que está especializada de nacer web pequenas para clientes é que os diseñadores pensamos en conjunto mientras que o resto de gente piensan cachitos. Siguiendo esta metáfora se tu te quieres tatuar todo o cuerpo e cada vez que te haces un tatuaje nuevo lo piensas de manera independiente te haces o mejor tatuaje posible en ese momento pero no tienes una visión de conjunto o resultado final va a ser un popurri sin embargo se tienes una visión de conjunto de como quieres tatuarte todo o corpo quizás os primeros tatuajes não sean tan espectaculares quando só tens tres escamas tatuadas na espalda pero o resultado final é muito mejor então é o que hai que fazer quando estáis personalizando una web así hai que pensar solemos tender a pensar qual é o mejor icono qual é o melhor foto e no modulito do lado sem ter uma visión de conjunto e isto porque importa realmente se a web non é tan mala porque devo melhorar o diseño até que sea realmente profesional primeiro evidentemente porque a melhor diseño eu creo que estas alturas não fa falta que os tenha que vender o que porque é um bom diseño pero bueno genera confianza entre vuestros potenciales clientes o visitantes de maneira que se vendéis un produto ou un servicio é mais fácil que os compren os permite aumentar os precios se vosotros queréis ofrecer um servicio premium e cobrarlo como um servicio premium pero o diseño de vuestra web non é premium nadie os va pagar os van a llovar una sorpresa eu esta web es de alguien que cobraría 30 euros la hora e me ha pasado un presupuesto e cobrar 150 euros la hora este este é um flipado a este e não vou comprar nada e se habéis visto demás a charla de lucia e o SEO hace un rato pues bueno sabéis que está aqui ha llegado para quedarse o tema do eat de cara a google ao final máis confianza del usuario implica que se queda máis tempo em vuestra web que la comparten redes sociales que tenéis máis tráfico já insistido a nuevas que não é é um tema directo mas o tema indirecto me ha quedado claro necesito um diseño profesional e não sei o que há pasado como vou chegar a esse diseño queterni e a cabeça e o que eu quero contar é como tenéis que cobrar com 4 elementos visuales fundamentales o color, a tipografia a fotografia e o ciconos e ilustraciones as imagenes que ese diseño quede tan profesional como vosotros queríais. E vamos a empezar por el color. É cierto que esta paleta, que seguramente habéis sacado de unha web, que hay muchas por aí, é muy bonita, así simplemente, quando la habéis en vuestra pantalla, con las cinco barras así verticales, queda espectacular, combinan muy bien los colores entre ellos, a veces incluso ponen unha foto al lado preciosa de donde han sacado los colores e, pues, lo veis e desjope, qué bonito, esto, en la web tiene que quedar fantástico. El problema es que, incluso siendo un diseñador profesional, combinar cinco colores é súper complicado. Eu não sabria combinar cinco colores en un solo diseño. Para que lo entendáis mejor, con algo que tenéis mucha más práctica, por exemplo, vestirse todos os dias, imaginad que vosotros os vais a vestir por la mañana e os ponéis unha chaqueta morada, unha camiseta azul marino, unos pantalones grises, uns calcetines naranjas e uns zapatos rosas. Se não tenéis práctica com o tema, por exemplo, que seáis, habéis sido a gata ruide da prada durante toda a súbida, vais a quedar un pouco payasos. Por eso, en color, a recomendación é un solo color, o color de vuestra marca, o color de vuestro logo, o que seja máis e amativo, o color favorito do cliente, un solo color. Porque, además, o color é o que comunica, não há nada máis fuerte comunicando marca e identidade que o color. Ninguun elemento funcione tan bien como este. Pero, además, non sólo un solo color, porque, en realidad, o que máis importa son las proporciones. Aunque os digo un solo color e aí, o principal color de vuestra web sempre va a ser o blanco. O blanco é o que teme que predominar. O negro, se hacéis un huevo oscuro. A continuación, un color oscuro para os textos e para destacar alguns contenidos. E, ya por último, o color de acento seria ese de vuestra marca. Teníamos este diseño inicial un pouco circense. Se usamos un solo color e uns elementos visuales que vamos a trabajar, este é o que máis impacta. Cambiamos e boom. A diferencia é espetacular. É un aspecto mucho máis profesional que o anterior. Eu, isto, já o publicaria mucho máis tranquila. Aunque podemos ir mejorando máis detalles, eu, isto, ya me quedo a gusto. Acuerdo? Se queréis tiki? Podemos hacer un gif animado. O seguinte dos elementos seria a tipografía. E volvemos ao mesmo tema. Todas as tipografías que podéis encontrar en Google Fonts e que se pueden utilizar máis fácilmente en WordPress porque casi todos os temas te dejan seleccionarlas simplemente con un desplegable son profesionales. Sim. Agora combinan bien entre ellas a regular. A recomendación de novo é unha sola tipografía pero con diferentes pesos. Os diseñadores le llamamos pesos al grosor que pode tener unha mesma tipografía. O que a maioria decís, pues isto é tan normal o esto é tan negrita. Nosotros le llamamos pesos e además le ponemos un monte de nombres máis porque decimos é slide, é regular, é medium, é semi-bold, é bold, é black e basicamente é isto. Se escogéis unha tipografía e la trabajáis con dos pesos diferentes unha en negrita e outro en normal vais a tener mucho mejor resultado que se trabajáis con verias tipografías. Aquí las tipografías non é tan mal son dos buenas tipografías e a lo mejor para o ojo entrenado diréis o resultado non é tan malo. Tiene para os títulos unha serifa que da así como mucha autoridad e luego como o tema de redes neuronales pues é escogido unha tipografía súper tecnológica. La verdad é que se dan bastante de tortas e se las cambiamos Efecto é mucho má sutil que con o color muchísimo má sutil pero tenéis que ser conscientes de que todo suma. Además, os va facilitar muito a vida a la hora de trabajar con o diseño unha sola tipografía e no tener que estar todo o rato pensando en qual tenéis que poner. Las fotos Alguém pensou que seria muy divertido unha foto, redes neuronales un robotito tocando el piano que emocionante spoiler pensé que seria muy divertido Si mi recomendación con las fotos es, si tenéis un mínimo de presupuesto un mínimo de presupuesto que invertir, invertidlo en fotos En fotos es donde os va rentar ese dinero Podéis invertirlo en un fotógrafo profesional que venga a hacer fotos a vuestra oficina o en fotos de stock Ne acuerdo, las diferencias se va anotar muchísimo Es cierto que hay muchas fotos gratuitas por aí, pero a no ser que tengáis unha web de algo super genérico va ser muy difícil que encontreis unha foto de calidad exactamente do tema que vosotros necesitáis e invertir un pouco de dinero E se además, ruco adicional esa foto tiene algún elemento que combine con vuestro color de marca pues ganáis todavía mucho más Esto se pode hacer se viene un fotógrafo profesional como el día que venga a hacer las fotos pues tener unas camisetas, unas tazas algo de vuestro elemento de marca e se sois un pouco más apañados pues con Photoshop que es como lo hecho yo El efecto que tiene mejorar la fotografía sobre todo en la versión móvil que nada más entrar, lo único que ves es una fotografía de un texto es menor que con el color pero bastante mayor que con la tipografía Ya estamos transmitiendo unha cosa muy diferente E o último elemento que nos queda serían os iconos e as ilustraciones o resto de imagenes de la web que no son fotografías Las recomendaciones aquí es por favor, iconos o ilustraciones que pertenecan a una sola colección e direis Ximena que exagerada a ver, sí es verdad que aí has puesto un icono que es de relleno e se pega de tortas un pouco con los otros pero os outros dos tienen un estilo muy similar dos iconos de línea pues por que no voy a utilizar los dos, sí son lo bastante parecidos e eu os direi de verdad que no os acordáis de esos pasatiempos que es como encuentra el elemento que non encaja con los demas ou eu vou a dejar 10 segundos Qual es el icono que no que está fuera o flexo claramente e son bastante parecidos pero simplemente no tiene las esquinas redondeadas tiene un poquito má de grosor o cerebro es buenísimo encontrando el elemento que no encaja e ademas unha vez que lo ves, ya no dejas de verlo e amas pica dentro de la cabeza es que pica es como quando ves un letre de una tienda e están malalineadas las letras e es que eu não lo pudo mirar má ou seja unha sola colección de iconos ou ilustraciones e se ademas tienen un elemento de color que va con vuestro color principal de novo, muchísimo mejor e outra vez os vais a quejar pero es que Ximena es que en esta colección que cogido de 500 iconos me falta porque tengo un módulo que necesito una metáfora visual determinada e necesito un icono que no está nesta colección, só lo voy a coger ese de outro lado que de verdad se parece muchísimo no igual que o cerebro es buenísimo encontrando o elemento que no encaja o cerebro es buenísimo asignando significados durante non lo sai se vosotros ponéis un texto explicando que hacéis redes neuronales e ponéis un icono de un zapato o usuario va a decir que bien traído este icono de zapato con este contenido e seno este este vale para todo, la Diana con la flecha redes neuronales Diana con la flecha, reproducción asistida Vendo la gartos Diana con la flecha así que de nuevo aunque no se va notar tanto pero esto eu hecho un web que copiaran una diapositiva normalmente as webs son máis grandes, tienen máis iconos máis ilustraciones máis aquella ilustración de allí que es que le falta dos colores para tener todo el arco iris me acuerdo então se esto lo cambiamos por iconos de la misma colección e una ilustración que só me ha cabido una pero tendrían que ser todas del mismo estilo pues finalmente tenemos nuestro diseño web máis profesional que lo que teníamos al principio vale, vamos a repasar a diferencia entre pensar cada módulo en cachitos es decir, pensar en cada módulo lo que queda súper bien en ese módulo vale e el resultado final es un popurri o pensar oye, esto queda bien en este módulo pero también queda bien en toda la web pensar en conjunto non dejéis nunca de pensar en conjunto es máis monótono sí, es un poco monótono vale mucho máis profesional e también pensar que vuestros visitantes no se van a pasar la vida en vuestra página web es monótono pero para el tiempo que ellos van a estar pues máis que desobra repasando para que se os quede bien e no se os olvide un color unha tipografía unha foto se puede estar conjuntada con el color bueno, perdón, unha fotografía que la fotografía sea profesional e esté conjuntada con el color unha sola familia de conos un solo estilo de ilustraciones e ahora ya que terminamos esta charla que podeis hacer que podeis llevaros a casa para empezar a aplicar a estos principios pues cada vez que veis una web que os gusta, que os parece profesional aprendes a mirarla en estos 4 aspectos es profesional, que color como está usando o color unha tipografía como está usando os iconos e fotos también es el momento se tenis webs de revisarlas bajo esta nueva lupa estou usando bien todos estos elementos para que las webs que yo ya tengo creadas sean profesionales e por último las que empezais de nuevo aplicas sempre en la coherencia que cualquier elemento visual nuevo que metais e enxigas até me asobrado tiempo e aprovecház ahora para hacer preguntas que luego en redes sociales sól o tengo 200 caracteres e non me da la vida estupendo, es genial que hayas terminado antes porque ahora hay máis tiempo para vuestras preguntas adelante eu queria preguntar como veis os emoticonos para ponerlo en párafos en títulos target, es decir, qual es tu público objetivo? Tu público objetivo es de, non sei onde poner un pouco na línea, 35 para abajo, vale, sea bastante, o va dirigido a un grupo que es moi usuario, eu diría, desde los que empezaron a utilizar WhatsApp a muerte, vale, grupos de colegios, tal. Es para tu web de redes neuronales? No, no, claro, depende muchísimo de tu target, e yo los utilizo bastante metidos en el texto, o a veces incluso para ahorrarme, meter iconos e aumentar el peso con iconos éso, SVG o PNG e tal, utilizo directamente emoticonos e hasta caracteres de unicode. Genial, dobo tamén para os títulos e os metadescripciones tamén? Em los metadescripciones, como que gritan a muerte, nicho e ofertón, o sea, que tamén tienen sú público, vale, primero tienes que pasar, por exemplo, se os pones en los títulos, tienes que estar seguro de que Google logo te los va colar en los resultados de búsqueda, que a veces los limpia e luego tamén que hace tu competencia, o sea, se eres el único de tu competencia que los está usando, a lo mejor es unha ventaja. Se toda tu competencia los usa, a lo mejor es unha ventaja, no usarlos e tienes que tener muy claro que a veces dan unha sensación pues éso de cosa barata, chollo, oferta, promoción. Xí es lo que estás buscando? Xí, o sea, adelante. Muchas veces yo... Recuerdo sempre, quando vine a mi casa, el folleto del telepizza o del chino e me dice mi Mario Hoppes que el folleto del chino es que está fatal diseñado. Digo, es que xí estuviera bien diseñado, no les llamarías para comprar, porque pensarías que la comida es cara. Está mal diseñada aposta para que sepas que la comida del restaurante chino es barata. Xí, xí, xí. Logo, a nivel de, como ha dicho, de bancos de imágenes, tienes alguno que recomendarías? De gratuitos, suelo tirar de, bueno, lo que haya disponible, pero sobretodo a Nesplash e Pexels, porque son, yo creo que los máis grandes e encuentras de todo, de pago tengo cuenta en Saterstock. Pero son dos moi similares. Xí, en mi empresa acabamos de cambiar de 1, 2, 3 a Saterstock. Es que tiene, yo creo que ellos, junto con Iestock foto e Adobe, que tamén se ha metido a, son los que tienen más catálogo. Entonces, aí sempre lo que te conviene es a precios similar que tengan más catálogo. Xí, tamén se ha metido con coxos de inteligencia artística e eu creo que os Saterstock. Xí, tamén las podés Saterstock, las podés generar al vuelo. Lo he probado por ahora, pero mejorará seguro. Vale, perfeito, pues, mocha gracesa. Hola Ximena, Yo tengo una pequeña duda, ahora en el mundo web, muchas veces hay muchas ilustraciones y de un tiempo a esta parte yo lo que estoy viendo es muchas páginas web con mucha ilustración como la que había abajo a la derecha y que en la parte superior ya se eliminan directamente las fotografías que no hacen referencia y ya únicamente se utilizan las ilustraciones. Que opinas al respecto? Está bien el uso de esas ilustraciones? Absolutamente sí. Absolutamente ha pasado eso. Esto pasa porque los diseñadores funcionamos muchísimo por modas. Vemos una moda que funcione e nos subimos al carro todos a la vez. Empezo usando las ilustraciones, ya no me acuerdo ni quén. Esto foi hace 4 años o tal, se empezó a quitar las fotos, creo que empezó con el uso de ilustraciones Google e nos pasa como cuando Apple saca nueva web, se lo hace Apple allávamos todos. E ahí hemos sido todos, de tal manera que hasta hemos saturado o mercado visual de web e están todas iguales con las mismas ilustraciones. Predigo que en 1 o 2 años vamos a volver ao anterior do mundo de foto. Sí, una nueva moda. Tu crees que é buena idea a combinar los son mundos? Eu creo que se pode combinar. Eu creo que se pode combinar. Se ves que o resultado para ti non é bom, eu quero dizer porque teme seu truque, a foto teme que ter algún elemento de color, a ilustración também teme que ter algún elemento de color para que não se den mucho de tortas. Pois se ves que non te termina de funcionar, limítate 1 de los 2. Pero en muchos sitios se combina e eu creo que queda bastante bien. Nada. Incluso ilustraciones pintadas en cima de fotos, que haya foto e elementos ilustrados en cima. Chulísimo, agora claro. Te lo tienes que dibujar tú. Hola. Gracias por a presentación. Vamos a ver. Algo que se me ha ocurrido a mí, entonces te lo pregunto, a ver se lo ves coerente. Para hacer una web para una persona que quiera exponer suas fotografías personales de arte. Obviamente serán imágenes multicolores. O que eu pienso é que entonces a web debería ser de un solo color, porque en todo lo demás já estás aportando colorido. Por exemplo, blanca o negra. E en ese caso, que color de acento pones? Claro. É que eu aí não pondría color de acento. Es decir, quando te refires a un solo color, eu só lo llamo na web sin color, o sea, minimalista, es decir, blanco para el fondo, para o texto, a mínima expresión. Aí o que tiene que brillar é o arte de esa persona. E vai ser má difícil que consiga un diseño con algún color máx que funcione con o seu próprio arte. Então, habrás visto seguramente que a maioria de web de artistas ou os que temos por folios de diseño, o que é o próprio diseño casi no utilizamos color, o sea, para nada, a maioria da gente. E o que deixas é que todo o color se quede no trabalho da persona que o estás poniendo. Agora mesmo, estou vendo que a moda son os colores oscuros. Pois sí, outra vez, a moda. O sea, de repente vino este tema de crear os temas oscuros para a vista, para ahorrar energia, porque o navegador permite cambiar de uno a outro e como que se ponen un pouco de moda. Agora, hay que tener también en cuenta que o cierto público todavía los percibe unidos a lo que estava en el principio, que son un pouco el sector de los videojuegos, de las películas, en general se recomiendo evitar os colores oscuros quando tienes que leer un montón de texto, pero a partir de ahí podes usarlo para o que quieras. Muchas gracias. Bueno, ahora por da charla, una rápida. Que opinión te merece esta moda del texto corrido repetiéndose todo el rato en una franja estrecha que es infinito. Como que lo vemos mucho últimamente en algunos diseños de eventos e tal. Que el departamento de marketing lo necesita e en algún lado hay que ponerlo. O texto que se mueve en general no es buen idea. Deberías encontrar alguna manera se realmente hace falta deberías encontrar la manera de ponerlo fijo. A veces también tiene el objetivo de molestar, de que te moleste lo suficiente como para que te fijes en él. Eu llevo ocurrando nesto desde el 2000 e já he pasado por la etiqueta Blink que estuvo de moda en súa día e o Marquis e que se acabaron incluso sacando del HTML porque no eran buenas ideas e amas non son buenas ideas quando a gente tiene problemas de accesibilidad para as accesibilidades son nulos. Tampoco me parece que sean tan ubicuas para que sea un problema. Pero yo no las pondría e tampoco conozco la necesidad de os dueños de la web que les ha hecho recurrir a eso. Me resulta difícil opinar. Hola Xemena Felicidades por acharla que ha estado moi guai. Aprovechando lo que estabais preguntando era do Marquis de las cípicas marquesinas míticas algo que se está poniendo bastante de moda e que no me había dado cuenta me había pasado desapercibido e haciendo últimamente algunas presentaciones de diapositivas que creo que de eso sabes un poquito veo que también se está poniendo de moda en las ilustraciones como las comentaba antes Bidania también como pequeños movimientos en ellas tanto en las web como en las diapositivas no sé si es a través de aquí no profundizado. A mí me produce como cierto rechazo verlas pero veo que se está poniendo como muy de moda así pegando duro. Yo creo que a veces cuando la tecnología avanza lo suficiente e de repente algo que hacías años con la web en flash de repente vuelve a ser posible e puedes meter a animación e tu competencia no lo tiene e tu sí, entonces lo metes e queda muy chulo e entonces te ve todo el mundo e dices lo de ostras que chulo nosotros también e nos subimos porque os diseñadores en éso somos madre mía, é que nos subimos todos a la vez ao carro quando un cliente te lo empieza a pedir é que ya la moda se está pasando claramente quando te dices lo de no é que he visto que se llaman las ilustraciones está a punto de morir hay que hacerlo bien hay que hacerlo muy bien todo o que sea movimiento hay que hacerlo muy bien porque se lo haces mal que os banners tenían un límite de tiempos tú los podías animar durante 30 segundos e logo los tenías que parar porque se non te lo rechazaba a plataforma, non podían estar eternamente en bucle, pues ésto é o mesmo eu creo que se lo vas a hacer lo tienes que hacer muy bien e en algún momento se tiene que parar se tiene que parar en algún momento se está bien el guiño de ay que mono que e luego vale ximena, muchísimas gracias a tenéis, ya sabéis para preguntar o que tenéis