Fork deze leertaak en ga aan de slag. Onderstaande outline ga je gedurende deze taak in jouw eigen GitHub omgeving uitwerken. De instructie vind je in: docs/INSTRUCTIONS.md

Responsive website voor the Valley 📱 💻

Opdracht 🚀

Ontwerp en maak een interactieve website voor een opdrachtgever.

Inhoudsopgave 📋

• Over the Valley
• Design challenge
• Gebruik van de website
• Checklist wel/ niet gelukt
• Kenmerken
• Live website
• Licentie

Over the valley 💬

The Valley is een onafhankelijk, creatief adviesbureau. The Valley biedt vooral diensten aan zoals design, development, exposure, digital transformation en organization design. Deze diensten bieden ze aan, aan ondernemers om hun bedrijf meer bekendheid te geven. The Valley kan alles voor een onderneming bieden. De ondernemer hoeft niet nog een ander bedrijf erbij betrekken om bepaalde marketingstrategieën te bereiken. De Valley doet dit allemaal voor de klant.

Design Challenge 🎨

Het doel van de opdracht was om een responsive design te maken en te realiseren voor de opdrachtgever. Naast de opdracht waren er een aantal richtlijnen om aan te houden tijdens het ontwerpen en bouwen. Dit waren; zorgen dat er een carousel aanwezig is, een modal en nog verschillende animaties en transities. We hebben het desktop-ontwerp en de andere benodigdheden ontvangen via een figma-bestand.

Gebruik van de website 🔖

Op de website heb ik voor de facts and figures een animatie toegevoegd. Als je scrollt komen de blokken met een animatie naar boven in beeld. Ik heb ook een pop-up gemaakt voor de contact-button. Als je op de button klikt, komt er een contactformulier. Op dit formulier zit een validatie. Deze kun je dus niet on-ingevuld versturen. Ook heb ik onder in de pagina een slider gemaakt met 2 foto's.

Checklist wel/niet gelukt 📑

Wat er wel is gelukt ✅:

• Carousel
• Dialog
• Micro-animatie op desktop/ipad
• Validation
• Alle informatie staat erin
• Mobiele versie

Wat er niet is gelukt ❌ :

• Micro-animatie op mobiel
• Kruisje bij het contactformulier werkend maken
• Button contactformulier inactive maken als het formulier nog niet goed is ingevuld
• Menu werkend
• Footer linkjes toevoegen
• Afbeeldingen goed plaatsen op ipad/desktop
• Contact-section mooi opmaken
• Carousel met vinger kunnen swipen
• Footer tot de rand vullen
• Footer op desktop hetzelde maken als in het voorbeeld (met meerdere kolommen)

Kenmerken 👤

• HTML

• CSS

• JS

• Visual studio code

• Figma

• Carousel

• Dialog

• Micro-animatie

• Validation

Live website 🌐

http://maaike0904-thevalley-startup.student.fdnd.nl/

Licentie 💯

This work is licensed under GNU GPLv3.