IT3115 Instructional Strategy Discovery Web Trends Workshop: Scrolling Web Panes goal Instructional Strategy Instructional Activity Show end result first Demonstration Connectivism Demonstration Introduction Create engagement Show relevance Show industry trend module outcomes Websites using the scrollpane and parallax techniques. Social Share Participants share their background and sites they like Module 1 Mouse Parallax Outcome: Assemble a parallax webpage element Assessment: Element moves with mouse movement and matches the standard element for the module Spend time focused on topic and not set-up scaffolding Starter Kit Provide pre-built starter files with basic structure Instructionalism Follow-a-long Demonstrate a step. Students complete the step. reflection Stop and Share how this technique could be used in a design Module 2 Scroll Peeler Outcome: Assemble a scroll-peeler webpage Assessment: Webpage scrolls and matches the standard webpage without errors Spend time focused on topic and not set-up scaffolding Starter Kit Provide pre-built starter files with basic structure self =>content Self-paced tutorial reflection Stop and share web-based how this technique could be used in a design Module 3 Scroll Parallax Outcome: Assemble a scroll-parallax webpage Assessment: Webpage scrolls with moving animations and matches the standard webpage without errors Spend time focused on topic and not set-up scaffolding Starter Kit Provide pre-built starter files with basic structure Challenge, involve with content JS script – Match Game 2 students per group with script handout and a list of script sections and actions. Students match list of items to the script. Instructionalism Demonstration Demonstrate a step. Students complete the step. discovery Do Your Own Students create element animations from a list of possible configurations Module 4 Personal scroll-parallax webpage Outcome 1: Create design workflow sketches and simple Photoshop comp Assessment 1: Workflow sketches and comp meet standard discovery Create Workflow Provide flow diagram shapes of paper and worksheets. Students assign the workflow steps to the shapes and place them into a workflow order. Instructionalism Provide Photoshop base correct layer set-up Practice Create Photoshop Comp Provide Graphic Library – themes Students select graphics from library Module 4 Personal scroll-parallax webpage Outcome 2: Build a functional webpage from templates based on the personal design Assessment 2: Webpage has scroll panes, animated elements, is built without errors and reflects the design Spend time focused on topic and not set-up scaffolding Starter Kit Provide pre-built starter files with basic structure Practice Build Webpage Social Learning Share Work Instructionalism Reference Guide to take home
© Copyright 2024