Introducción a Diseño Modular

Clase 8 de 12 • Introducción al Diseño de Prototipos 2018

José Guillermo

student•

Diseño modular:
Básicamente se refiere a la creación de componentes que serán reusables durante tu proyecto, ya que naturalmente tendrán que repetirse y es mucho más fácil usar esta “base” sobre tu pantalla, podemos pensar en esto como una “plantilla”. Estos componentes o módulos creados son la esencia o fundamento de las librerías de estilos que tus diseñadores van a estar desarrollando (front-end). Esto es llamado como “componente compartido”, ya que esa “base” se distribuye en varias ocasiones como es en el caso de Amazon, donde en su tienda, utilizan la misma lógica de presentación de información para sugerirte música y para sugerirte artículos en venta.

José Guillermo

student•

Nota: Misael me parece que hizo un comentario del cual no me percate, refiriéndose a que el trabajo de los diseñadores en front-end es análogo a la tarea de mantener los estilos de un símbolo en Sketch, Adobe XD, etcétera, claro porque como comentaba, al modificar un elemento se afectan todos los demás, son instancias del mismo. No quizo decir que solo en el front-end se realice esto, solo fue una analogía que empleo.

VERDUGO CHAVEZ DIANA ALEJANDRA

student•

Buen Resumen

Rhendell Zambrano

student•

¿El diseño modular es una característica de los sistemas de diseño?

Misael León

teacher•

Sí, estratégicamente es recomendable planear un sistema de diseño que sea escalable. Esto para que sea más fácil de darle mantenimiento tanto en diseño como en librerías de front-end.

También es más fácil para el usuario acostumbrarse un número limitado de componentes en tu sistema.

Jorge Giraldo Guerrero R.

student•

Hay alguna documentación con los patrones de los que se habla? o los que mas se usan? muchas gracias…¡

Johana Andrea Granados Coca

student•

Objetivo conciso sobre el diseño modular: Generar contenido de forma que su búsqueda sea intuitiva y consistente acorde al modelo mental de los usuarios.

Para lograr esto se manejan los componentes en bloque que sean repetibles, reusables y a la vez independientes.

Alejandro Uray

student•

¿Existe algún software para Windows que también tenga la funcionalidad de símbolos de Sketch?

Juan Diego Silva Garcia

student•

Figma Muy recomendado!

Camilo Caquimbo Tabares

student•

Lunacy, GravitDesigner y Affinity Designer también son muy similares a Sketch

Susana Gonzalez Cano

student•

El diseño modular consiste en construir interfaces por bloques. Estos bloques son componentes reusables, repetidos e "independientes", es decir, les vas a dar mantenimiento por separado. Estos componentes son fáciles de reparar, modificar, mejorar y mantener, (tal como los símbolos de Sketch). Generalmente un diseño modular y sus componentes van a ser los fundamentos de las librerías de estilos y componentes compartidos con el equipo pues esto serán los fundamentos de las librerías de front-end del proyecto.

María Guadalupe Aranda González

student•

Diseño Modular: Es el diseño por bloques/ componentes reusables, que son fáciles de reparar, modificar y mantener. Este diseño permite crear experiencias intuitivas y consistentes para el usuario.

Italika México

student•

Modular design

Ali Colmenares

student•

El diseño modular se podria decir que tiene el mismo concepto de los componentes de React.js facil de reparar, modificar y reutilizar.

Pedro Mugartegui.

student•

Una pregunta Misael. El diseño atómico se compone de varios módulos o al revés ?

Juan Bedoya

student•

Hola @petemugartegui, es al reves, un modulo esta compuesto de muchos atomos, puedes profundizar sobre este tema en estelink Atomic Design

Brian Robert Polo Lazo

student•

El diseño modular es el enfoque de construcciòn de interfaces por bloques, son reusables, repetidos e independientes. Este curso es fantastico

Bianca Meléndez Arellana

student•

El enfoque del diseño modular nos permite acostumbrarnos a trabajar con componentes o bloques; estos son equivalentes a los símbolos de Sketch o los Componentes en Figma; estos bloques se convierten en la base de nuestra librería de estilos la cual necesitarán los desarrolladores con los que trabajaremos.

Elba Sindoni

student•

Serian patrones en realidad, no?, como tener legos, les das muchos usos.

Claudia Cabello

student•

Yo pienso lo mismo, son patrones de diseño.

David Behar

student•

Sí, son patrones que se repiten en el diseño, pero no son patrones de diseño, los patrones de diseño son universales, pero los módulos son particulares para tu proyecto

Sebastian Quilaguy

student•

DE ACUERDO, así es más intuitivo para el usuario, mucho más optimo y sostenible para el equipo de diseño y desarrollo.

David Navarro Rolon

student•

Pattern lab?

Yuri Añorga

student•

Diseño Modular ¿Por qué tomar esta idea? Simple, es fácil de reparar, modificar, mejorar y mantener.

Viberth Gonzalez

student•

Que es el diseño modular y sus ventajas

Ruben Hernandez Reichelbauman

student•

Diseño Modular: Enfoque de diseño para construir interfaces por bloques. Bloques: componentes reusables, repetidos e “independientes” Características: Fácil de reparar, modificar, mejorar y mantener. Símbolos: conjunto de elementos anidados, puede contener Imágenes, textos, meta datos, botones, etc.

Christian David Sánchez

student•

El diseño modular te ayuda a reutilizar, mantener y muy fácil de modificar.

Jenffry José Bencomo Hernandez

student•

Esto lo tenía ya mas que claro, pero súper genial

Federico Maciel

student•

Resumen: -La importancia de crear diseños y productos que sean compuestos de diferentes componentes, es que nos da una ventaja sobre el diseño tradicional en el que son difíciles para construir interfaces por bloques. -En el diseño modular existe un enfoque de diseño para construir interfaces por bloques. -Son fáciles de reparar, modificar, mejorar y mantener. -Los componentes del diseño modular son los fundamentos de las librerías de estilos y componentes compartidos.

Introducción a Diseño Modular

Prototipado

Actualización de curso

Conoce los beneficios del Prototipado

Niveles de Fidelidad

Introducción a Patrones de Diseño

Introducción a UX Orientado a Objetos

Wireframes en Papel (Baja Fidelidad)

Wireframes digitales (Mediana Fidelidad)

Introducción a Diseño Modular

Prototipado de Alta Fidelidad

Construcción de un Prototipo Clickeable

Contenido Bonus

Patrones de Diseño o Patrones de Interfaz de Usuario (UI)

Wireframes, Prototipos y Mockups: Qué son y cuándo usarlos