https://github.com/juandc/web-unicorn-challenge
:green_heart::unicorn: Reto para el Curso Profesional de Desarrollo Web en Platzi
https://github.com/juandc/web-unicorn-challenge
desarrolloweb platzi platzi-challenge unicorn web-design web-design-inspiration
Last synced: 10 months ago
JSON representation
:green_heart::unicorn: Reto para el Curso Profesional de Desarrollo Web en Platzi
- Host: GitHub
- URL: https://github.com/juandc/web-unicorn-challenge
- Owner: juandc
- License: mit
- Created: 2019-01-21T17:36:27.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2019-08-08T05:49:06.000Z (almost 7 years ago)
- Last Synced: 2025-03-26T12:12:04.445Z (over 1 year ago)
- Topics: desarrolloweb, platzi, platzi-challenge, unicorn, web-design, web-design-inspiration
- Homepage: https://platzi.com/blog/web-unicorn-challenge/
- Size: 3.42 MB
- Stars: 16
- Watchers: 4
- Forks: 15
- Open Issues: 16
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# :unicorn: Reto del Curso Profesional de Desarrollo Web
Alinear elementos donde realmente los quieres puede ser una tarea sumamente complicada. Afortunadamente, CSS nos permite hacer páginas impresionantes con muy poco esfuerzo. El secreto está en conocer muy bien sus propiedades y funciones.
En este desafío debemos convertir un diseño web en una página 100% profesional. ¡Debe quedar igualita! No basta con que se parezca un poquito. Debe ser una réplica exacta que demuestre nuestras capacidades y hable bien de nuestro trabajo.
## Plantilla:
Puedes descargar los _assets_ y los archivos de diseño del desafío en el siguiente link: [github.com/juandc/web-unicorn-challenge/challenge](https://github.com/juandc/web-unicorn-challenge/blob/master/challenge).
[](https://dribbble.com/shots/5882011-Desaf-o-del-Unicornio-Web-Profesional-Platzi)
## Instrucciones:
Para aprobar este desafío debes seguir las siguientes instrucciones:
- Programar una página web 100% replica del diseño.
- Hacer deploy de tu página web para que todos podamos ver el resultado en internet. Puedes usar **Github Pages**, **Zeit Now**, **Heroku** o la herramienta que más te guste.
- Mandar un [Issue](https://github.com/juandc/web-unicorn-challenge/issues) a este repositorio indicando dónde podemos encontrar tu solución: la URL, el código y una imágen .
Todo esto lo puedes aprender en el [Curso Profesional de Desarrollo Web](https://platzi.com/cursos/web-avanzado/).
## Puntos extra:
Para demostrar que tu solución es la más creativa puedes intentar ganar aún más puntos de la siguiente manera:
- Modificar o añadir secciones del diseño, puedes hacer todos los cambios que quieras SIEMPRE y cuando el resultado de tu página web sea 100% basado en tu nuevo diseño.
- Diseñar y programar la versión _mobile_ de tu página web. Si necesitas ayuda puedes tomar el [Curso de Responsive Design](https://platzi.com/responsive) de Platzi.
- Añadir animaciones y transiciones de todo tipo. Puedes ayudarte del [Curso de Animaciones para Web](https://platzi.com/cursos/animaciones-web/).
- Mejorar la experiencia de los usuarios en tu sitio web con [WPO: Optimización de Carga de Sitios Web](https://platzi.com/cursos/optimizacion-web/).
- Utilizar [CSS Grid](https://platzi.com/cursos/css-grid-layout/) para la estructura de tu página web
- Utilizar compiladores y procesadores de CSS y JavaScript como [Webpack](https://platzi.com/cursos/webpack), [Gulp](https://platzi.com/cursos/diseno-desarrolladores/), [Sass](https://platzi.com/cursos/sass/), [Less](https://platzi.com/cursos/less), [Stylus](https://platzi.com/cursos/stylus) o [PostCSS](https://platzi.com/cursos/postcss).
## ¡Ganadores del Desafío de Desarrollo Web!
### 1. :trophy: Ismael Dominguez Moreno
Tu resultado fue el más limpio. Excelente visualmente. Además, la nueva sección de contacto sigue el estilo del resto del proyecto y funciona realmente bien. La aplicación fue construida con React.js y Webpack.
- [Desafío de Ismael](https://github.com/juandc/web-unicorn-challenge/issues/8)
### 2. :medal_sports: Miguel Valverde
Las modificaciones y nuevas secciones son excelentes. Hay animaciones espectaculares por todas partes. La aplicación fue construida con CSS Grid y Bootstrap (la versión móvil está en construcción).
- [Desafío de Miguel](https://github.com/juandc/web-unicorn-challenge/issues/16)
### 3. :medal_military: Emmanuel Guerra
Las animaciones no solo aparecen porque sí, algunas también reaccionan al comportamiento de los usuarios.
- [Desafío de Emmanuel](https://github.com/juandc/web-unicorn-challenge/issues/7)
### :innocent: Menciones especiales:
**Gabriel De Andrade**: Gabriel no solo resolvió muy muy bien el desafío, también nos dio un tutorial espectacular para crear animaciones basadas en física de resortes con React Spring.
- [Desafío de Gabriel](https://github.com/juandc/web-unicorn-challenge/issues/11)
- [¿Cómo animar en React con React Spring?](https://platzi.com/blog/animaciones-con-react-spring/)
**Jaime Burbano**: me encantan los colores y la limpieza de tu solución. Y como si fuera poco, tienes presentación en Behance. ¡Y un video de cómo codeaste la aplicación! :scream: :open_mouth: :raised_hands:
- [Desafío de Luis](https://github.com/juandc/web-unicorn-challenge/issues/10)
- [Presentación del Proyecto en Behance](https://www.behance.net/gallery/82917315/Reto-Unicornio-Platzi-UI-Development)
- [RAW Live coding: ¡Construcción del proyecto en video!](https://youtu.be/_HorJw3PQmA)