The purpose of this e-portfolio is to showcase my skills and experience in the field of instructional design and educational technology. The artifacts featured in this portfolio are various examples of my work.

Pop Quiz

Link

I created a quiz about what education looked like in the 1800s. Although easily verifiable, I just used fun facts I found in this Mental Floss article: https://www.mentalfloss.com/article/58705/11-ways-school-was-different-1800s. I also found an authentic 19th century school photograph to accompany the quiz. After following the steps outlined in this prompt to upload files to my website's file manager, I made changes to the code to make it my own. In the HTML caption area, I changed the title of the quiz to "Daniela's 19th Century Education Pop Quiz". I then went into the javascript and updated my questions and answers, as well as solutions to reflect my topic. For the feedback, I chose period-specific slang from the same source: https://www.mentalfloss.com/article/53529/56-delightful-victorian-slang-terms-you-should-be-using. Using an inline style tag in the HTML, I changed the caption font and font size to be bigger and more easily legible. I was going to change the background color for the sake of showing my ability to do so, but my inner designer took over and I just couldn't do it. I kept the colors accessible, clean, and minimalist with the standard white background and black text. The simple colors also matched very well with the old photograph I added to the top of my page by uploading the image to my website files and referencing the title of the image (carefully created with lower-case letters and no spacing) using an image source tag in the HTML and scaling it down to 50% width and height to better fit the table below. I added breaks for white space and a simple caption below the image to reference my source. Finally, I added a finishing touch by matching the font size of the solution and response areas to the quiz title, indicating the equal importance of all three parts of the page and changed the solution name to "Judgement" to fit in with the 19th century theme. All in all, I did not have much difficulty as much of the code was copy-and-pasted. The biggest challenge with coding always is that it is simply time consuming.

Drag and Drop

Link

After downloading and extracting the files, I first set about changing the style of the page. In keeping with my pared-down and accessible theme, I cleared the colors and changed all of the backgrounds to white, or #FFF in the CSS code. I then made sure to pair those choices with black text, or #000. I also removed the arrow indicating where an answer would be dropped. Although at first I did change the javascript from shuffling (true) to not shuffling (false), I decided against the change and turned it back. I made the same decision as far as locking the answers in because an an instructional designer, I would only use a drag and drop activity as part of a low-stakes study assignment. In the HTML, I changed the title to UDL Guidelines. I updated the columns to reflect my new topic, focusing on the 3 UDL categories and guidelines. I created a new folder called "drag" for my website and uploaded all files to the new folder.