graphics
69 TopicsDON’T CLICK APPROVE YET.
Before spending credits on an AI video render, lock the story, references, camera direction, timing, and scene details. I used Higgsfield Supercomputer to plan and refine this 15-second HUD promo and documented the complete workflow. Read the step-by-step blog: https://www.craftuxd.com/post/higgsfield-supercomputer-tutorial-ai-product-promo Watch the YouTube tutorial: https://youtu.be/YsXCoUH5vIQ #HiggsfieldAI #AIVideo #VideoDesign #GenerativeAI19Views0likes0CommentsID Toolbox
Practical tools for e-learning developers… Over the past several months I've built a set of browser tools for the bits of Storyline and Rise that used to cost me hours. Eleven of them, all completely free, no signup, no accounts, nothing to install. They run entirely in your browser. Nothing is uploaded anywhere, which for me was the whole point, I wasn't keen on posting client content to a website just to check something… ID Toolbox109Views7likes3CommentsEasier way to do Transparent PNG animations in Storyline using AI Assistant.
Hello! For anyone who has been wanting to find an easier way to use animated PNG image sequences in Storyline, here's what I recently came up with (I did a search for this topic here on Best Practices but found nothing to match - may already be old news - if so, disregard all after hello). This JS takes care of the show/hide layer task that was so time consuming for the creator using triggers and states. Here is the AI Assistant prompt followed by the resultant JavaScript: Me: 'Create a JS that shows and hides the images [Picture 1 - 30] on the timeline. The speed should be [30] frames per second, resulting in one complete simulated rotation of the coin. Response: To create a simulated rotation effect at 30 frames per second, where Pictures 1 through 30 are displayed sequentially and loop to simulate a spinning coin, I will develop a JavaScript animation using the appropriate timings to approximate 30 frames per second (33.33ms per frame). Would you like me to proceed with creating the JavaScript trigger for your slide? Me: Yes. Response: I have created the JavaScript trigger named "Simulate Coin Rotation." This trigger will: 1. Sequentially show and hide images from "Picture 1" to "Picture 30." 2. Simulate a rotation effect at 30 frames per second (33.33ms per frame). Let me know if there are additional adjustments or further enhancements you need! See attached for results. Obviously this is for proof of concept and will require further refinement - speed/pausing, etc., but refinement is as easy as prompting 'pause the animation after 3 rotations', etc.) Setting up this two-minute long process beats spending several minutes/hours creating triggers and setting up states by hand, so thought I should share it. Hope it helps. -alan PS, here's the JavaScript: // Find and reference each image by Object IDs const images = [ '5qmgHzeewKx', '6VntD4WftmZ', '68qpF1r6HPu', '6iKY1TZhCUC', '5dvzDd0iirL', '5shjC2rUjgc', '6RY4BuHuzbB', '5sCE78GZyz9', '69eZTSWRsRF', '6kb0gHMMoks', '5kIbYD5RUff', '5ky6F9fxZaH', '62UnQqLgzkj', '6gbjZjrNAiF', '66S2FRgX8al', '6VMdqURcmx7', '6WzEJUWCnKN', '5y34gJ5aiPb', '6rDpPQV5c0i', '5VTPNi9Ha3w', '5dcAeTqKxhj', '6RXO9pKotPV', '69jJxhF86Yk', '6oiTtYItgmo', '6HUOqsiJGRX', '69yAum3TwUS', '64HNtI9aayc', '5rFNGYaOXUd', '69jBWIgp8H7', '6lJfba5n8lp' ]; let currentIndex = 0; function showFrame() { images.forEach((id, index) => { const image = object(id); image.style.opacity = (index === currentIndex) ? 1 : 0; }); currentIndex = (currentIndex + 1) % images.length; } // Set all images to hidden initially images.forEach(id => { const image = object(id); image.style.opacity = 0; }); // Start cycling through frames at 30fps (33.33 ms per frame) setInterval(showFrame, 33.33);119Views1like8CommentsA Way to Organize Color Swatches
I'm a big fan of organization and efficiency when it comes to production eLearning development. One of the biggest challenges is keeping track of hexadecimal colors that I use on a daily basis. I used to use Adobe Kuler, which was a fantastic way to explore color combinations and a swatch panel that I used to organize all the colors I used for various projects. Well, they've recently changed to Adobe Color and have basically ruined what wasn't broken and now its requires Adobe Express in order to edit and save color palettes, so I started researching other options. Frustratingly, nearly all the options I found required a subscription. What I ended up doing is create an html document that I keep on my desktop and it's been absolutely wonderful and I wanted to share with this community as I have received so much help and assistance from this amazing, creative community of professionals. Open and edit the html document with Text Edit, or Notepad and you'll see the section where you can add your own color swatches, or update what's there. You can name them whatever you want and add in the hexadecimal color code. When you open the document in a web browser, you simply click on the color you want to use and it copies the hexadecimal code to your clipboard. My next push will be to create another one that is all pastel color combinations. This has ended up being one of my favorite new resources and best of all it's free and super easy to customize. Enjoy and continued success!Solved94Views2likes5CommentsHow are you handling certificate delivery?
Certificate delivery keeps coming up, so I wanted to share the approach I settled on after trying a few and hear how others are doing it. The recurring problem: a learner finishes a course, and you want them to get a certificate that (a) looks exactly like the slide you designed, (b) lands in their inbox automatically, and (c) is recorded somewhere you can look up later. Native print-to-PDF and LMS certificates got me part of the way, but not all three. What I ended up building: On the certificate slide, the Send button runs an Execute JavaScript trigger that posts the slide to a small backend endpoint. The backend renders that actual slide, so the PDF is pixel-perfect; no rebuilding the layout server-side and hoping the fonts match. It emails the PDF to the learner over SMTP, and logs every issue to a database with a simple admin dashboard (search, re-send, download). It runs on ordinary cPanel hosting - no monthly third-party service and no per-certificate fees - and one backend serves multiple courses. How's everyone else handling this native download, LMS-issued certs, Google Sheets/Zapier, a paid service? Curious what's working for you. I do this kind of Storyline-to-backend integration, so happy to go deeper on any of it if it's useful.43Views0likes1CommentBadges for Competencies
We have some badges set up in our LMS for competencies but I'm wondering if anyone has any cool design templates to share for badges they've created. We are diving pretty heavily into a competency project and will be aligning courses in our LMS to that project in the coming months.126Views1like6CommentsCamtasia Can Do This? A Stunning Motion Graphics Template for eLearning
I’ll be honest, Camtasia continues to surprise me. Many people still think of Camtasia as a simple screen-recording tool, but when you start pushing its design and motion capabilities, it becomes much more than that. I recently built the Oblique Camtasia Template, a 24-slide corporate motion graphics template designed for eLearning, webinars, training videos, and polished business presentations. This template uses diagonal layouts, animated image treatments, lower thirds, title plates, infographics, matte effects, ease-in motion, and custom shape-based design, all built to show how far Camtasia can go when used creatively. Yes, tools like Adobe After Effects and Premiere are powerful. But Camtasia can absolutely hold its own for learning design, corporate video, and clean motion-based presentation work. The bigger point is this: don’t limit Camtasia to screen recording. Test it. Push it. Build with it. There is so much creative potential sitting inside the tool. Watch the short clip here: https://youtu.be/Cr4aVIbxfsE?si=9Am9z6XdrcfT-1xn Read the full under-the-hood blog here: https://www.craftuxd.com/post/camtasia-elearning-corporate-motion-design-template Watch the full template in action here: https://craftuxd.tech/ObliqueCamtasiaTemplate.mp4 #Camtasia #eLearning #MotionGraphics #LearningExperienceDesign #InstructionalDesign #CorporateTraining #VideoDesign #CraftUXD142Views1like2CommentsModule Review
Hope you all had a great weekend! I recently completed an eLearning work sample and would love some honest feedback from fellow instructional designers and eLearning professionals. As a personal challenge, I took one of Tim Slade’s design challenges and transformed it into a fully interactive eLearning module. I’m especially interested in feedback on the overall design, user experience, content flow, interactions, and any areas that could be improved. Review link: TacoMazing Fire Safety Academy Thank you in advance for taking the time to review it. I truly appreciate any insights, suggestions, or constructive feedback you can share!81Views0likes3CommentsNew Storyline Characters
Hey Heroes! We have a few new characters in Storyline and want to know: where would you use them? 🎤Introducing Liana, Alexis, and Simon: Wearing an oversized blazer, Liana fits well in modern, professional settings. Dressed comfortably, Alexis is ready for casual and work-from-home scenarios. Simon is a casual character ready for situations requiring an apron. 👇Tell us how you’d use just one (or all three!), and as a bonus creative task, let us know what celebrity they remind you of.75Views1like0Comments