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
ontwerp en maak een responsive website voor een startup.
- Beschrijving
- Wat is het doelgroep
- wat ga je deze sprint opleveren?
- De opdracht?
- link naar website
- licentie
ik moet voor de opdracht een website maken van de pagina waarop je de pdf kan downloaden. deze moet ik herdesignen en opnieuw programeren.
de doelgroep van deze opdracht is voor de mensen die deze pdf willen downloaden. deze mensen willen de content van de pdf bekijken.
deze sprint ga ik schetsen, figma design en een werkende beginnende website opleveren zodat ik duidelijke feedback kan krijgen op mijn ontwerp en deze goed en efficient kan aanpassen.
de opdracht wat is het probleem? de pagina waar je de whitepapers met een formulier kunt aanvragen is gebouwd in een ander systeem. dit is te zien aan het design: het is minder mooi afgewerkt dan onze ‘echte' website. binnen de verschillende pagina’s voor de whitepapers worden ook verschillende designs gebruikt. zo staan enrise logo’s op verschillende plekken en wordt er bij de whitepaper “van start-up naar scale-up” een ander kleurenschema en lay-out gebruikt.
wat gaan we eraan doen om deze website te verbeteren? we gaan een nieuw design maken die goed matcht met het vorige design van de website zodat het niet lijkt alsof het een totaal andere pagina is van het main domain (https://enrise.com/).
we zorgen ervoor dat je op de pagina als eerste de download knop ziet en een goed duidelijk layout ziet zodat je eerst duidelijk ziet dat je gegevens moet invullen om die document te downloaden.
voor deze pagina zorgen we er eerst voor dat de pagina door middel van mobile first responsive wordt gemaakt. daardoor zal deze pagina goed werken op mobiel en tablets maar ook op grotere schermen zoals een monitor of laptop. we letten bij het ontwerp en uitwerking speciaal op accessibility, kleuren en het daarbij horende contrast, responsiveness en natuurlijk de huisstijl van enrise.
de tools die wij gebruiken voor het testen van de pagina: wcag lighthouse handmatig user test voorbeelden / inspiratie die wij kunnen gebruiken voor het maken van het ontwerp: behance dribbble pinterest one page love extra informatie die wij kunnen gebruiken voor het maken van de website: het is niet verplicht om een framework als tailwind te gebruiken, maar het kan wel helpen sinds dat de originele website van enrise is gemaakt door middel van tailwind. - daarnaast hebben wij ook een branding guide van enrise gekregen. door middel van deze branding guide kunnen wij dezelfde kleuren, logo’s en typografie gebruiken.
bij deze design begin ik door middel van mobile-first, en daarna wil ik dit uitwerken op desktop