In de Design Rationale schrijf je de debriefing, de probleem-definitie, toon je de oplossing en schrijf je een uitleg van de code. De Design Rationale is een verantwoording van je ontwerp. Als je in een team werkt kun je de Design Rationale als team schrijven. (TIP: Doe dit dan in de project repo)

Naam: Leonore Snoek Email: [email protected]

Naam: Fatma Genc Email: [email protected]

Opgroeien in een digitale wereld betekent van jongs af aan digitale competenties en vaardigheden ontwikkelen. Binnen het ontwerplab zet oba.start zich specifiek in voor de jongste bieb bezoekers. De volgende generatie internet gebruikers. Hoe kunnen we een omgeving ontwerpen die zorgt dat zij toegang en competenties hebben om de kansen en mogelijkheden van de digitale stad te ervaren en gebruiken.

Digitale transacties zowel formeel (bank, overheid) als informeel (afspraken maken) is meer en meer de norm. Veel van deze transacties verlopen via conversational- of decision tree modellen.

Zelfs het nieuws wordt op een conversational manier overgebracht via stories van NOS en nu.nl (vs. ‘ouderwets’ bronnen opzoeken via google)

Wat als we kinderen en jongeren al vanaf de eerste digitale kennismaking zoeken en vragen spelenderwijs aanleren?!

Overzicht van de beginselen, Hier worden de 10 principes van designen voor kinderen beschreven

Ontwerp en ontwikkel een chatbot voor OBA Junior, die jeugdige gebruikers (rond 6 jaar), helpt informatie uit de OBA collectie te onstluiten.

Als jeugdige gebruiker van 6 wil ik, samen met mijn moeder en/of vader, aan de hand van het stellen van vragen aan de chatbot, kinderboeken uit de collectie van de OBA vinden, zodat we die samen kunnen gaan lenen.

Het ontwerplab is een samenwerking tussen de oba, de gemeente amsterdam en ontwerp collectief Idiotes. Samen werken hier ontwerpers, onderzoekers en ontwikkelaars aan producten en diensten die zorgen dat alle Amsterdammers deel kunnen nemen aan de digitale samenleving, verbonden kunnen zijn met hun eigen buurt, stad en het internet en de mogelijkheden hebben om hun kennis en digitale vaardigheden te vergroten.

• kinderen en jongeren al vanaf de eerste digitale kennismaking zoeken en vragen spelenderwijs aanleren.
• Er wordt gewerkt met OBI4wan chat engine. Hierbij krijgen wij, de developers, een crash course in hoe wij hiermee te werk kunnen gaan.
• De OBA collectie via een API worden opgehaald en dit tonen aan de kinderen.
• Het moet kindvriendelijk zijn (Overzicht van de beginselen voor kinderen)

Kinderen tussen de leefdtijd van 4 tot 8 jaar die samen met hun ouders een boek willen gaan bestellen.

Opgroeien in een digitale wereld betekent van jongs af aan digitale competenties en vaardigheden ontwikkelen. Digitale transacties zowel formeel (bank, overheid) als informeel (afspraken maken) is meer en meer de norm. Wat als we kinderen en jongeren al vanaf de eerste digitale kennismaking zoeken en vragen spelenderwijs aanleren?!

De ObA wilt graag een chatbot voor kinderen vanaf 6 jaar. Via deze chatbot kan deze doelgroep bij een een digitaal media product uitkomen. De chatbot moet zo gemaakt worden dat kinderen met plezier naar de ObA-Junior website gaan om weer met de chatbot te gaan praten.

Onze eerste idee was om te kijken welke oplossingen zijn er al voor dit probleem. Bestaan er al kinder chat bots waar kinderen mee kunnen praten? Die bestonden wel alleen waren deze niet echt leuk en speels. Het had allemaal een standaard chatbox layout en als icoon een grappig figuur. De chatbots waren dus gelimiteerd aan een bepaald systeem? In de 2e week van ons project hebben wij van Obi4Wan een chatbot training gehad over hoe hun chatbot systeem werkt. Dit was een klap in het gezicht voor ons want dit bleek erg makkelijk en veel knip, plak en sleep werk. Dit leek ons te simpel om te gaan maken. Dit probleem hebben wij voorgelegd bij alle coaches van de minor en zijn tot de conclusie gekomen om zelf vanaf scratch iets te bouwen.

Jaapie de aap is onze oplossing voor een leuke interactie tussen de doelgroep en de Oba-Junior website. Er zijn 5 belangrijke UX principes om mee te nemen in ontwerpen voor kinderen.

• Design voor je target leeftijds-groep
• Denk goed na over je kleurenpallete en lettertype
• Geef een vriendelijke digitale helper
• Biedt constante feedback en beloningen aan
• Maak het zo instinctief mogelijk

Door deze 5 principes in ons design mee te nemen hebben wij Jaapie de aap gemaakt. Uit ons vooronderzoek kwam naar voren dat de aap een van de meest favoriete dieren van kinderen is. Hieruit is Jaapie de aap ontstaan. Kinderen Kunnen door middel van een nagebootste chatbot met Jaapie een boek vinden.

Jaapie praat tegen je en vraagt naar welke onderwerpen je op zoek bent. Na een paar vragen wordt er een resultaten scherm getoond waarbij de kinderen door hun gefilterde lijst kunnen gaan. De kinderen worden op deze manier op een speelse wijze door een filter proces heen geholpen.

In ons project hebben we gebruik gemaakt van zowel server-side als client-side JavaScript. We hebben in eerste instantie geprobeerd om de belangrijke dingen server-side te renderen en de extra functionaliteiten client-side te renderen. Maar gezien de chatbot een overlay page is moeten bepaalde core-functionaliteiten met client-side JavaScript.

Hieronder is een overzicht te zien van alle client-side JavaScript bestanden.

Voor het overzicht geldt dat de pijltjes import en exports van functies moeten voorstellen. Het pijltje komt van een blok waar de functie uit wordt geëxporteerd en de functie die te zien is wordt geëxporteerd. Het blokje waar het pijltje aankomt is het blokje waar de functie wordt geïmporteerd.

Verders is de code ook nog voorzien van comments. Hierdoor zou de code al duidelijk genoeg moeten zijn.

Het renderen van de pagina's is gedaan met express en ejs als template engine. De chatbot is een ejs partial die tevoorschijn komt op moment dat de gebruiker klikt op de button. Om de API server-side op te halen heb ik Axios gebruikt. Client-side heb ik gewoon fetch gebruikt om de API data op te halen.