Vous allez reproduire une maquette en utilisant les principes de Material Design

• Mettre en pratique vos connaissances d'intégration html/css/materialize

Vous devez écrire le code HTML (index.html) et de CSS (ccs/custom.css) pour reproduire la charte graphique jointe. Vous devrez utiliser le framework MaterializeCSS et vous privilégerez son implémentation par CDN.

Vos références sont les fichiers /maquette_onepage*.pdf

Votre template HTML contiendra plusieurs parties dans l'ordre :

• un sticky-header avec 3 liens avec ancrés vers les 3 sections de la page
• une première section fullscreen présentant l'application et contenant 2 liens de téléchargements (*hero.pdf)
• une section présentant les bénéfices de l'application (*step1.pdf)
• une section contenant les Features de l'application (*step2.pdf)
• une section contenant les Reviews sous forme d'un "Carousel" (*step3.pdf)
• une section Download reprenant un visuel et contenant 2 liens de téléchargements (*step4.pdf)
• un footer contenant un formulaire d'inscription à la newsletter et les liens vers les réseaux sociaux

Le menu sera composé des rubriques suivantes :

• Features
• Reviews
• Download

Le site onepage devra ếtre responsive avec un soin particulier apporté pour les très petits affichages.

Les images vous sont fournies et devront être utilisées.

Du texte de substitution pourra ếtre utilisé lorsque nécessaire, les liens externes seront fictifs (Downloads, réseaux sociaux, etc.)

Seule l'intégration du formulaire est demandée (pas de traitement serveur).

• Créez un effet de transition sur le fond du sitcky-header lorsque la position du scroll est supérieure à 0
• Créez une transition de type "smoothscroll" pour la navigation du menu par ancre
• Ajoutez des effets d'apparition par translation sur les images des mises en situation (téléphones) avec https://materializecss.com/scrollspy.html ou http://scrollmagic.io
• Ajoutez une validation du champ email du formulaire d'inscription à la newsletter

Vous rendrez un repo github contenant tous les fichiers du projet. N’hésitez pas à rendre un travail incomplet même si vous avez eu l’un ou l’autre blocage !

https://github.com/Dogfalo/materialize