nl.hideout-lastation.com
Synchroniseer op het web gebaseerde presentatiedia's met Impress.js en Impressr [Quicktip]
Ik heb gesproken over Web Development en WordPress op een paar universiteiten en scholen en een veel voorkomend probleem dat ik tegenkom tijdens een presentatie is dat het publiek bij de achterkant van de menigte mijn dia's nauwelijks kan zien. Hierover heb ik nagedacht: hoe kan ik de presentatiedia's duidelijker maken, maar de spreker en de aanwezigen op dezelfde pagina houden?
Ik heb een oplossing gevonden waarmee het publiek de presentatie op hun eigen apparaat kan bekijken en een manier om de inhoud van de dia's op hun apparaten te synchroniseren, met wat ik wil doormaken terwijl ik op het podium sta. Hier is hoe dit te doen.
De dia's maken
Om dit te doen, moeten we echter in plaats van Keynote of PowerPoint de dia met Impress.js maken.
Met Impress.js kunt u webgebaseerde presentatiedia's maken en deze worden voorzien van animatie-effecten die indrukwekkender zijn dan wat u op Keynote of PowerPoint kunt vinden. Als je een persoon bent met CSS3, kun je zelfs je eigen aangepaste animatie maken (probeer de demo hier).
"Maar, wat als ik CSS, JavaScript en HTML niet begrijp?"
Vervolgens kunt u Strut, een webgebaseerde toepassing gebruiken om uw Impress.js-dia's met GUI te maken . De app is op dit moment nog steeds in bèta, maar hij functioneert goed. U kunt tekst, afbeelding of video invoegen door slepen-en-neerzetten, vergelijkbaar met Keynote of PowerPoint. U kunt ook de achtergrond, kleuren, lettertypefamilie en de grootte ervan wijzigen.
Als u klaar bent met het maken van uw presentatiedia's, kunt u op de grote groene knop aan de rechterkant klikken die Impress bevat . Druk vervolgens op Command + S (Ctrl + S in Windows) om de dia's op te slaan.
Synchroniseren van dia's
Nu zullen we de dia's synchroniseren. Het idee om Impress.js te gebruiken om de dia's te maken, is om de dia's toegankelijk te maken op laptops of mobiele apparaten. Het publiek kan ook een close-up bekijken en zelfs interactie hebben met de dia's. Terwijl u door uw dia's loopt, worden de wijzigingen die u in de dia's aanbrengt (zoals naar de volgende dia gaan) in realtime op hun apparaten weergegeven.
Hiervoor hebt u een JavaScript-bibliotheek nodig met de naam Impressr.js. Deze bibliotheek is twee jaar geleden gepubliceerd. Toch werkt het nog steeds prima en is het heel gemakkelijk te gebruiken. Download de bibliotheek en voeg het volgende toe binnen de head tag.
Voeg vervolgens het volgende toe om Impressr te initialiseren.
$ ("# slide-container"). impressR ({proxyName: 'presentation'}); Zorg ervoor dat u het juiste element selecteert dat de dia's onmiddellijk omhult. De proxyName optie kan op alles worden ingesteld zolang het een string is (platte tekst).
Nu moet de dia in realtime in elk apparaat worden gesynchroniseerd terwijl uw presentatie is geopend. Merk op dat alle apparaten moeten worden verbonden met hetzelfde netwerk . Om het te testen, kunt u de dia in twee verschillende browsers openen. Hier heb ik bijvoorbeeld de dia in Chrome en Firefox geopend.
Je kunt het ook op mobiele apparaten proberen.
4 AdBlock Plus-alternatieven voor Chrome
Advertentieblokkers zijn zeer eenvoudige hulpmiddelen. Installeer het in uw browser en een grote meerderheid van de advertenties hindert u op geen enkele manier, vorm of vorm meer. Hoe nuttig ze ook zijn, er zijn mensen die vinden dat ad blockers een beetje saai zijn .Als u een van degenen bent die de voorkeur geven aan een nogal interessante adblocker en als uw hoofdbrowser Google Chrome is, dan zijn hier vier adblockers met een unieke twist
Leer Sass, HTML & CSS gratis op MarkSheet
Webontwikkeling kan intimiderend zijn voor een complete beginner. Er zijn tal van gratis artikelen en video's om je te helpen leren, maar ze variëren allemaal in kwaliteit en detailniveau.Dat is de reden waarom MarkSheet zo'n waardevolle bron is. Deze opmerkelijke website leert vanuit het niets HTML, CSS en eenvoudige Sass, te beginnen met de basis van internet en het world wide web.
