Bieb in Bloei is een digitaal platform met daarop een overzicht van de duurzame projecten van de Buurtcampus Oost.
De Buurtcampus is een dynamische, laagdrempelige plek waar iedereen zich welkom en uitgenodigd voelt om kennis op te doen, te ontwikkelen en te delen. Met als doel: samen de buurt duurzamer, gezonder en inclusiever maken. Bij de buurtcampus draaien verschillende duurzame projecten; De Stekjes bieb, De Zadenbieb en de Geveltuin. en er komen binnenkort nog meer duurzame projecten bij. Op het platform Bieb in Bloei krijgen deze projecten een gezicht.
Wij hebben de opdracht gekregen om de huidige live bieb-in-bloei website te optimaliseren en te verrijken. Eerder hebben een aantal CMD minor studenten een eigen versie van de bieb-in-bloei website ontwikkelt. Hierin hebben zij geëxperimenteerd met een weather API. Ook hebben ze concepten bedacht als een seizoensthema en mascotte Harry. Het was aan ons de taak om deze concepten in de live bieb-in-bloei website te integreren. Uiteindelijk hebben wij Harry de mascotte geïmplementeerd:
- Mascotte Harry: geeft op een speelse manier tips over de verzorging van de stekjes en zaadjes.
Om de website publicatiegereed te maken hebben wij een projectplan opgesteld, opgedeeld in must haves, should haves & could haves. Voorbeelden van verbeteringen die we hebben doorgevoerd:
- Responsiveness verbeteren, optimaliseren en bugs oplossen
- Contrastchecks doen, en deze verbeteren waar nodig
- Verbeteringen en optimalisatie op componentbasis, zoals goede user feedback, pleasurable user experience, etc.
Dit project is opgezet met Sveltekit gecombineerd met het headless CMS Hygraph. In dit project hebben wij gewerkt met componenten in een Atomic mappenstructuur.
- Clone dit project via github desktop of met
git clone https://github.com/fdnd-agency/buurtcampus-oost.gitin de terminal - Open dit project in je editor
- Run
npm installin de terminal - Run
npm run devin de terminal - Open de link op de localhost.
Om de build versie van de website te bekijken run je npm run build in plaats van npm run dev, en vervolgens npm run preview.