{"id":359,"date":"2014-05-28T23:24:27","date_gmt":"2014-05-28T23:24:27","guid":{"rendered":"http:\/\/ashleychiasson.com\/blog\/?p=359"},"modified":"2014-08-23T19:28:42","modified_gmt":"2014-08-23T22:28:42","slug":"e-learning-challenge-interactive-step-graphics-in-online-training","status":"publish","type":"post","link":"https:\/\/ashleychiasson.com\/blog\/e-learning-challenge-interactive-step-graphics-in-online-training\/","title":{"rendered":"E-Learning Challenge #36: Interactive Step Graphics in Online Training"},"content":{"rendered":"<p>I&#8217;ve been feeling pretty slack lately, but I won&#8217;t argue about being too busy to participate to my fullest potential. In any event, this week&#8217;s e-learning challenge is all about interactive step graphics in online training &#8211; coming from a Defence background, this is a great challenge for me, because at least 80% of the work I did previously was procedural training for complex procedures (e.g. aircraft maintenance training). I will warn you that this week&#8217;s submission is 1 &#8211; a throwback to one of my initial portfolio pieces (because this month has been all about the hustle) and is 2 &#8211; likely not going to dazzle you as much as an Electronic Performance Support System (EPSS) for removing the main landing gear of an aircraft.<\/p>\n<p style=\"text-align: center;\"><strong>The Concept<\/strong><\/p>\n<p style=\"text-align: left;\">Create an interactive step graphic that trains users on a very important procedure. In this case, I chose to discuss the steps for bathing your cat. This is a very tricky procedure, so be especially cognizant of Step 3. Full Disclosure: Our cats are very good at cleaning themselves and we have never had to forego this procedure first-hand. Please let me know, in the comments, how you&#8217;ve fared in your attempts. I&#8217;ve heard that some cat&#8217;s need to be sedated; if this is the situation you&#8217;re faced with, and you find it challenging to administer pills to your feline, <a href=\"http:\/\/www.pperf.co.uk\" target=\"_blank\">Bruce Graham<\/a> has a lovely training module to help you with this problem.<\/p>\n<p style=\"text-align: center;\"><strong>The Method<\/strong><\/p>\n<p style=\"text-align: left;\">For some reason, I really wanted to have a background image, so I sourced one from <a href=\"http:\/\/colourlovers.com\" target=\"_blank\">ColourLOVERS<\/a> and modified the transparency. Then, I sought about creating some cute looking tabs and writing the procedural documentation for how to bathe a cat. I consulted <a href=\"http:\/\/wikihow.com\" target=\"_blank\">WikiHow<\/a> for these assistance, and they did not disappoint, providing me with many fantastic images to use within the module.<\/p>\n<p style=\"text-align: left;\">I tossed everything together and added triggers to my tabs, with each trigger displaying a layer. Images were called up within a new lightbox-esque (but not to be confused with an actual lightbox) layer, and Bob was my uncle.<\/p>\n<p style=\"text-align: center;\"><strong>The Result<\/strong><\/p>\n<p><a href=\"https:\/\/i0.wp.com\/ashleychiasson.com\/blog\/wp-content\/uploads\/2014\/05\/Cat_Bath_Lg.png?ssl=1\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter wp-image-362 size-full\" src=\"https:\/\/i0.wp.com\/ashleychiasson.com\/blog\/wp-content\/uploads\/2014\/05\/Cat_Bath_Lg.png?resize=500%2C413&#038;ssl=1\" alt=\"Cat_Bath_Lg\" width=\"500\" height=\"413\" srcset=\"https:\/\/i0.wp.com\/ashleychiasson.com\/blog\/wp-content\/uploads\/2014\/05\/Cat_Bath_Lg.png?w=500&amp;ssl=1 500w, https:\/\/i0.wp.com\/ashleychiasson.com\/blog\/wp-content\/uploads\/2014\/05\/Cat_Bath_Lg.png?resize=300%2C247&amp;ssl=1 300w\" sizes=\"(max-width: 500px) 100vw, 500px\" data-recalc-dims=\"1\" \/><\/a><\/p>\n<p>&nbsp;<\/p>\n<p>To view the complete interaction and potentially save yourself a world of hurt (literally), <a href=\"http:\/\/ashleychiasson.com\/Samples\/Cat_Bath\/story.html\" target=\"_blank\">click here<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>I&#8217;ve been feeling pretty slack lately, but I won&#8217;t argue about being too busy to participate to my fullest potential. In any event, this week&#8217;s e-learning challenge is all about interactive step graphics in online training &#8211; coming from a Defence background, this is a great challenge for me, because at least 80% of the [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_genesis_hide_title":false,"_genesis_hide_breadcrumbs":false,"_genesis_hide_singular_image":false,"_genesis_hide_footer_widgets":false,"_genesis_custom_body_class":"","_genesis_custom_post_class":"","_genesis_layout":"","jetpack_post_was_ever_published":false,"jetpack_publicize_message":"","jetpack_is_tweetstorm":false,"jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":[]},"categories":[3],"tags":[10],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p4s3cq-5N","_links":{"self":[{"href":"https:\/\/ashleychiasson.com\/blog\/wp-json\/wp\/v2\/posts\/359"}],"collection":[{"href":"https:\/\/ashleychiasson.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ashleychiasson.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ashleychiasson.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ashleychiasson.com\/blog\/wp-json\/wp\/v2\/comments?post=359"}],"version-history":[{"count":3,"href":"https:\/\/ashleychiasson.com\/blog\/wp-json\/wp\/v2\/posts\/359\/revisions"}],"predecessor-version":[{"id":560,"href":"https:\/\/ashleychiasson.com\/blog\/wp-json\/wp\/v2\/posts\/359\/revisions\/560"}],"wp:attachment":[{"href":"https:\/\/ashleychiasson.com\/blog\/wp-json\/wp\/v2\/media?parent=359"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ashleychiasson.com\/blog\/wp-json\/wp\/v2\/categories?post=359"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ashleychiasson.com\/blog\/wp-json\/wp\/v2\/tags?post=359"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}