{"id":7952,"date":"2023-11-07T20:43:14","date_gmt":"2023-11-07T20:43:14","guid":{"rendered":"https:\/\/fortuno.hr\/uvod-u-dizajn\/"},"modified":"2024-07-02T15:00:26","modified_gmt":"2024-07-02T15:00:26","slug":"uvod-u-dizajn","status":"publish","type":"post","link":"https:\/\/fortuno.hr\/es\/introduccion-al-diseno\/","title":{"rendered":"Introducci\u00f3n al dise\u00f1o"},"content":{"rendered":"

Ya sea App Store, Play Store, Microsoft Store, Steam o cualquier otra plataforma de aplicaciones, la cuesti\u00f3n es que hay toneladas, decenas de miles de ellas. El usuario busca una aplicaci\u00f3n concreta (no importa para qu\u00e9 sirva; ya sea un juego, un programa para Windows, para el m\u00f3vil...) y encontrar\u00e1 toneladas de similares. \u00bfC\u00f3mo elegir\u00e1 el usuario (t\u00fa, nosotros, yo...) la aplicaci\u00f3n? Rara vez se basa en las caracter\u00edsticas enumeradas, mucho m\u00e1s a menudo en la apariencia: c\u00f3mo se ve la interfaz de la aplicaci\u00f3n, qu\u00e9 tipo de im\u00e1genes se usaron, qu\u00e9 tipo de avance si se trata de un juego, qu\u00e9 colores se usaron. Para abreviar la introducci\u00f3n, para llegar al meollo: \u00a1el dise\u00f1o es importante! El dise\u00f1o es MUY importante. <\/span><\/p>\n

 <\/p>\n

Basta ver cu\u00e1nto invierten las empresas gigantes en dise\u00f1o, s\u00f3lo en publicidad: Samsung para sus tel\u00e9fonos m\u00f3viles, Microsoft para sus port\u00e1tiles, juegos para sus anuncios innovadores y extra\u00f1os. Todo ello debe estar dise\u00f1ado para atraer al p\u00fablico objetivo (ya sea poblaci\u00f3n general, j\u00f3venes, personas mayores, mujeres, estudiantes...). Tienes muchas definiciones de dise\u00f1o, pero aqu\u00ed tienes una que personalmente me gusta:<\/span><\/p>\n


\n"El dise\u00f1o es un plan para crear un producto o servicio con la intenci\u00f3n de mejorar la experiencia humana en relaci\u00f3n a un problema espec\u00edfico".<\/em><\/span><\/span><\/p>\n


\nEn t\u00e9rminos sencillos: el dise\u00f1o es todo lo que ves. Los libros sobre tu mesa - alguien dise\u00f1\u00f3 las cubiertas, el qu\u00edmico que tienes en la mano - incluso si es el modelo m\u00e1s b\u00e1sico, alguien dise\u00f1\u00f3 el aspecto y la funcionalidad, tu tel\u00e9fono m\u00f3vil - alguien realmente dise\u00f1\u00f3 el dispositivo, la mesa - el dise\u00f1o, casa - dise\u00f1o\u2026. \u00a1Todo = dise\u00f1o! Vale, tal vez me estoy dejando llevar un poco, pero estoy intentando explicarte la importancia del dise\u00f1o. En un planeta con siete millones y medio de habitantes, hay MUCHOS productos y es importante destacar. S\u00ed, la funcionalidad es importante, pero incluso si la aplicaci\u00f3n funciona perfectamente, tiene toneladas de funciones, no tiene errores... pero se ve terrible, tiene una mala interfaz, la experiencia del usuario (UX) es mala: el usuario encontrar\u00e1 otra aplicaci\u00f3n. <\/span><\/p>\n

Bien, esa es la esencia del dise\u00f1o. Vamos a crear un dise\u00f1o. El t\u00edtulo de esta publicaci\u00f3n de blog es "introducci\u00f3n" por una raz\u00f3n, porque crear un buen dise\u00f1o no es algo en lo que te sientas, lees la teor\u00eda, buscas uno o dos tutoriales y creas el dise\u00f1o perfecto. Si tan solo fuera as\u00ed de f\u00e1cil. Se necesita mucho tiempo para aprender a dise\u00f1ar y se empieza estudiando las cosas que te rodean. Literalmente est\u00e1s mirando los detalles de c\u00f3mo se hizo algo, para volver a los viejos ejemplos: cu\u00e1l es la portada del libro, cu\u00e1l es la forma del qu\u00edmico, cu\u00e1les son las dimensiones del tel\u00e9fono m\u00f3vil, d\u00f3nde y cu\u00e1nto mide. cu\u00e1les son las patas de la mesa, cu\u00e1l es la distribuci\u00f3n de las habitaciones de la casa... S\u00e9 que suena b\u00e1sico y extra\u00f1o, pero tambi\u00e9n es importante: absorber informaci\u00f3n. Por supuesto, un paso m\u00e1s avanzado es Internet, busca el dise\u00f1o de las cosas que te interesan y estudia, analiza, recuerda, combina. \u00a1Leer! Sobre dise\u00f1o: cu\u00e1les son las tendencias, qu\u00e9 est\u00e1 por venir, por qu\u00e9 algo es como est\u00e1 en el dise\u00f1o, qu\u00e9 est\u00e1 fuera, qu\u00e9 les gusta a los usuarios. Entonces, el primer paso es el CONOCIMIENTO.\u00a0<\/span><\/p>\n

\u00a1Empecemos a dise\u00f1ar! Entonces tienes conocimiento, tienes una tarea: sabes lo que hay que dise\u00f1ar. Tienes una especificaci\u00f3n, tienes un texto detallado de qu\u00e9 debe hacer la aplicaci\u00f3n, para qui\u00e9n es y todos los detalles necesarios. Me centrar\u00e9 aqu\u00ed en las aplicaciones, porque Fortuno se ocupa de ello, y probablemente te interese ya que est\u00e1s en nuestro blog. Papel y l\u00e1piz en mano y boceto. Nada complicado, solo la posici\u00f3n del men\u00fa, botones, im\u00e1genes, textos, otros elementos. Dibuja muchas versiones, prueba aplicaciones similares, insp\u00edrate (\u00a1no copie!). Deje que el dise\u00f1o repose en el papel durante uno o dos d\u00edas y luego vuelva a leerlo con la mente fresca. \u00bfTe gusta un dise\u00f1o? \u00bfEs eso todo? Inicie el programa en la computadora y dise\u00f1emos. Advertencia: aqu\u00ed tambi\u00e9n habr\u00e1 toneladas de ajustes, mejoras y adiciones. \u00bfEst\u00e1s interesado en qu\u00e9 programa usar? Hay muchos, demasiados. Dado que esta es una publicaci\u00f3n de blog basada en una experiencia personal, les dir\u00e9 qu\u00e9 programas uso. Adobe Photoshop (f\u00e1cilmente reemplazado por el programa Affinity Photo) para dise\u00f1o. Y s\u00ed, s\u00e9 que no es estrictamente para dise\u00f1o (amigo, Adobe tiene un programa XD que se usa para dise\u00f1o), pero cuando creciste con Photoshop... Otro programa interesante con algunas caracter\u00edsticas \u00fanicas y \u00fatiles es Figma. El programa est\u00e1 destinado exclusivamente al dise\u00f1o. Lo bueno es que tiene un navegador y una versi\u00f3n de escritorio, y cuando creas tu cuenta de usuario, dondequiera que inicies sesi\u00f3n en Figma, tus proyectos est\u00e1n ah\u00ed. Entonces almacena tus dise\u00f1os en l\u00ednea. Otro programa \u00fatil es Adobe Illustrator (que se reemplaza f\u00e1cilmente por Affinity Designer). Entonces esos dos programas, especialmente Designer, son muy buenos para crear dise\u00f1os. Funcionan de forma diferente, utilizando im\u00e1genes y herramientas vectoriales, en lugar de mapas de bits. As\u00ed que ahora depende de usted qu\u00e9 programa conoce o qu\u00e9 programa est\u00e1 listo para aprender. No describir\u00e9 demasiado los programas, esta no es una revisi\u00f3n de esos programas. Eso es todo, el segundo paso: DISE\u00d1O.<\/span><\/p>\n

 <\/p>\n

 <\/p>\n

Ahora bien, a veces tambi\u00e9n tienes un paso intermedio, el paso 1.5. Preparaci\u00f3n, como mencion\u00e9 al comienzo del \u00faltimo cap\u00edtulo. A veces tienes que hacer la preparaci\u00f3n t\u00fa mismo, a veces ya est\u00e1 hecha por ti. Es la investigaci\u00f3n de tu p\u00fablico objetivo, los colores y los elementos espec\u00edficos de la aplicaci\u00f3n en la que est\u00e1s trabajando. Si no es tu aplicaci\u00f3n, preguntarle al cliente qu\u00e9 necesita exactamente y crear un plan. Entonces, haciendo una especificaci\u00f3n.<\/span><\/p>\n

Digamos que tienes un dise\u00f1o, te gusta y crees que ya terminaste. Bueno, en realidad no lo eres. Si la aplicaci\u00f3n es para un cliente, comprueba con \u00e9l que has realizado el dise\u00f1o seg\u00fan sus deseos. A veces suceder\u00e1 que el dise\u00f1o est\u00e1 seg\u00fan las especificaciones, pero el cliente ha cambiado de opini\u00f3n y hay que rehacer el dise\u00f1o. Luego, consulta con una docena de personas qu\u00e9 les parece el dise\u00f1o. Quiz\u00e1s sea genial para ti, pero las personas que te rodean notan algunos problemas que t\u00fa no notaste. Por supuesto, aqu\u00ed tienes que tomar tu propia decisi\u00f3n sobre qu\u00e9 comentarios son \u00fatiles, de alta calidad y cu\u00e1les escuchar\u00e1s. Filtra la retroalimentaci\u00f3n subjetiva de la retroalimentaci\u00f3n objetiva. Y finalmente, prep\u00e1rate para ajustar el dise\u00f1o m\u00e1s adelante, ya sea debido a adiciones, a que los desarrolladores no pueden hacer algo o a alguna tercera raz\u00f3n.\u00a0 <\/span><\/p>\n

Nada, eso es todo desde la introducci\u00f3n. Realmente, simplemente b\u00e1sico, brevemente y tal vez escrito as\u00ed ahora parece que es f\u00e1cil dise\u00f1ar una aplicaci\u00f3n (producto)... Cr\u00e9ame, simplemente suena f\u00e1cil. No dude en dejar preguntas, comentarios y opiniones a continuaci\u00f3n en los comentarios.<\/strong><\/span><\/p>\n

","protected":false},"excerpt":{"rendered":"

Ya sea la App Store, la Play Store, la Microsoft Store, Steam o cualquier otra plataforma de aplicaciones, la cuesti\u00f3n es que hay much\u00edsimas, decenas de miles. El usuario busca una aplicaci\u00f3n espec\u00edfica (no importa para qu\u00e9 sea: un juego, un programa para Windows, para tel\u00e9fonos m\u00f3viles...) y se encuentra con much\u00edsimas similares. \u00bfC\u00f3mo elegir\u00e1 la aplicaci\u00f3n el usuario (t\u00fa, nosotros, yo...)? Rara vez se basa en las caracter\u00edsticas mencionadas, sino m\u00e1s bien en la apariencia: el aspecto de la interfaz, el tipo de im\u00e1genes, el tipo de presentaci\u00f3n (si es un juego) y los colores. Para resumir, y para ir al grano: \u00a1el dise\u00f1o es importante! El dise\u00f1o es MUY importante. Basta con ver cu\u00e1nto invierten las grandes empresas en dise\u00f1o, solo en publicidad: Samsung para sus m\u00f3viles, Microsoft para sus port\u00e1tiles, los juegos para sus anuncios innovadores y peculiares. Todo esto debe estar dise\u00f1ado para atraer al p\u00fablico objetivo (ya sea la poblaci\u00f3n general, j\u00f3venes, personas mayores, mujeres, estudiantes...). Hay muchas definiciones de dise\u00f1o, pero aqu\u00ed hay una que personalmente me gusta: \u00abEl dise\u00f1o es un plan para crear un producto o servicio con la intenci\u00f3n de mejorar la experiencia humana relacionada con un problema espec\u00edfico\u00bb. En t\u00e9rminos sencillos: el dise\u00f1o es todo lo que ves. Los libros en tu escritorio: alguien dise\u00f1\u00f3 las portadas; el bol\u00edgrafo que tienes en la mano, incluso si es el modelo m\u00e1s b\u00e1sico, alguien dise\u00f1\u00f3 la apariencia y la funcionalidad; tu tel\u00e9fono m\u00f3vil: alguien definitivamente dise\u00f1\u00f3 el dispositivo; tu mesa: dise\u00f1o; tu casa: dise\u00f1o\u2026 \u00a1Todo = dise\u00f1o! Bueno, quiz\u00e1s me dej\u00e9 llevar un poco, pero intento explicarles la importancia del dise\u00f1o. En un planeta con siete mil quinientos millones de personas, hay MUCHOS productos y es importante destacar. S\u00ed, la funcionalidad es importante, pero incluso si una aplicaci\u00f3n funciona perfectamente, tiene muchas funciones, no tiene errores\u2026 pero se ve fatal, tiene una mala interfaz, la experiencia de usuario (UX) es mala, el usuario encontrar\u00e1 otra aplicaci\u00f3n. Bueno, eso es todo sobre la importancia del dise\u00f1o. Pasemos a crear dise\u00f1o. El t\u00edtulo de esta entrada del blog es "Introducci\u00f3n" por una raz\u00f3n: crear un buen dise\u00f1o no es algo que se consigue sent\u00e1ndose, leyendo la teor\u00eda, buscando un par de tutoriales y creando el dise\u00f1o perfecto. Ojal\u00e1 fuera as\u00ed de f\u00e1cil. Aprender dise\u00f1o lleva mucho tiempo, y se empieza estudiando lo que nos rodea. Literalmente, te fijas en los detalles de c\u00f3mo se hace algo, volviendo a los viejos ejemplos: cu\u00e1l es la portada del libro, cu\u00e1l es la forma de la sustancia qu\u00edmica, cu\u00e1les son las dimensiones del m\u00f3vil, d\u00f3nde y cu\u00e1nto miden las patas de la mesa, c\u00f3mo est\u00e1 distribuida la casa... S\u00e9 que suena b\u00e1sico y extra\u00f1o, pero es igual de importante: absorber informaci\u00f3n. Por supuesto, un paso m\u00e1s avanzado es internet: busca dise\u00f1os que te interesen y estudia, analiza, recuerda, combina. \u00a1Lee! Sobre dise\u00f1o: cu\u00e1les son las tendencias, qu\u00e9 se viene, por qu\u00e9 algo es como es en dise\u00f1o, qu\u00e9 est\u00e1 de moda, qu\u00e9 les gusta a los usuarios. As\u00ed que el primer paso es CONOCIMIENTO. \u00a1Comencemos a dise\u00f1ar! As\u00ed que tienes conocimientos, tienes una tarea: sabes qu\u00e9 hay que dise\u00f1ar. Tienes una especificaci\u00f3n, un texto detallado de lo que debe hacer la aplicaci\u00f3n, para qui\u00e9n es y todos los detalles necesarios. Me centrar\u00e9 en las aplicaciones, porque Fortuno se ocupa de ellas, y probablemente tambi\u00e9n te interese, ya que est\u00e1s en nuestro blog. Toma papel y l\u00e1piz y dibuja. Nada complicado, solo la posici\u00f3n de men\u00fas, botones, im\u00e1genes, textos y otros elementos. Dibuja muchas versiones, prueba aplicaciones similares, insp\u00edrate (\u00a1no copies!). Deja el dise\u00f1o en el papel un par de d\u00edas y luego rev\u00edsalo con la mente fresca. \u00bfTe gust\u00f3 alg\u00fan dise\u00f1o? \u00bfEso es todo? Abre el programa en tu ordenador y a dise\u00f1ar. Advertencia: aqu\u00ed tambi\u00e9n habr\u00e1 much\u00edsimas revisiones, mejoras y a\u00f1adidos. \u00bfTe preguntas qu\u00e9 programa usar? Hay much\u00edsimos. Como esta entrada de blog se basa en mi experiencia personal, te dir\u00e9 qu\u00e9 programas uso. Adobe Photoshop (se puede sustituir f\u00e1cilmente por Affinity Photo) para dise\u00f1o. Y s\u00ed, s\u00e9 que no est\u00e1 estrictamente pensado para el dise\u00f1o (como, Adobe mismo tiene el programa XD, que se usa para dise\u00f1o), pero cuando creciste con Photoshop... Otro programa interesante con algunas funciones \u00fanicas y \u00fatiles es Figma. Un programa pensado exclusivamente para el dise\u00f1o. Lo bueno es que tiene una versi\u00f3n para navegador y una de escritorio, y cuando creas tu cuenta de usuario, donde sea que inicies sesi\u00f3n en Figma, tus proyectos est\u00e1n ah\u00ed. As\u00ed que almacena tus dise\u00f1os en l\u00ednea. Otro programa \u00fatil es Adobe Illustrator (que se reemplaza f\u00e1cilmente por Affinity Designer). As\u00ed que esos dos programas, especialmente Designer, son muy buenos para crear dise\u00f1os. Funcionan de una manera diferente, usando im\u00e1genes vectoriales y herramientas, en lugar de mapas de bits. As\u00ed que ahora qu\u00e9 programa conoces, o qu\u00e9 programa est\u00e1s listo para aprender, depende de ti. No describir\u00e9 demasiado los programas, esto no es una revisi\u00f3n de esos programas. Eso es todo, el segundo paso: DISE\u00d1O. Ahora, a veces tambi\u00e9n tienes un paso intermedio, el paso 1.5. Preparaci\u00f3n, como mencion\u00e9 al principio del \u00faltimo cap\u00edtulo. A veces tienes que prepararte t\u00fa mismo, otras veces ya est\u00e1 hecho. Se trata de investigar a tu p\u00fablico objetivo, los colores y elementos espec\u00edficos de la aplicaci\u00f3n en la que est\u00e1s trabajando. Si no es tu aplicaci\u00f3n, pregunta al cliente qu\u00e9 necesita exactamente y crea un plan. Es decir, crea una especificaci\u00f3n. Supongamos que tienes un dise\u00f1o, te gusta y crees que ya est\u00e1 listo. Bueno, en realidad no. Si la aplicaci\u00f3n es para un cliente, consulta con \u00e9l si has creado un dise\u00f1o acorde a sus deseos. A veces, el dise\u00f1o se ajusta a la especificaci\u00f3n, pero el cliente cambia de opini\u00f3n y tienes que revisarlo. Luego, consulta con varias personas qu\u00e9 les parece el dise\u00f1o. Quiz\u00e1s te parezca genial, pero tu entorno detecta algunos problemas que t\u00fa no hab\u00edas notado. Por supuesto, aqu\u00ed tienes que decidir qu\u00e9 comentarios son \u00fatiles, de alta calidad y cu\u00e1les escuchar\u00e1s. Filtra los comentarios subjetivos de los objetivos. Y, por \u00faltimo, prep\u00e1rate para ajustar el dise\u00f1o m\u00e1s adelante, ya sea por a\u00f1adidos, porque los desarrolladores no pueden hacer algo o por alguna otra raz\u00f3n. Nada, eso es todo por la introducci\u00f3n. En realidad, solo lo b\u00e1sico, brevemente, y quiz\u00e1s ahora escrito as\u00ed parezca f\u00e1cil dise\u00f1ar una aplicaci\u00f3n (producto)... Cr\u00e9eme, suena f\u00e1cil. No dudes en dejar preguntas, comentarios o sugerencias abajo.<\/p>","protected":false},"author":7,"featured_media":11862,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"categories":[1],"tags":[285],"class_list":["post-7952","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-uncategorized","tag-arhiva"],"acf":[],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/fortuno.hr\/es\/wp-json\/wp\/v2\/posts\/7952","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fortuno.hr\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/fortuno.hr\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/fortuno.hr\/es\/wp-json\/wp\/v2\/users\/7"}],"replies":[{"embeddable":true,"href":"https:\/\/fortuno.hr\/es\/wp-json\/wp\/v2\/comments?post=7952"}],"version-history":[{"count":3,"href":"https:\/\/fortuno.hr\/es\/wp-json\/wp\/v2\/posts\/7952\/revisions"}],"predecessor-version":[{"id":11863,"href":"https:\/\/fortuno.hr\/es\/wp-json\/wp\/v2\/posts\/7952\/revisions\/11863"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/fortuno.hr\/es\/wp-json\/wp\/v2\/media\/11862"}],"wp:attachment":[{"href":"https:\/\/fortuno.hr\/es\/wp-json\/wp\/v2\/media?parent=7952"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/fortuno.hr\/es\/wp-json\/wp\/v2\/categories?post=7952"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/fortuno.hr\/es\/wp-json\/wp\/v2\/tags?post=7952"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}