Scriptie ingediend tot het behalen van de graad van PROFESSIONELE BACHELOR IN DE ELEKTRONICA-ICT InterSmart: A Twitter based quiz application for PowerPoint audiences David De Beuckelaer bachelor elektronica-ict academiejaar 2012-2013 Promotor: [Jerry Bracke, Artesis Plantijn Hogeschool Antwerpen]
Dankwoord Voorbeeld van een dankwoord hier zetten. Antwerpen, juni 2012 David De Beuckelaer i
Abstract InterSmart is een applicatie die gebruikt zal worden bij het geven van een quiz tijdens een PowerPoint presentatie. De bedoeling is dat de deelnemers van deze quiz op de vragen zullen antwoorden door gebruik te maken van Twitter. De InterSmart applicatie zal deze antwoorden evalueren en de resultaten via PowerPoint gaan visualiseren. ii
Inhoudsopgave Dankwoord Abstract i ii 1 Inleiding 1 1.1 Introductie.................................... 1 1.2 Gebruikte Software................................ 2 2 InterSmart 3 2.1 Inleiding..................................... 3 2.2 Functionele vereisten............................... 3 2.2.1 Overzicht................................. 3 2.2.2 Detail.................................. 3 2.3 Niet Functionele vereisten............................ 5 2.4 Use Cases.................................... 5 2.4.1 Presentator Start Quiz.......................... 5 2.4.2 Deelnemer Tweet antwoord....................... 5 2.4.3 InterSmart verwerkt Tweet Antwoord.................. 5 2.4.4 InterSmart toont score.......................... 6 2.4.5 Wijzig Antwoorden bestaande context.................. 6 2.5 DataBase..................................... 6 2.6 User Iterface Presentator & Deelnemers..................... 7 2.7 Systeemoverzicht................................. 8 2.8 Actoren...................................... 9 2.9 Communicatie met Twitter........................... 10 2.9.1 Hoe gaat de filtering juist in zijn werk.................. 10 2.9.2 Aanroepen van de service........................ 10 2.9.3 Twitter API detail............................ 12 2.9.4 Oomfo grafieken in PowerPoint..................... 12 3 Resultaten 14 3.1 Onderzoek Verwekingstijd............................ 14 3.1.1 Verloop onderzoek............................ 14 iii
INHOUDSOPGAVE iv 3.1.2 Verwekingstijd.............................. 15 3.1.3 Resultaten................................ 16 3.1.4 Besluit.................................. 16 4 Besluit 17 A Appendix 1 18
Lijst van figuren 2.1 Resultaat van een quiz vraag.......................... 4 2.2 Resultaat van een quiz vraag.......................... 6 2.3 Drag & Drop................................... 7 2.4 UI presentator.................................. 7 2.5 SysteemOverzicht................................ 8 2.6 Actor Presentator................................ 9 2.7 Actor deelnemer................................. 9 2.8 Actor InterSmart................................. 10 2.9 Ontvangen Tweets voorbeeld code........................ 11 2.10 Voorbeeld XML file............................... 12 2.11 Uitzicht grafiek via bovenstaande XML file................... 13 3.1 Voorbeeld onderzoek applicatie......................... 15 3.2 Tijden bij het ontvangen van een tweet..................... 15 v
Hoofdstuk 1 Inleiding 1.1 Introductie Er worden tegenwoordig zeer veel presentaties gegeven in bedrijven en scholen. Door gebruik te maken van een power point presentatie wordt het geven van presentaties een stuk eenvoudiger, echter zijn er nog enkele aandachtspunten die sterk verbeterd kunnen worden. Enkele punten die tijdens het geven van een presentatie zeer belangrijk zijn is bijvoorbeeld de aandacht van je publiek behouden. En er voor zorgen dat iedereen wel door heeft over wat je aan het praten bent. Om op deze problemen in te spelen is InterSmart ontwikkeld, deze applicatie zal gebruikt worden door de presentator met het doel om na een presentatie een quiz te houden, deze zal bestaan uit een aantal multiple choice vragen. Deze vragen zullen betrekking hebben op de inhoud van de gegeven presentatie. De personen die aan deze presentatie hebben deelgenomen, zullen de quiz vragen beantwoorden door gebruik te maken van Twitter. De presentator zal vervolgens al de antwoorden via InterSmart ontvangen en zo de resultaten van iedere deelnemer kunnen bekijken. Hierdoor ontstaat er een goede interactie tussen de presentator en zijn deelnemers. En beschikt de presentator over een goede feedback van iedere deelnemer. Vervolgens zal de presentator ook de mogelijkheid hebben om de resultaten via Graph Charts op zijn PowerPoint presentatie te visualiseren. 1
HOOFDSTUK 1. INLEIDING 2 1.2 Gebruikte Software Microsoft Visual Studio 2012: Voor ontwikkeling van de applicatie werd gekozen voor C#. Dit omdat C# zeer goed samenwerkt met de Twitter API en dit een taal is waar ik al enige ervaring in heb. Microsoft PowerPoint 2010: Via PowerPoint kan er zeer snel en eenvoudig een presentatie worden opgesteld, deze software zal dan ook gebruikt worden voor de visualisatie van de quiz vragen/resultaten. Oomfo FusionCharts: Dit is een handig tool die geïnstalleerd kan worden voor PowerPoint om live grafieken weer te geven. Deze tool zal gebruikt worden om de quiz resultaten automatisch up-to-date te houden. SQLite: Voor het gebruik van een database is gekozen voor SQLite. Dit is een zeer eenvoudige software-bibliotheek waar geen aparte server. Deze SQL database zal gebruikt worden voor het opslaan van Tweets en Quiz resultaten.
Hoofdstuk 2 Bespreking [InterSmart] 2.1 Inleiding In dit hoofdstuk worden alle relevante onderdelen van het project beschreven. Eerst worden al de Functionele vereisten van de applicatie uitgediept, gevolgd door de Use Cases die de volledige werking van de applicatie zullen verklaren. Vervolgens wordt de database en het systeem overzicht nog aangekaart. 2.2 Functionele vereisten 2.2.1 Overzicht 1. Quiz vraag 2. Visualisatie antwoord statistieken 3. Registratie antwoord statistieken 2.2.2 Detail 1. Quiz vraag: De presentator kan een quiz starten tijdens een presentatie Elke quiz bestaat uit één of meerdere quizvragen Deelnemers kunnen quiz vragen beantwoorden m.b.v. Twitter Als een vraag correct wordt beantwoord verdiend de deelnemer een punt 3
HOOFDSTUK 2. INTERSMART 4 Een fout antwoord vertaalt zich in geen punten De punten worden bijgehouden per quiz, maar ook voor alle quizzen Voorbeeld van een Quiz vraag: De afkorting "GUI"staat voor?: A Graphics Unused Input B Graphing Ultimate C Graphical User Interface D Graph Unique Cycle 2. Visualisatie van Antwoord Statistieken: Na elke quiz vraag volgt een statistieken slide die een overzicht toont van de antwoord statistieken van de deelnemers. Ook kunnen de totale scores van alle deelnemers aan het einde van een quiz worden getoont. Figuur 2.1: Resultaat van een quiz vraag 3. Registratie antwoordstatistieken: Alle antwoorden zullen worden opgeslagen in de database, zo kan een totale score per presentatie worden bijgehouden van elke deelnemer. Deze resultaten kunnen vervolgens worden opgeslagen in een bestandstype naar keuze.
HOOFDSTUK 2. INTERSMART 5 2.3 Niet Functionele vereisten 1. Gebruiksvriendelijk voor zowel presentator als deelnemer. 2.4 Use Cases 2.4.1 Presentator Start Quiz 1. Presentator sleept presentatie bestand naar de InterSmart console applicatie 2. InterSmart creã«ert presentatie context 3. InterSmart vraagt antwoorden: Geef de antwoorden op van de quiz 4. Presentator voert quiz antwoorden in: abbadcabda en drukt ENTER 5. InterSmart start de quiz en toont: Quiz gestart... Alternatieve paden 2. Presentatie context bestaat al A. InterSmart toont menu: 1. Toon scores 2. Wijzig antwoorden 3. Start Quiz 4. Close 2.4.2 Deelnemer Tweet antwoord 1. Deelnemer antwoord via Twitter 1A @Inter_Smart 2. InterSmart ontvangt de tweet en verwerkt het antwoord 2.4.3 InterSmart verwerkt Tweet Antwoord 1. InterSmart ontvangt een quizvraag antwoord via Twitter 2. InterSmart kijkt na of de deelnemer bestaat 3. InterSmart evalueert het antwoord van de deelnemer
HOOFDSTUK 2. INTERSMART 6 4. InterSmart registreert score van de deelnemer in de database Alternatieve paden 2. Deelnemer bestaat niet A. InterSmart toont menu: 1. Een nieuwe deelnemer wordt gecreëerd 2.4.4 InterSmart toont score 1. Presentator voert in 1: Toon Score 2. Systeem maakt XML file aan met scores 2.4.5 Wijzig Antwoorden bestaande context 1. Presentator voert in 2: Wijzig antwoorden 2. Presentator voert quiz antwoorden in: abbadcabda en drukt ENTER 3. InterSmart start de quiz en toont: Quiz gestart... 2.5 DataBase Voor het opslaan van tweets en het registreren van presentatie contexten en gebruikers zal er gebruik gemaakt worden van een SQLite database. In onderstaande afbeelding ziet u het ER-Diagram die de database structuur weergeeft. Figuur 2.2: Resultaat van een quiz vraag
HOOFDSTUK 2. INTERSMART 7 2.6 User Iterface Presentator & Deelnemers User Interface Presentator: InterSmart wordt geopend door middel van je PowerPoint file via Drag&Drop op een InterSmart snelkoppeling te slepen. Er zal vervolgens een console Window verschijnen waar je gewoon de eenvoudige stappen moet volgen. Figuur 2.3: Drag & Drop Figuur 2.4: User Interface Presentator User Interface Deelnemer: werken via Twitter. De deelnemers bezitten geen applicatie, zij zullen volledig
HOOFDSTUK 2. INTERSMART 8 2.7 Systeemoverzicht Op onderstaande afbeelding staat het systeemoverzicht afgebeeld, dit zal een duidelijk beeld vormen van de juiste werking van InterSmart. 1. De presentator laat een vraag zien op zijn presentatie die de deelnemers moeten beantwoorden 2. De deelnemers voeren hun antwoord in via twitter (1A @Inter_Smart) 3. InterSmart zal deze antwoorden ontvangen en zo scores/statistieken berekenen. 4. De presentator kan deze resultaten vervolgens visualiseren op zijn powerpoint presentatie Figuur 2.5: Systeemoverzicht InterSmart
HOOFDSTUK 2. INTERSMART 9 2.8 Actoren Presentator Deelnemer InterSmart applicatie Figuur 2.6: Presentator Figuur 2.7: Deelnemer
HOOFDSTUK 2. INTERSMART 10 2.9 Communicatie met Twitter Figuur 2.8: InterSmart De InterSmart applicatie maakt gebruik van de Twitter API voor al de tweets die naar InterSmart worden getweet te ontvangen. 2.9.1 Hoe gaat de filtering juist in zijn werk Er zal een service call moeten gemaakt worden naar Twitter om zo de tweets te ontvangen. Dit zal worden gedaan door de twitter search API aan te roepen door gebruikt te maken van volgende URL http://search.twitter.com/search.atom?q= Het woord dat achter de URL zal worden bijgevoegd zal worden gebruikt als zoekterm bv. http://search.twitter.com/search.atom?q=inter_smart zal al de tweets die Inter_Smart bevatten gaan weergegeven. Deze tweets worden weergegeven in een atompub XML formaat. Er kan ook gebruik gemaakt worden van JSON. Meer details rond het aanroepen van deze Twitter api via deze URL is later in het verslag te vinden in het hoofdstuk Twitter api detail. 2.9.2 Aanroepen van de service Via onderstaande code zal globaal worden verklaard hoe de twitter API zal gebruikt worden en hoe de tweets juist zullen worden opgeslagen is een collection. De methode show() zal de tweets gaan filteren. De code is vrij duidelijk, toch zal er even worden overlopen wat er juist gebeurd. 1. DownloadStringAsync zal de via de URI de twitter api aanspreken, en de DownloadString- Completed zal kijken of dit een succes was.
HOOFDSTUK 2. INTERSMART 11 2. In de code is te zien dat er een Namespace wordt toegevoegd. Dit wordt gedaan omdat er gebruik gemaakt wordt van een Atom XML formaat. Als we geen gebruik maken van deze namespace zullen we ook geen tweets te zien krijgen. 3. Via deze linq queries zullen we de inhoud, auteur en de afbeelding uit de tweets halen. 4. Vervolgens zullen al de tweets worden toegevoegd aan de collection _tweets. Figuur 2.9: Ontvangen Tweets voorbeeld code
HOOFDSTUK 2. INTERSMART 12 2.9.3 Twitter API detail De twitter api wordt gebruikt voor het zoeken naar recente tweets. Enkel zijn er een aantal beperkingen waar je zeker van op de hoogte moet zijn. 1. De api is geen complete index van al de tweets, maar enkel van de recente tweets van 6-9 dagen geleden. Hierdoor zal je geen tweets kunnen vinden die ouder zijn dan à à n week. 2. Er zullen maar 100 tweets weergegeven worden, dit omdat er op 1 twitter pagina 100 tweets te zien zijn. De api die gebruikt wordt in de applicatie is hier onder te zien. http://search.twitter.com/search.atom?q=+ zoekstring + &:&rpp=100 De zoekstring is een variabele die de waarde zal aannemen van het onderwerp tweets die we willen zoeken. Vervolgens stellen de rpp in op 100 dit zal dus de 100 recentste tweets van dit onderwerp gaan weergeven. 2.9.4 Oomfo grafieken in PowerPoint Na dat de resultaten van een bepaalde vraag of quiz zijn berekent is er de mogelijkheid om deze te gaan visualiseren in PowerPoint. Hiervoor wordt een zeer eenvoudig tooltje gebruikt dat via onderstaande URL te vinden is. http://oomfo.com/ Deze tool laat ons toe allerlei soorten charts toe te voegen in PowerPoint. Aan deze charts kunnen we informatie meegeven hoe deze er uit moeten zien door middel van een XML file. Hier komt InterSmart bij te pas. Het is mogelijk om via InterSmart een XML file te creëren waar de resultaten in zijn verwerkt. Deze XML file kan in importen in een grafiek en zullen de resultaten zichtbaar zijn op PowerPoint. Figuur 2.10: Voorbeeld XML file
HOOFDSTUK 2. INTERSMART 13 Figuur 2.11: Uitzicht grafiek via bovenstaande XML file
Hoofdstuk 3 Resultaten 3.1 Onderzoek Verwekingstijd In dit onderzoek is de snelheid onderzocht van hoe lang het duurd voordat een nieuwe tweet wordt opgevangen door de InterSmart applicatie. Deze tijd wordt de verwekingstijd genoemd. Eerst zal worden uitgelegd hoe het onderzoek in zijn werking is gegaan, en hoe deze tijd wordt berekend. Vervolgens zullen de resultaten van dit onderzoek worden weergeven. 3.1.1 Verloop onderzoek Het onderzoek is zeer eenvoudig verlopen, deze vindt plaats in een lokaal met +- 70 deelnemers. Er werd een basisapplicatie geprojecteerd die een cirkel zal weergeven. Deze cirkel zal na de druk op de start knop op een random tijd naar een random kleur veranderen. Het is de bedoeling dat de deelnemers de eerste twee letters van deze kleur zo snel mogelijk tweeten naar #bapap. Telkens de kleur veranderd zal de tijd waarop dit gebeurd worden opgeslagen. Deze tijd zal worden gebruikt als referentie tijd waarop de verwekingstijd zal worden berekenen. 14
HOOFDSTUK 3. RESULTATEN 15 3.1.2 Verwekingstijd Figuur 3.1: Voorbeeld onderzoek applicatie De verwekkingstijd is de tijd die nodig is om een tweet van twitter zichtbaar te maken op de InterSmart applicatie zelf. (m.a.w. hoelang het duurt voor een deelnemer zijn tweet zichtbaar wordt op het scherm) Deze tijd is zeer belangrijk omdat hierdoor de snelheid van de applicatie bekent wordt. Deze zal worden gevonden door een tijdelijke feature in de InterSmart applicatie. De tweets worden gefiltert op het gekozen onderwerp bv. Onderzoektest, en de auto refresh wordt aangezet. Hierdoor zal er telkens als er een nieuwe tweet ontstaat deze automatisch wordt weergegeven in een listbox. De tijd waarbij de tweet in de listbox wordt toegevoegd wordt opgeslagen. Als deze wordt vergeleken me de referentie tijd is de snelheid van de applicatie gekend. Bv. Cirkel veranderd naar oranje : Tijd 11:59:30 Tijd van de ontvangen tweet in de applicatie : 12:00:09 Is het duidelijk met een eenvoudige berekening dat de Transmissietijd in dit geval 39 seconden is. Figuur 3.2: Tijden bij het ontvangen van een tweet
HOOFDSTUK 3. RESULTATEN 16 3.1.3 Resultaten Via eerder vermelde methode is er tewerk gegaan in een lokaal met +-60 deelnemers. Hier zijn 3 testen op uitgevoerd waarop volgende resultaten van zijn ontstaan. Test 1: 10 actieve deelnemers Test 2: 14 actieve deelnemers Test 3: 12 actieve deelnemers Verwekkingstijd: Snelste tijd: 20seconden Traagste tijd: 28seconden Gemiddelde tijd: 23,13 seconden Conclusie: Het duurt dus een tijdje voor de tweets zichtbaar zijn op de InterSmart applicatie. Maar deze tijd is niet groot genoeg om een probleem te veroorzaken. 3.1.4 Besluit Dit onderzoek is over het algemeen zeer geslaagd. De resultaten waren te verwachten en vormen geen problemen. Er moet dus niet naar een manier worden gezocht om tweets sneller te kunnen ontvangen.
Hoofdstuk 4 Besluit TODO Nog aan te vullen tegen de eind scriptie Besluiten Zijn de resultaten zoals verwacht hoe zal uw project gebruikt worden Zijn er zaken die niet volledig naar wens zijn? Hoe kunnen deze verbeterd worden? 17
Bijlage A Appendix 1 TODO Nog aan te vullen tegen de eind scriptie Hier komt de info i.v.m appendix Mogelijke onderwerpen die in aanmerking komen om opgenomen te worden in de appendix: Handleiding Opvolgprojecten (?) Bespreek met uw promotor of een bepaald onderwerp mag opgenomen worden als appendix. 18