Drawing Annotation on Storyline Slide
Demo: https://360.articulate.com/review/content/518383b2-1161-408d-b9f5-adb9a6f57a11/review Inspired by code discussed on: https://img.ly/blog/how-to-draw-on-an-image-with-javascript/ Using Charts in your Storyline | Articulate - Community About This is a brief example of using an HTML canvas element to enable annotation on a Storyline slide. The example displays an image on a slide, sets a few variables, and the accessibility tags of a some slide objects. It then triggers a JavaScript trigger to create a canvas over the image, and then watches the mouse buttons and movement to allow drawing on the canvas. How it works A canvas element is created, filled with the specified base image, and inserted below a small rectangle (canvasAnchor) that is the same width as and placed directly above the image. Another rectangle (canvasClickArea) overlays and is sized to match the image. This is the area that allows drawing on the canvas (where the mouse is watched). Brush width and color can be controlled. The drawing can be cleared. It also resizes with the slide. To improve The events to watch the mouse and clear button should be better handled to allow removal when a new canvas is created. A mechanism to allow a blank base (clear) should be reinstated. Right now it just relies on the use of the initial image from the slide. Both options have their uses. Since the canvas is a raster image, resizing to very small and then very large results in poor image quality. The image can be extracted from the canvas. This could be saved or printed. More drawing options are available with the canvas element. Credit: X-ray images from https://learningradiology.com/Frequent discussion board issues
Hi there, I'd like to report a lot of frequent issues with the new discussion board. Here's what I frequently experience throughout the week since the new community has been launched: Selecting reply will frequently result in this: Sometimes when I reply, my post disappears, so I reply again, it disappears, so I reply again, it disappears etc. Sometime later all of my replies show up making it look like I'm spamming a post. Sometimes the reply and like buttons are disabled and cannot be selected. Sometimes when I go to my profile, no discussion load. Just an empty profile. Sometimes when I select a link to add video the From video URL link isn't there. The software just seems really buggy and seems a bit hit and miss whether I'm going to be able to post, reply or view issues. I'm on a very stable broadband connection (fibre to the office), and when I've had issues, have checked my connection and has been fine. Hopefully these get resolved quickly as I just give up sometimes. If this is happening to other people frequently, it's going to impact the community. Cheers, Sam
Articulate Status and Software
I'd like to open a conversation about disconnecting the use of Storyline from the need to constantly authenticate. I am currently in the middle of an important lesson that has a very specific amount of time budgeted for it, and have essentially been locked out of it. As a government contractor creating emergency training material for use in mission-critical space scenarios, I can't afford to keep defending the use of software that is controlled off-premises, and that can be shut down without warning. We have to fight to negotiate for the time and money to create critical training, and it is unhelpful to be signed out of or wholesale lose access randomly. This, the budding inclusion of AI tools, and the heightened need for cybersecurity awareness makes for a convincing argument to move to a different tool platform that does not need to call home to be used. Please consider giving us better options going forward, to ensure that this work stoppage does not hinder future project timelines.Introducing myself! đź‘‹
Hey E-Learning Heroes! Some of you may have seen me lurking around this community over the last month or so, but I wanted to formally introduce myself. My name is Noele Flowers, and I just joined Articulate's team in mid-December as our new Director of Community. That means it's mine and my team's job to work on all things E-Learning Heroes. It also means that I have the most fun job at Articulate because part of my job is to hang out with you here 🤯 A bit about me: Professionally: I've worked in the community industry for about ten years, always at the intersection of community and e-learning. I used to run community at a company called Teachable, then I ran a team that built training for community managers at a company called Commsor, and then I ran my own consultancy for a few years. Personally: I live in New York's mid-Hudson Valley (do I have any neighbors here?). I love gardening, watching movies, and enjoying the great outdoors (this time of year, find me on the ski slopes⛷️). Fun fact: Before I worked in tech, I was a public high school choir teacher 🎶. I find any community I'm a part of, no matter what it's about, I always end up connecting with other musicians. We're everywhere! I'm so excited to work with you to help make this community—which is already amazing—the best it can be. Here are a few ways we can connect: Drop me a comment here saying hi! I'm hoping to meet as many E-Learning Heroes as I can. Bonus points if you can pass along a good movie rec. Tag me freely when you're here interacting! I especially love getting tagged into cool examples of what you're building, or being pulled in to try to help facilitate a connection with another community member where I can. Chat with me in real time! As I'm getting up to speed here, I'm making an open call for community members who are interested and willing to have a 30 minute, informal "virtual coffee chat" with me so that I can get to know you and hear more about how you use ELH. If that appeals to you, you can learn more and let me know here. Thanks so much for reading—excited to get to know you all! Cheers, NoeleSearch Section titles
I've turned on the ability to search in my Rise course, but it won't search the Section titles. It will only search Lesson titles and content within the lessons. I also noticed when I publish a .pdf the Section titles aren't listed with their lessons either. So if my outline had: Day 1 (Section) Introduction (Lesson) Daily definitions (Lesson) Application (Lesson) Summary (Lesson) Day 2 (Section) Introduction (Lesson) Daily definitions (Lesson) Application (Lesson) Summary (Lesson) Then the .pdf prints out with all the content smashed together like this: -Introduction (Lesson) -Daily definitions (Lesson) -Application (Lesson) -Summary (Lesson) -Introduction (Lesson) -Daily definitions (Lesson) -Application (Lesson) -Summary (Lesson) This makes edits from our partners very difficult. These seem like related issues, so I was wondering if anyone has run into these disappearing Section issues? Does anyone know away to fix this, or should I need to submit a Rise bug/fix?Articulate, let's talk pricing...
With the recent release of AI-powered features, a new pricing model is now available for Articulate 360: Let’s take a look at what this actually includes: Storyline 360 with a few AI features: The industry-standard tool for e-learning designers. Some like to call it a "glorified PowerPoint," but it's undeniably powerful. Rise 360: A simplified, web-based version that’s easy to use. Stock Library: A collection of assets to enhance your projects. Screen Recorder: While functional, it's a bit outdated and lacks some advanced features. A few other smaller apps and a review tool to gather feedback. To give you some context, here’s how the pricing for Adobe Creative Cloud stacks up. This includes all the apps (except the 3D Substance suite) with AI functionality integrated into their key products like Photoshop, After Effects, Premiere, and more. Adobe’s offering is over $1,000 cheaper than Articulate’s new AI-feature pricing, per year! And that’s with access to a large suite of tools, many of them advanced and complex: Now, I understand software development isn’t cheap, and Articulate has a strong foothold in the e-learning market, which is fairly niche. But personally, the pricing feels very steep. What do you think? Let’s keep this conversation civil and focused on the topic please.Simplified Approach to Adding Transparent Videos to Storyline
Demo: https://360.articulate.com/review/content/6534ea7f-0df5-4a02-813b-70811843fbf0/review Updated: Added an option for overall video transparency. Allows for see-through videos. For example, if you wanted to project them against a surface, like a wall, or overlay them onto a graphic background. Disclaimer Some time ago, Matt Kurtin published some instructions on adding webM videos to storyline to support transparent videos. Other discussions have also addressed this issue, utilizing web objects to contain transparent videos inside Storyline. I typically used web object for my projects, but recently developed an approach very similar to Matt's to make handling transparent videos more flexible. See: https://www.innovativelg.com/resources/enabling-videos-with-transparent-backgrounds-in-articulate-storyline/ I had not actually read his article before making this. I do want to acknowledge his work though. My approach expands upon the concept somewhat. Transparency on the web Videos with transparent videos are popular online. They are great for overlaying action onto otherwise static backgrounds. Support for transparent video formats is limited by your browser, however. A widely supported, but quite old format is webM. This uses the V9 codec, and it supports an alpha channel, which provides the transparency option. It is supported by the primary Windows browsers (Chrome, Firefox, Edge, etc.). These browsers on a Mac also support webM. The Safari browser on a Mac does not support webM, however. It supports an HEVC format that can be packaged as an MP4. Incidentally, the codec is tied to Mac hardware, so you cannot generate transparent video in this format unless you have Mac hardware (unfortunately for Windows users). To fully support both platforms, you need to offer both formats. Storyline and Transparency Storyline currently does not directly support video transparency. Import options are limited and any inserted videos are converted to a uniform format during publication. Even if you are able to insert a video that includes an alpha channel, it will be lost when published. The Web Object Approach My traditional approach to inserting transparent videos into Storyline has been to load them into web objects and display them as if they were their own webpages. This way, I could use any format you wanted. I would place the video files and an index.html containing the webpage structure into the web object. Controlling these from Storyline could be difficult but was doable. The biggest problem with web objects, however, is that they don’t render during the design phase, and properly sizing what they contained could be a hassle, requiring a lot of trial and error. Overall, using web objects was fairly straightforward, but cumbersome. An Alternative Approach Here, I offer another approach to inserting transparent videos into Storyline. This method still uses web objects to convey the video files into the Storyline project but is more friendly on the design side. Technically, you could also modify this solution to accommodate using the URLs of web-hosted videos and eliminate the web objects all together. I’ll leave that to you to play with. For this method, we insert a video (any video clip will do, since we’re not really using it) into our slide in one of the usual manners. I use the default Storyline settings of Show Video in Slide, Play Automatically, and Show No Controls. We will then simply replace the video source specified by Storyline with one of our own, using our transparent video and some JavaScript. Since this is done in real-time, after the project is published, Storyline does not prevent us from utilizing our transparent video formats. As long as we have access to the video files, we can use them instead. I mentioned that any video can be inserted to start. You should use a video with the same dimensions as your desired video, so the proportions are correct. You could also just resize the video placeholder to the appropriate dimensions. You can use a version of your actual video if you want. I just create a very short clip from my video, maybe the first few frames, and insert that. That way it remains small. It’s just a placeholder after all. Benefits The benefit of this approach is that the video is now easy to reposition and resize on your slide, without having to hassle with modifying and possibly re-inserting your web object each time. Any changes to the video’ size and position will be reflected in the transparent video that is swapped in to replace it. You also still have control over the video player through Storyline, without having to take extra steps. Making it Work Add a Poster: On the design side, in Storyline we can specify the image displayed by the inserted video placeholder. You just right click the video and click on Set Poster Frame. Create an image (for example, a single frame of your video) that is saved as a transparent .png file. Make the image the same dimensions as your video. This way, the displayed video placeholder will accurately represent your video. Accessibility Tag: You will need to edit the Accessibility tag for the video in SL (right click on the video in the timeline). Make the tag the same as the actual filename of your transparent video, without the extension. For example, for “Petals.webm”, just use Petals as the tag (no quotes). If you include both a .webm and an .mp4 version of your video file, make sure the base filename is the same. Create Transparent Videos: You need to have transparent videos ready. You can make your own or convert some green screen videos that can be downloaded from the web or through the Storyline media library. You will need a way to key out the green screen and then convert the video formats to webM (from Chrome, etc.) or HEVC MP4 (for Safari). If you have Adobe products, then After Effects and Premiere would work. You can also use the free version of Davinci Resolve to remove green screen in videos. Search for “3D Keyer Davinci Resolve” on YouTube for help. Save in ProRes format with the include alpha channel option checked. Output will be a .MOV file. These are very large, which is why it’s best to convert them into HEVC MP4s with a smaller size for web use, if you are supporting Safari. If you have access to a Mac, you might be able to use something like Rotato Converter to create both WEBM and HEVC MP4 formats. For shorter clips, you could use a free online converter (for example, https://www.aconvert.com/video/mov-to-webm/). This will convert the transparent MOV file into a webM file. You can also adjust the bitrate. Adobe Premiere can export webM with alpha using a plugin (https://www.fnord.com/). This is what I use to create webM files, make short placeholder clips, and extract a single frame to use as the poster image. Create the Web Object: The transparent video files should have the same base name, one that matches the accessibility tag you assign to the Storyline video. These go into the web object folder, along with an empty index.html file. This folder gets inserted into your Storyline project (say in a separate scene). See this discussion for more details on getting and setting the woFolder name inside Storyline. Notes on accessing files inside a web object: See the last section of this article Set the vidParameters Variable: This passes the details to the JavaScript that swaps the video on your slide. It specifies the identifying tag and other features such as autoplay, muting, and time indexes. It uses a string of text with commas separating each field. The script and this variable set up the initial swap of video when your slide loads and can also control your video further while your slide is visible, if you desire. See slide #1 in the demo to see how this works. The tag name is required, all the other fields are optional. Trigger the Script: Trigger the JavaScript to create the initial swap. For control later, place a “C” in the second field, and model the variable string as shown on Slide #1. Slide #2 shows a very simple example, with the minimum elements needed to make the video swap work. The buttons shown on the slide are optional. It should work on Chrome, Firefox, etc. browsers (I did not include the transparent Safari file). You can find the clip in Storyline by searching for “petals green” under insert video. Slide #1 should work on Safari as well, although I did not have a Mac handy to check. The clip was from another project. I’ve attached a sample .story file and the web object folder used in the demo. The script is commented. Feel free to modify it as you see fit. Still can't attach the zip file. https://paedagogus.org/VidSwapRsc/woFolder+Project.zipPPTX to STORY import
So, a lot of ppl have problem with the feature: import from PowerPoint to Story. WHICH PROBLEM? TAKING HOURS FOR 2 PAGES TO GET IMPORTED! I have some kind of solution. CHANGE THE FONTS TO OPEN SANS ( Default articulate font) in pptx and you will see the bar that never moves, move again!!! We tried it, we saw PowerPoint with 60+ pages and images in every page (which originally took something like 2hours or more) to get imported in about 30mins.!! In a fast computer the same pptx to 12 minutes!!!!!!!!!!!!!! Possible "problem" may be some kind of safety proof that storyline has by default. The process tries to match every character in every slide from PowerPoint and find or change the font separately, so apparently if you have the same fonts, it doesn't affect it as much. You would need to use fonts that are existing inside the articulate storyline (like open sans). In my case i used open sans cause it the default one in storyline when it opens. If storyline doesn't have the fonts used in the PowerPoint file, the program tries to change the font and match every single character, taking forever to load... Please do some tries and prove me im not crazy.Moving group in timeline makes group longer
When I move a group of items in the timeline, rather than the group moving, it gets longer...literally shoots off to the right. To be clear, by "group" I mean 2 or more items which have been grouped under the Arrange dropdown, not simply 2 or more items which have merely been selected. Any thoughts why this happens? Thank you!
