Diseño Centrado en el Usuario y Transformación Digital en la Educación Media Superior: Desarrollo de un Portal Web con Tecnologías Emergentes
Resumen
El presente documento expone el desarrollo e implementación de un sitio web institucional para el Plantel Conalep Juárez I, desde la identificación del problema hasta la evaluación del proyecto. El objetivo principal fue establecer una presencia en línea profesional que facilitara la comunicación con la comunidad educativa y ofreciera información accesible y actualizada sobre programas académicos, eventos y actividades. Ante la ineficacia de medios tradicionales como boletines impresos y correos electrónicos, se implementó una fase diagnóstica mediante encuestas para identificar las necesidades de los usuarios. A partir de estos datos, se diseñó y desarrolló una plataforma utilizando tecnologías modernas como React, Tailwind CSS, JavaScript, Strapi, Next.js, Framer Motion y NextUI, alojada en Vercel. El resultado fue un sitio web dinámico, intuitivo y visualmente atractivo, con mejoras notables en rendimiento y experiencia de usuario. La comunidad educativa respondió positivamente a su implementación, destacando avances significativos en accesibilidad, usabilidad y satisfacción general. Se concluye que el proyecto cumplió con los objetivos establecidos, proponiéndose como recomendaciones realizar respaldos periódicos, capacitar al personal encargado y mantener actualizados tanto el contenido como las funcionalidades del sitio.
Descargas
Citas
Abba, I. (2023, September 19). How to Use Tailwind CSS to Rapidly Develop Websites. Kinsta. Retrieved May 30, 2024, from https://kinsta.com/blog/tailwind-css/
Ahmed, A. (2023, July 30). What is Vercel and Why You Should Use It? Fishtank Consulting. Retrieved May 30, 2024, from https://www.getfishtank.com/blog/what-is-vercel
AWS. (2024, June 3). ¿Cuál es la diferencia entre el front end y back end en el desarrollo de aplicaciones? AWS. Retrieved June 3, 2024, from https://aws.amazon.com/es/compare/the-difference-between- frontend-and-backe nd/
Canal, P. (2023, Mayo 4). ¿Qué es el diseño centrado en el usuario? IEBS. Retrieved June 3, 2024, from https://www.iebschool.com/blog/diseno-centrado-en-el-usuario-analitica-usabilida d/
Foundation. Retrieved May 30, 2024, from
https://www.interaction- design.org/literature/topics/web-design
Framer Motion. (2024, Mayo 30). Introduction. Framer. Retrieved Mayo 30, 2024, from
https://www.framer.com/motion/introduction/
Gadhavi, M. (2023, June 18). Strapi: What is it, and Why You Should Use it? Radixweb. Retrieved May 30, 2024, from https://radixweb.com/blog/what-is-strapi
Git. (2024, May 30). What is Git? Git SCM. Retrieved May 30, 2024, from https://git-scm.com Interaction Design Foundation. (2016, Junio 2). What is Web Design? | IxDF. The Interaction Design
Loranger, H. (2014, August 10). UX Without Users Is Not UX. Nielsen Norman Group. Retrieved May 30, 2024, from https://www.nngroup.com/articles/ux-without-user-research/
MDN. (2024, June 3). Seguridad de Sitios Web. MDN. Retrieved June 3, 2024, from
https://developer.mozilla.org/es/docs/Learn/Server-side/First_steps/Website_sec urity
Next JS. (2024, May 30). React Foundations: About React and Next.js. Next.js. Retrieved May 30, 2024, from https://nextjs.org/learn/react-foundations/what-is-react-and-nextjs
Next UI. (2024, May 30). Introduction. NextUI. Retrieved May 30, 2024, from
https://nextui.org/docs/guide/introduction
React. (2024, May 30). React: La biblioteca para interfaces de usuario web y nativas. React. Retrieved May 30, 2024, from https://es.react.dev
Responsive design - Learn web development | MDN. (2024, April 29). MDN Web Docs. Retrieved May 30, 2024, from https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Responsive_D esign
Server-side website programming - Learn web development | MDN. (2023, June 29). MDN Web Docs. Retrieved May 30, 2024, from
Derechos de autor 2025 Marisela Palacios Reyes , Fidel Antonio Gómez Mitsui, Juan Manuel Bernal Ontiveros, Verónica Farias Veloz, Claudia Anglés Barrios

Esta obra está bajo licencia internacional Creative Commons Reconocimiento 4.0.
							
							










.png)
















.png)
1.png)

