Dudas muchas, muero por aprender React, pero voy de a poco, pero a pesar de las dudas sobre ese Framework en cuanto a conceptos fundamentales de diseño todo quedó muy claro y las ganas de aplicar se verán reflejadas en mi próximo proyecto. Me dignaré a crear mi propia página web personal fuera de mediocridades y con mucho amor 💚
Introducción
Todo lo que aprenderás sobre diseño para programadores
Entender los Fundamentos del diseño
El proceso creativo
Conceptos básicos de diseño
Diseño responsivo
Accesibilidad y diseño
Brief y requerimientos técnicos
Aprender sobre Diseño Experiencia de usuario
Definición de diseño UX
Diagramas de flujo
Wireframes y componentes
Aprender sobre Diseño de interfaz de usuario
Definición de diseño UI
Moodboard y línea gráfica
Teoría del color
Paletas de color
Tipografía
Layout y sistemas de grillas
Sistemas de componentes UI
Themes y customizaciones
Imágenes para web
Gráficos en movimiento para web
Resultado final
Conclusiones
Conclusiones del curso
Mentoría Expert
Diseño para programadores
No tienes acceso a esta clase
¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera
Si ya tienes una cuenta,
No se trata de lo que quieres comprar, sino de quién quieres ser. Aprovecha el precio especial.
Antes: $249
$209
Paga en 4 cuotas sin intereses
Termina en:
12 Días
23 Hrs
9 Min
35 Seg
Resultado final
20/22Recursos
Aportes 73
Preguntas 6
Ordenar por:
Pasos del diseño
1-Crear el brief para tener claor los objetivos
2-Crear siteMap para definir la estructura de la app basado en los objetivos del brief
3-Crear User flow para mapear las tareas mas comunes del usuraio (pasos que tiene que hacer un usuario para realizar una tarea) se pueden crear tantos como sea necesario
5-Dibujar wireframes de baja fidelidad a mano para modificarlos rápidamente
6-Crear wireframes de alta fidelidad (dektop, mobile, etc.)
7-Probar nuestro diseño con colores, tipografías etc. (con ayuda de nuestro Style Guide)
8-Crear los componentes (en módulos separados para facilitar la reutilización y con variables CSS para cambiar la paleta de colores fácilmente)
AH!!! YA ENTENDÍ EL STYLE GUIDE!!! es una página que sirve como referencia visual de los estilos que se están aplicando!!!
Directo al curso de Sass->
Les comparto el resultado final del proyecto del curso
PD: No sale toda la página : 8
Siento que la guía de estilos es un proyecto similar al del curso de Sistemas de Diseño para Desarrolladores
Un sitio web donde consultar y documentar los estilos como fuentes, colores, componentes, animaciones, etc… que usa el proyecto. Recomiendo mucho ese curso.
Muy buen curso, aporta muchas herramientas, pero tambien revelo todo lo que me falta por aprender de css y definitivamente toca tomar curso de React aunque un amigo que es Arquitecto en un equipo de desarrollo me recomendo hacer tambien el curso de Angular
Super sin duda aprendí un proceso creativo para desarrollo de web y buenas practicas para mejorar muchos aspectos de mis proyectos
Páginas recomendadas que ví a lo largo del curso:
figma.com – Página web para realizar diseños prototipo de páginas web, con sistema de colaboración como Google Drive. (Aporte de @albertkevin)
color.adobe.com/es/create/color-wheel – Página web para ver y crear una paleta de colores.
fonts.google.com – Fuentes de letra everywhere.
material.io – Página sobre Material Design, que es una normativa de diseño puesta por Google en Android, se pueden aprender cosas de diseño o utilizar sus íconos y recursos.
Paso para el Diseño
- Paso 1: Creamos nuestro Brief -> Resumen de plan
- Paso 2: Creamos nuestro site Map -> Mapa del sitio de solución al brief
- Paso 3: Creamos nuestro wireframe -> diseño en blanco y negro en Desk y Tablet
- Paso 4: Creamos nuestro sketch -> diseño con tonos de color e iconografías en Desk y Tablet
- Paso 5: Definir componentes para evitar retrabajo
- Paso 6: No olvides mostrar tu trabajo y tener mente abierta para los comentarios y criticas todo comentario es bueno para mejorar, claro obviando los comentarios tóxicos.
Me quedó muy presente lo del proceso creativo porque ciertamente yo me creo (creía) una persona poco creativa, y conocer este concepto me hizo reconsiderar mis pensamientos.
Creo que tomare el curso de React por que esta parte no lo entendí muy bien.
React o Angular ? …
React es fenomenal. Acelera el desarrollo de la página y lo hace mas sencillo.
Para practicar lo voy hacer con html, css, js para poner en practica lo aprendido ya que todavía no toco react.js
Este curso me gustó mucho a pesar de que no entendí las partes de sass y react. Tiene muchas perlas de información super valiosas
Excelente recapitalización
Está bastante interesante esto y quedan ganas de aprender más de estas tecnologías, ya las estoy agregando a la ruta de aprendizaje.
🎨 El diseño es importante, este es el primer contacto que tendrá el usuario con la aplicación.
Aprendi muchas cosas de diseño aunque de react no tengo idea esa parte me dejo confundido no importa fue un buen curso
Es increible el tiempo que te podes ahorrar gracias a React
En esta clase se consolida todo el curso, se puede apreciar el resultado de todo el conocimiento dado, que buen curso!
¿Como se abre el proyecto de git en nuestro pc?
Mi reto sera pasar esto usando CSS y JS puro, sin frameworks. 😃
Gracias platzi!!!
Increíble! Curso!
Aunque como novato hay muchas dudas ya tengo mis apuntes y a ver los cursos de lo que no me quedo claro…
Pasos del diseño
1-Crear el brief para tener claor los objetivos
2-Crear siteMap para definir la estructura de la app basado en los objetivos del brief
3-Crear User flow para mapear las tareas mas comunes del usuraio (pasos que tiene que hacer un usuario para realizar una tarea) se pueden crear tantos como sea necesario
5-Dibujar wireframes de baja fidelidad a mano para modificarlos rápidamente
6-Crear wireframes de alta fidelidad (dektop, mobile, etc.)
7-Probar nuestro diseño con colores, tipografías etc. (con ayuda de nuestro Style Guide)
8-Crear los componentes (en módulos separados para facilitar la reutilización y con variables CSS para cambiar la paleta de colores fácilmente)
Excelente curso. Personalmente me sirve para ver desde otra perspectiva el diseño.
Me encanto el curso ❤️
Bueno, muy bien,… como diseñador UI/UX, este curso ha despertado mi suficiente interés por aprender más sobre programación, especialmente entender qué es SASS y Javascript con React. ¡Gracias por este curso que está a la mitad entre diseño y programación!
El sitio web se arma como un rompecabezas 😄
Excelente… se siente deseos de Volar… de continuar y no dejar de aprender…
Para mi estuvo muy satisfactorio el curso, aprendí bastante, pero tambien me di cuenta que esto es solo el comienzo, hace falta mucho por aprender 😃
Lo de diseño es claro ya lo referente al desarrollo web hay que seguir aprendiendo!
4.- Wireframe
1.- Brief
2.- Site map
3.- User flow
Página final
Los primeros pasos son.
- Brief y requerimientos técnicos.
1.1 Objetivos, publico objetivo, distribución, competencia y
cronograma. - Site map y user flow por pagina.
- Wireframe.
- Creación de la pagina.
Vengo en la ruta de fundamentos de programación y éste curso está perfecto por que de verdad te muestra muchos conceptos básicos de diseño y te vas haciendo a la idea de lo que debes o no hacer al momento de aplicar tu programa, web, app, etc. Es muy buen curso y ésto como Samantha lo menciona en un principio es aplicable a muchas otras áreas de la programación. Además de que en mi caso me hace interesarme un poco más en el diseño… cosa que no me atraé mucho.
Veo el Sketch gris y aun así se ve bien, veo el get away del curso, gracias
Muy buen curso, aunque creo que es necesario profundizar muchos conceptos con otros cursos, pero abre los ojos para darse cuenta que se estaba trabajando mal varios aspectos.
Descargué el repositorio para tener a mano el proyecto de referencia que nos proporcionó la Profesora Samanta, sin embargo al momento de usar el "npm install" para instalar las dependencias del proyecto (react, etc) me aparecen un montón de errores y al final no soy capaz de abrir el proyecto, >~<.
¿Alguien sabe a qué se puede deber esto? Comparto por aquí una captura y todos los mensajitos de error:
<\<Mensajitos de error completos>>
npm WARN old lockfile
npm WARN old lockfile The package-lock.json file was created with an old version of npm,
npm WARN old lockfile so supplemental metadata must be fetched from the registry.
npm WARN old lockfile
npm WARN old lockfile This is a one-time fix-up, please be patient...
npm WARN old lockfile
npm WARN deprecated [email protected]: This package is no longer supported.
npm WARN deprecated [email protected]: Please upgrade to v0.1.5
npm WARN deprecated [email protected]: Please upgrade to v0.1.7
npm WARN deprecated [email protected]: Please update to ini >=1.3.6 to avoid a prototype pollution issue
npm WARN deprecated [email protected]: This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful.
npm WARN deprecated [email protected]: Please upgrade to v1.0.1
npm WARN deprecated [email protected]: Please upgrade to v1.0.1
npm WARN deprecated [email protected]: Please upgrade to v1.0.1
npm WARN deprecated [email protected]: Please upgrade to v1.0.1
npm WARN deprecated [email protected]: Please upgrade to v1.0.1
npm WARN deprecated [email protected]: Please upgrade to v1.0.1
npm WARN deprecated [email protected]: Please upgrade to v1.0.1
npm WARN deprecated [email protected]: Please upgrade to v1.0.1
npm WARN deprecated [email protected]: Modern JS already guarantees Array#sort() is a stable sort, so this library is deprecated. See the compatibility table on MDN: <https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort#browser_compatibility>
npm WARN deprecated [email protected]: This package is no longer supported.
npm WARN deprecated [email protected]: flatten is deprecated in favor of utility frameworks such as lodash.
npm WARN deprecated @babel/[email protected]: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-optional-chaining instead.
npm WARN deprecated @babel/[email protected]: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-unicode-property-regex instead.
npm WARN deprecated @babel/[email protected]: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-optional-catch-binding instead.
npm WARN deprecated @babel/[email protected]: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-nullish-coalescing-operator instead.
npm WARN deprecated @babel/[email protected]: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-numeric-separator instead.
npm WARN deprecated @babel/[email protected]: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-json-strings instead.
npm WARN deprecated @babel/[email protected]: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-dynamic-import instead.
npm WARN deprecated @babel/[email protected]: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-class-properties instead.
npm WARN deprecated [email protected]: Rimraf versions prior to v4 are no longer supported
npm WARN deprecated [email protected]: request-promise-native has been deprecated because it extends the now deprecated request package, see <https://github.com/request/request/issues/3142>
npm WARN deprecated [email protected]: This module is no longer supported.
npm WARN deprecated @hapi/[email protected]: This version has been deprecated and is no longer supported or maintained
npm WARN deprecated @hapi/[email protected]: This version has been deprecated and is no longer supported or maintained
npm WARN deprecated @babel/[email protected]: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-async-generator-functions instead.
npm WARN deprecated [email protected]: Rimraf versions prior to v4 are no longer supported
npm WARN deprecated [email protected]: Please see <https://github.com/lydell/urix#deprecated>
npm WARN deprecated [email protected]: This package is no longer supported.
npm WARN deprecated [email protected]: this library is no longer supported
npm WARN deprecated @babel/[email protected]: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-object-rest-spread instead.
npm WARN deprecated [email protected]: This package is no longer supported.
npm WARN deprecated [email protected]: Use your platform's native DOMException instead
npm WARN deprecated [email protected]: <https://github.com/lydell/resolve-url#deprecated>
npm WARN deprecated [email protected]: Use your platform's native atob() and btoa() methods instead
npm WARN deprecated [email protected]: This package is no longer supported.
npm WARN deprecated [email protected]: See <https://github.com/lydell/source-map-resolve#deprecated>
npm WARN deprecated [email protected]: use String.prototype.padStart()
npm WARN deprecated [email protected]: Glob versions prior to v9 are no longer supported
npm WARN deprecated [email protected]: Use your platform's native performance.now() and performance.timeOrigin.
npm WARN deprecated [email protected]: See <https://github.com/lydell/source-map-url#deprecated>
npm WARN deprecated [email protected]: You or someone you depend on is using Q, the JavaScript Promise library that gave JavaScript developers strong feelings about promises. They can almost certainly migrate to the native JavaScript promise now. Thank you literally everyone for joining me in this bet against the odds. Be excellent to each other.
npm WARN deprecated
npm WARN deprecated (For a CapTP with native promises, see @endo/eventual-send and @endo/captp)
npm WARN deprecated [email protected]: This package is no longer supported.
npm WARN deprecated [email protected]: some dependency vulnerabilities fixed, support for node < 10 dropped, and newer ECMAScript syntax/features added
npm WARN deprecated [email protected]: Package no longer supported. Contact Support at <https://www.npmjs.com/support> for more info.
npm WARN deprecated [email protected]: Debug versions >=3.2.0 <3.2.7 || >=4 <4.3.1 have a low-severity ReDos regression when used in a Node.js environment. It is recommended you upgrade to 3.2.7 or 4.3.1. (https://github.com/visionmedia/debug/issues/797)
npm WARN deprecated [email protected]: Debug versions >=3.2.0 <3.2.7 || >=4 <4.3.1 have a low-severity ReDos regression when used in a Node.js environment. It is recommended you upgrade to 3.2.7 or 4.3.1. (https://github.com/visionmedia/debug/issues/797)
npm WARN deprecated [email protected]: Debug versions >=3.2.0 <3.2.7 || >=4 <4.3.1 have a low-severity ReDos regression when used in a Node.js environment. It is recommended you upgrade to 3.2.7 or 4.3.1. (https://github.com/visionmedia/debug/issues/797)
npm WARN deprecated [email protected]: Debug versions >=3.2.0 <3.2.7 || >=4 <4.3.1 have a low-severity ReDos regression when used in a Node.js environment. It is recommended you upgrade to 3.2.7 or 4.3.1. (https://github.com/visionmedia/debug/issues/797)
npm WARN deprecated [email protected]: This loader has been deprecated. Please use eslint-webpack-plugin
npm WARN deprecated [email protected]: Chokidar 2 does not receive security updates since 2019. Upgrade to chokidar 3 with 15x fewer dependencies
npm WARN deprecated [email protected]: Chokidar 2 does not receive security updates since 2019. Upgrade to chokidar 3 with 15x fewer dependencies
npm WARN deprecated [email protected]: The querystring API is considered Legacy. new code should use the URLSearchParams API instead.
npm WARN deprecated [email protected]: It is not compatible with newer versions of GA starting with v4, as long as you are using GAv3 it should be ok, but the package is not longer being maintained
npm WARN deprecated [email protected]: babel-eslint is now @babel/eslint-parser. This package will no longer receive updates.
npm WARN deprecated @hapi/[email protected]: Moved to 'npm install @sideway/address'
npm WARN deprecated [email protected]: please switch to a stable version
npm WARN deprecated [email protected]: Please upgrade to version 7 or higher. Older versions may use Math.random() in certain circumstances, which is known to be problematic. See <https://v8.dev/blog/math-random> for details.
npm WARN deprecated [email protected]: This package is no longer supported.
npm WARN deprecated [email protected]: This package is no longer supported.
npm WARN deprecated [email protected]: request has been deprecated, see <https://github.com/request/request/issues/3142>
npm WARN deprecated @hapi/[email protected]: This version has been deprecated and is no longer supported or maintained
npm WARN deprecated @hapi/[email protected]: Switch to 'npm install joi'
npm WARN deprecated [email protected]: This SVGO version is no longer supported. Upgrade to v2.x.x.
npm WARN deprecated [email protected]: This version of tar is no longer supported, and will not receive security updates. Please upgrade asap.
npm WARN deprecated [email protected]: Node Sass is no longer supported. Please use `sass` or `sass-embedded` instead.
npm WARN deprecated [email protected]: core-js@<3.23.3 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Some versions have web compatibility issues. Please, upgrade your dependencies to the actual version of core-js.
npm WARN deprecated [email protected]: core-js-pure@<3.23.3 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Some versions have web compatibility issues. Please, upgrade your dependencies to the actual version of core-js-pure.
npm WARN deprecated [email protected]: core-js@<3.23.3 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Some versions have web compatibility issues. Please, upgrade your dependencies to the actual version of core-js.
npm ERR! code 1
npm ERR! path /home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/node-sass
npm ERR! command failed
npm ERR! command sh -c node scripts/build.js
npm ERR! Building: /home/vmiguel/.nvm/versions/node/v20.13.1/bin/node /home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/node-gyp/bin/node-gyp.js rebuild --verbose --libsass\_ext= --libsass\_cflags= --libsass\_ldflags= --libsass\_library=
npm ERR! gyp info it worked if it ends with ok
npm ERR! gyp verb cli \[
npm ERR! gyp verb cli '/home/vmiguel/.nvm/versions/node/v20.13.1/bin/node',
npm ERR! gyp verb cli '/home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/node-gyp/bin/node-gyp.js',
npm ERR! gyp verb cli 'rebuild',
npm ERR! gyp verb cli '--verbose',
npm ERR! gyp verb cli '--libsass\_ext=',
npm ERR! gyp verb cli '--libsass\_cflags=',
npm ERR! gyp verb cli '--libsass\_ldflags=',
npm ERR! gyp verb cli '--libsass\_library='
npm ERR! gyp verb cli ]
npm ERR! gyp info using [email protected]
npm ERR! gyp info using [email protected] | linux | x64
npm ERR! gyp verb command rebuild \[]
npm ERR! gyp verb command clean \[]
npm ERR! gyp verb clean removing "build" directory
npm ERR! gyp verb command configure \[]
npm ERR! gyp verb check python checking for Python executable "python2" in the PATH
npm ERR! gyp verb `which` failed Error: not found: python2
npm ERR! gyp verb `which` failed at getNotFoundError (/home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/which/which.js:13:12)
npm ERR! gyp verb `which` failed at F (/home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/which/which.js:68:19)
npm ERR! gyp verb `which` failed at E (/home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/which/which.js:80:29)
npm ERR! gyp verb `which` failed at /home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/which/which.js:89:16
npm ERR! gyp verb `which` failed at /home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/isexe/index.js:42:5
npm ERR! gyp verb `which` failed at /home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/isexe/mode.js:8:5
npm ERR! gyp verb `which` failed at FSReqCallback.oncomplete (node:fs:197:21)
npm ERR! gyp verb `which` failed python2 Error: not found: python2
npm ERR! gyp verb `which` failed at getNotFoundError (/home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/which/which.js:13:12)
npm ERR! gyp verb `which` failed at F (/home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/which/which.js:68:19)
npm ERR! gyp verb `which` failed at E (/home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/which/which.js:80:29)
npm ERR! gyp verb `which` failed at /home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/which/which.js:89:16
npm ERR! gyp verb `which` failed at /home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/isexe/index.js:42:5
npm ERR! gyp verb `which` failed at /home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/isexe/mode.js:8:5
npm ERR! gyp verb `which` failed at FSReqCallback.oncomplete (node:fs:197:21) {
npm ERR! gyp verb `which` failed code: 'ENOENT'
npm ERR! gyp verb `which` failed }
npm ERR! gyp verb check python checking for Python executable "python" in the PATH
npm ERR! gyp verb `which` failed Error: not found: python
npm ERR! gyp verb `which` failed at getNotFoundError (/home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/which/which.js:13:12)
npm ERR! gyp verb `which` failed at F (/home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/which/which.js:68:19)
npm ERR! gyp verb `which` failed at E (/home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/which/which.js:80:29)
npm ERR! gyp verb `which` failed at /home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/which/which.js:89:16
npm ERR! gyp verb `which` failed at /home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/isexe/index.js:42:5
npm ERR! gyp verb `which` failed at /home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/isexe/mode.js:8:5
npm ERR! gyp verb `which` failed at FSReqCallback.oncomplete (node:fs:197:21)
npm ERR! gyp verb `which` failed python Error: not found: python
npm ERR! gyp verb `which` failed at getNotFoundError (/home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/which/which.js:13:12)
npm ERR! gyp verb `which` failed at F (/home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/which/which.js:68:19)
npm ERR! gyp verb `which` failed at E (/home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/which/which.js:80:29)
npm ERR! gyp verb `which` failed at /home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/which/which.js:89:16
npm ERR! gyp verb `which` failed at /home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/isexe/index.js:42:5
npm ERR! gyp verb `which` failed at /home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/isexe/mode.js:8:5
npm ERR! gyp verb `which` failed at FSReqCallback.oncomplete (node:fs:197:21) {
npm ERR! gyp verb `which` failed code: 'ENOENT'
npm ERR! gyp verb `which` failed }
npm ERR! gyp ERR! configure error
npm ERR! gyp ERR! stack Error: Can't find Python executable "python", you can set the PYTHON env variable.
npm ERR! gyp ERR! stack at PythonFinder.failNoPython (/home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/node-gyp/lib/configure.js:484:19)
npm ERR! gyp ERR! stack at PythonFinder.\<anonymous> (/home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/node-gyp/lib/configure.js:406:16)
npm ERR! gyp ERR! stack at F (/home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/which/which.js:68:16)
npm ERR! gyp ERR! stack at E (/home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/which/which.js:80:29)
npm ERR! gyp ERR! stack at /home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/which/which.js:89:16
npm ERR! gyp ERR! stack at /home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/isexe/index.js:42:5
npm ERR! gyp ERR! stack at /home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/isexe/mode.js:8:5
npm ERR! gyp ERR! stack at FSReqCallback.oncomplete (node:fs:197:21)
npm ERR! gyp ERR! System Linux 5.15.153.1-microsoft-standard-WSL2
npm ERR! gyp ERR! command "/home/vmiguel/.nvm/versions/node/v20.13.1/bin/node" "/home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/node-gyp/bin/node-gyp.js" "rebuild" "--verbose" "--libsass\_ext=" "--libsass\_cflags=" "--libsass\_ldflags=" "--libsass\_library="
npm ERR! gyp ERR! cwd /home/vmiguel/My WSL Workspace/Cursos de Platzi/Curso de Diseño para Developers/repositorio de ejemplo/4-app/node\_modules/node-sass
npm ERR! gyp ERR! node -v v20.13.1
npm ERR! gyp ERR! node-gyp -v v3.8.0
npm ERR! gyp ERR! not ok
npm ERR! Build failed with error code: 1
npm ERR! A complete log of this run can be found in: /home/vmiguel/.npm/\_logs/2024-09-09T16\_26\_36\_855Z-debug-0.log
Genial!
El miedo es el mayor obstaculo que tenemos, antes pensaba en diseño UX y en realidad, me daba pánico, hoy con este curso, veo que es algo que se puede trabajar y aportar mucho a mi conocimiento.
Aún no sé nada de React, poco a poco
Yo amo figma para hacer estos planos/diseños!!!
Buenas tardes comunidad! realmente fue un curso rápido y productivo, me gustaría tener un folder para guardar clases como esta, que seguramente me servirá en mi futuro como developer.
¡¡Muy práctico!!
¡¡A darle!!
😬 Lo que aprendí de diseño aquí es de bastante utilidad!
Muy bueno, hasta ahora e slo mas cerca que he experimentado de un trabajo completo como desarollador, coincido con varios comentarios, esto es solo el comienzo, falta mucho
gracias me ayudo demasiado para poder hacer una web para restaurante restaurante pero primero partir de un diagrama y tambien establecer nuestros colores y tipografia como diagramas para saber el funcionamiento
Gracias por el resumen, muy oportuno.
El resultado final debe contener el Brief, diagrama de flujo, user flow, wirefrimes y el diseño final de la pagina. Me gusto este curso, gracias Samanta.
Aun que ya utilice ciertas herramientas mencionadas, voy a tratar de mejorar en las recomendaciones como en la parte de imágenes y animaciones.
Muy interesante el curso, para los que estamos empezando nos da una pauta del diseño para nuestras creaciones, lo más importante, en mi caso, me mostró las falencias en mi conocimiento y ayuda a trazar una mejor ruta de aprendizaje.
Me gusta la idea del styleguide, y usar css grid es de las mejores herramientas que podemos usar para estructurar una web. Recomiendo mucho aprenderlo
muy buen proyecto, tomarlo como referencia ayudara bastante.
Excelente curso! Breve pero potente. Me sirvió para reforzar varios temas y para aprender buenas prácticas de diseño web 😃
.
Gracias Samanta!!
Definitivamente aprendí un montón con este curso. Quiero avanzar en muchos temas. Tema favoritos: Colores, UX y Brief. Importantes. Me encantó.
aprendiendo cada dai mas 💚
Muy buen curso, básico pero conciso, es el primer curso que se debería tomar antes de empezar con cualquier otro de desarrollo.
uy interesante como se hizo un resumen de todo el curso, fue muy conciso!!!
Excelente resumen, preciso e interesante. #NSL 😄
Gracias por el contenido!
Alguien me podria decir ¿que es progressive enhancement aun no me quedda claro?
Me abrieron los ojos, yo pensé que el diseño solo eran colores y letritas. Muchas gracias.
Sin duda me ha servido de ayuda para poder comprender de una manera un poco mas clara el tema del diseño y la importancia que este al igual que el backend tiene para el performance de un sitio, hay mucho que aprender pero vamos a darle
Muy buen curso
Exelente Samanta!
Creo que como muchos me voy con dudas pero bastante motivado a aprender más ❤️
Para mi fue un gran curso. Debo ver otros cursos para aplicar lo visto en este, y asi poder desarrollar el proyecto de la profe Samanta. Esto me hábre el camino del diseño y la programacion que se ven muy interesante juntos como complemento uno del otro. ¡Nunca pares de aprender!
¿Quieres ver más aportes, preguntas y respuestas de la comunidad?