Maker Space and Teen Tech Lab

'Find an economist that supports our position, and if you can't, 3-D print one!'I love the idea of having Create Space/Maker Space at the library, so I am on a mission to learn/teach myself various standard Maker technologies.

I decided that I would continue with the art/craft programming I’m already doing, but add a once-a-month Teen Tech Lab. The first four technologies I want to explore are animation, Makey-Makey kits, Scratch programming and AppInventor.

Last Friday, I started the learning phase by downloading the free Stop Motion Animation Studio app onto my iPhone. I did a very simple stop motion animation using post-it notes that each had a letter on them, and spelled out “how to animate” one letter at a time. I finally figured out that the easiest way to do it was to put all the post-its on a board the way I wanted the phrase to end up, snap a picture, then “unspell” the word backwards by removing one post-it at a time. Then I reversed the frames in the program to have a completed animation. I plan to do some more tests and demos with clay and legos. The biggest problem was that I had no way to mount my iPhone on a tripod. I ended up using my gps mount from my car, sticking the mount to the slick plastic protective cover on my laptop, then propping the laptop on two Kleenex boxes to get it the right height, and leaning the foam core board (on which I put my post its) against the cubicle wall. Not a perfect solution, and too easy to jar the camera.

Next, I decided I had to dive in and learn about Makey Makey boards. (Intro to Makey Makey). I watched a bunch of videos in order to understand how they work and what can be done with them, and decided to focus first on musical applications. (Music was my undergraduate major.) Last Sunday, I visited another library’s makerspace, and the teen volunteer showed me around. He suggested that I make something on their color printer. While browsing plans, I stumbled across an iPhone holder designed to fit on a standard camera tripod which I could use for the animation projects. Sixty-five minutes and 25¢ later, I had the perfect iPhone tripod holder.

Then the teen brought out the Makey Makey kit. I told him about a video in which someone drew designs with pencil on paper, and used the board to “play” these graphite shapes like a piano. He had never done anything like this, but together, we found a diatonic piano keyboard on the Scratch site that was Makey Makey compatible, hooked up the wires as specified on the Scratch page, and played the paper like a piano. The teen and I were equally engaged and invested in the results. I found and shared a couple of the videos with him that I had watched (Intro to Makey Makey and Edible Star-Spangled Banner), and he seemed to get excited about the new possibilities for the kit.

Some of my favorite Makey Makey videos:
Various musical and art Makey Makey projects
Just the “Dip Hop Pizza Hut Canada”
Edible Star Spangled Banner

I went home that night and used my Amazon gift cards that I got as Christmas gifts to order a Makey Makey kit. When it arrived on mid-week, I immediately set up a strawberry piano to test it out, and it worked great!  I videotaped the process, using my new holder on a tripod, and uploaded it to YouTube. (See strawberry piano.) Simple, but still cool. I have decide to do a series of brief video lessons on getting started with “Makey Makey Music.” I’ll start with the what/how/why of Makey Makey, then do a progressive series of different ways you can build on the concept–different instruments, sound effects instead of music notes, “found sound” scales,  foil balloon pianos, a floor piano, edible songs, a piano where you play a metalophone while the Makey Makey connects it to additional chords or other sounds, layered loops of music and beat tracks, and options with an input that serves as a toggle to add another octave or accidental keys or a different instrument setting (like changing the stop on an organ.)

Many of the more complex ideas will require programming in Scratch to get what I want, so that was my next project…learning to program in Scratch. I found an existing Scratch one-octave chromatic keyboard  with a drop down list where you choose which sampled instrument you want (Not set up for Scratch). You can remix an existing Scratch project (the equivalent of “save as”), so I used this project as the basis for mine. I was able to see all the steps the creator had used in making this keyboard, and selectively add and delete elements to get what I wanted. In the last two days, I have figured out how to assign different instruments to the keyboard, how to replace notes with sound effects, how to mix and match pitched sound effects with instrument sounds, how to add downloaded sound effects, and how to assign keys to these notes that will make them compatible with the Makey Makey interface. I also have learned how to add longer sound samples like loops and riffs. At this point, there are limits on the amount of assignable notes, but I have ideas on how to expand that.

I haven’t started learning AppInventor yet, but hopefully sometime within the next month. I also want to work with animation options in Scratch.

A reflection on a technology learning binge

mysql-or-my-sql

Between my class in library technology, another in intro to library studies, a job at a public library that includes technology training, an ecourse in instructional technology, and working as a freelancer on a library website and another library’s marketing templates, I have learned a LOT!

I have built a number of websites this semester: My portfolio site (which is serving as a testing ground for various web techniques), a testing site for a usability study, a site housing a research report about digital rights management, and a site mock-up for a tutorial on a custom user interface for a database. I’ve also been developing a library website on wix.com and doing updates on a WordPress site. I now mumble HTML code in my sleep, and CSS is starting to make sense. I don’t understand PHP, but the thought of learning it no longer scares me, and I’ve edited a number of complex jquery scripts. I also consider myself to have tourist-level grasp of Unix command line and database development, with a smattering of SQL. (I built the database in this presentation).

I’ve learned new programs and interfaces: Captivate (using it both as a survey tool and as a software demo screen capture tool); Blackboard Learn for interactive distance courses; a variety of databases available through the library; Audacity for music editing for a video; Microsoft Access; Final Cut Pro, and Google forms. I’ve become much more familiar with Kindles and iPads, and for the first time in 20 years, I regularly work on a PC and not just a Mac.

The technology learning inspires me to figure out the best way to use this technology to fulfill my roll as a library staff member/future librarian.  I also wish to further my studies in technology to cultivate more web programming skills, to learn about and develop technology programs for kids, to find technology programs that will engage teens, and to find the best ways to deliver technology program to technophobes.

Sounds like fun!

Website Usability


Flash-Button-Webcopyplus-web-writer-1

I just completed a group project for grad school that involved testing website usability. Our results were not necessarily surprising, but solving them will be challenging.

Common wisdom in web design includes:

  • keeping the pages clean and simple as possible
  • keeping pages as visually interesting and dynamic as possible
  • keeping the number of clicks and amount of scrolling to a minimum
  • setting up the site in a manner that allows for efficiency in maintenance

The group’s recommendations for website changes, based on the usability survey, include:

  • simplify the page design and amount of text on the home page
  • update/change the photos
  • label buttons and headers in easy-to-understand terms
  • make sure that key features such as library hours and catalog search are prominent and “above the fold”
  • improve organization of the databases page
  • add a site search

It’s hard to apply the common wisdom and implement all the recommendations at the same time, especially on the home page, while also being comprehensive in the information and resources that the site provides.

We have a three-member team at the library currently working on making recommendations for usability improvements to the site.

The questions we’ve been wrestling with are:

  • How can we simplify the page with fewer buttons without increasing the number of clicks to get to information?
  • How can we enable users to get to all the information from the home page with minimal clicks but not increase the scrolling to to get to the buttons and links?
  • How can we simplify the design and layout while making it visually compelling?
  • How can we develop titles for categories, pages, and buttons that are understandable to the majority of users?
  • How can we make it more dynamic without increasing (and preferably while decreasing) the admin time?

Our solutions:

  • The images will be simplified: We’ll have one large slide show, a visual icon that links to the calendar, and perhaps a small book slider that promotes new books or specific topics or collections.
  • We are recommending eliminating the three static photo links on the home page, and the three text links below them; we are eliminating and/or renaming some of the buttons and links to make them more clear.
  • We are adding a site search.
  • We are suggesting making the home page shorter so that key information is visible without having to scroll down.

Technology Fast-Forward

thumbs_toon_39 One of the goals I’ve set for myself during my MLIS program is to greatly increase my technical fluency. Already, I’ve added a lot of new skills and a new level of understanding to my technological arsenal. Since August, I have updated and expanded my HTML coding skills, learned to code CSS, used a moodle for the first time, learned to (lightly) edit javascript, participated in a webinar, and become comfortable with the Blackboard and other elearning platforms. I took an ALA ecourse in instructional design, and it’s caused me to rethink my strategies on how best to deliver tech training to patrons. A hands-on workshop in Final Cut Pro has me trying to figure out how to incorporate that program into a class project so that I will become more fluent with it. I’ve starting working on a series of Tech Topics, and my presentation on Pinterest involved a lot of research and testing, which has improved my skill level in that particular social media platform. I am now starting to research for the next tech topic presentation, “Google: Who Knew?” I’m completing the development of a library website (for a client) that will launch within the next month, and was on the committee making recommendations for improvements to the site at the library where I work. I’ve learned how develop templates for Library Aware for another client, and have worked on the production and delivery of eblasts and enewletters. My tech training has forced me to more thoroughly learn about Kindles, iPads,  and iPhones. For just about every assignment so far, I have been utilizing library databases (for the first time ever), and in some cases, visiting the Rutgers library for print resources; I also used the databases for research purposes when peer reviewing an article for Art Documentation. For my presentation on a “Library Star,” I created a custom wordle after finding that the “auto-wordle” sites did not do a very good job. For the group assignment on a Usability Study, I’ve been a bit obsessed with finding the ideal technology for delivering the survey. I spent the better part of 24 hours immersed in a trial version of Adobe Captivate, and taught myself how to set up the survey questions and embed the website being evaluated. When that program turned out to be less than ideal for use with four locations/four machines, I learned how to create forms within HTML, and added the survey pages to the website I had already created for the library technology class. However, the “mailto” submit process is unreliable and inelegant, so I researched options with independent forms hosting vendors. The free services are limited, so I re-created the forms in editable pdfs and embedded them in my web pages. Again there were issues with submission, so I finally tried Google forms. I was surprised to find that the simplest solution—Google forms—was also the best. The forms were easy to make, could be duplicated, and had an option to make the form question required. I was able to embed the form within the web pages and select a theme that looked like it belonged with the visual branding of the website. Not only do I have a solution that gets a thumbs-up from everyone in the group, but it give me more information on Google apps for my upcoming presentation.

“Education is a progressive discovery of our own ignorance.” —Will Durant

One of the tough things about technology is that the more you learn, the more you realize there is to learn. And the minute you start to achieve reasonable level of mastery in a given technology, it seem that there is either a huge upgrade that changes that technology or some new whiz-bang product renders the technology you’ve started to master obsolete. It can be very difficult to stay ahead of the upgrades, not to mention the new trends. So that is my challenge to myself…to strive to stay ahead of the technology learning curve.  Here’s to the journey.

Success is a journey, not a destination. —Arthur Ashe

Learning Theories and Teaching Technology

cartoon-1

Developing technology skills can best be achieved through building on existing skills, hands-on learning of new skill, and practice of the newly-learned skills. This type of learning would be served well by cognitivism, which “stresses active learning techniques and motivational learning content using problem solving.” The application of this learning theory will lead learners to think through, understand and apply.

Challenge:  A patron wants to know how to manage photos on her iPad

Learning environment: One-on-one technology learning sessions

Structure:

  • Engage the learner as an active participant
  • Build on prior knowledge
  • Divide the learning into manageable segments
  • Lead to problem-solving

Possible implementation:

Step 1: Ask the participant to show you her favorite picture that she has taken on the iPad; assess her navigation skills and challenges as she does so.
Step 2: Review related prior knowledge, such as how the learner uses the device to take and save a picture; have her take a picture to demonstrate.
Step 3: Talk the learner though the process of viewing the photos in different ways (photo stream, albums).
Step 4: Talk the learner through the process of creating an album.
Step 5: Talk the learner through the process of adding and deleting photos from an album.
Step 6: Explain that there are different ways to share the photo; have the learner experiment with the different icons to see what they do (email, text message, Facebook, etc.)
Step 7: Provide a visual reference card as a guide to the various icons used in the photo album (including email, delete, folder, etc.)
Step 8: Have the learner repeat the process by taking a photo of the visual reference card, creating a folder in the photo album for the picture, and then sending it to her own email, then checking the email. Encourage her to use the knowledge she has gained to figure out how to then forward the email with the picture to herself. (problem-solving)

Motivation:
Step 9: Remind her of what she has learned in the session: to view stored pictures in different ways, to create albums for her pictures, to create and manage albums, to add and delete photos, to share photos and to forward photos via email. (sense of accomplishment for motivation)
Step 10: Optional: Have her take a selfie and email the picture it to a friend or relative with a message about learning to manage pictures on her iPad.

Technology Learning Curve, part II

Unknown

Well, my website assignment for “Library Technology” is posted: bama.ua.edu/~jwork. This site is doing triple duty: class assignment, current and future library portfolio, and testing ground for web techniques and skills as I add them to my arsenal.


What I’ve learned:

  1. Do as much pre-planning as possible before you start coding: your navigation, your organizational outline, and your current and projected content.
  2. Back-up frequently and keep those back-ups handy; in the same vein, when you are about to add something that may possibly mess up your whole page, do it in a copy of that page.
  3. Get past your code-phobia and go for it!

PRE-PLANNING:
The pre-planning would have saved me more hours than I’ll ever admit…hours I could have (and should have) spent getting a good night’s sleep. All the hand-tagging for this site was done strictly in HTML and CSS. I also incorporated a few features using open source code done in javascript, which is next on my list to learn. However, because of the limits to my current knowledge, there were many elements I repeated in the code on every page in my site which meant every edit had to made 17 times. For example, if I made a change to the name of a navigation button, I had to open all 17 pages and copy that change into each page.

These repeated items included the top navigation bar and dropdowns, the rather complex left-hand collapsing menu with sub-menus, and the footer, which included a horizontal rule, a copyright notice, two social media icons, a Pinterest “Pinit” button and a link to “about this website.” Unfortunately I added these footer elements at five different times (to all 17 pages). I changed the button choices on the navbar three times and the names and amount of dropdown downs items at least four times. I changed the names and order and amount of submenu items in the left-hand menu maybe 20 times. I also had a dozens of changes to what they linked to: whether it was a pdf, a page, an external link or an anchor. Multiple every change by 17 and it adds up to a lot of time spent opening pages and copying, pasting and saving the code. Having some of these changes occur when in mid-construction is inevitable, but really solid planning would have cut down on a lot of this.

This page in my website shows all three features adapted from external code.

“If you don’t have time to plan, do you have time to waste?”
—Peter Turla

I think it would have helped to do the content first. Which portfolio items should have a dedicated page with a slide show? Which would be downloadable or browser-viewable pdfs? Which would be external links to blogs or external websites? Which would have relatively little text and could be consolidated on one page with anchors? Which elements required a creative solution towards usability (like have a text-based version of the image map content)? How should I name the categories of portfolio items? I must have had 30 or 40 versions of the left-hand menu at various times in the process. Pre-planning could have brought that number down to under 10. My original Pinterest link was to my personal Pinterest page that has 57 boards on a variety of topics, including library-related topics. I realized that if I used a single Pinterest link to my Pinterest site, people seeking library boards would have to wade through all my other boards, which is not what I wanted. So I opened a second account that will only hold library topics. For the moment, it only has a few reader’s advisory boards. I plan to expand that site significantly, but with boards that all fit within the “cool library stuff” theme.

NEVER UNDERESTIMATE THE VALUE OF BACK-UPS:
Backing up frequently and making changes in copies of files (rather than the original files) is another timesaver, and occasionally a lifesaver. I lost track of how many times I tried something new on a page and suddenly everything went haywire: the horizontal rule stopped going all the way across the page, the color behind the lefthand menus disappeared, the background image disappeared, the fonts started started changing, or the columns shifted or overlapped.

Many times I scrapped the copy of a page, made a new copy of the original page, and started over. I also did all the testing of the menus and navbar in separate copies of pages. I tried several different open source code menu options before finding ones that worked for me and could be customized to my purposes. I also went through a lot of effort adding various widgets, only to find there was a problem that made it unworkable for my site or beyond my current knowledge and skills. For example, the customer google search costs money…that was not something I wanted to do on this site at this time.

But the end result of this experience is that I learned a lot. My HTML skills are now much stronger, I can now code CSS, and I’m much more comfortable building widgets and features or adapting open source code to incorporate new elements. I am no longer afraid to try new coding challenges, and I want to learn java and php. In short, I am prepared let go of my code-phobia and “go for it.” To quote Sally from the revival of You’re Good Man, Charlie Brown, “That’s my new philosophy!”

Instructional Design: Outcome, Assessment and Teaching Methods

Mindflash2Final-21

INSTRUCTIONAL DESIGN PLANNING:
Desired outcomes for Tech Tuesday instruction using TechMarks

After a guided practice, one-on-one with an instructor and using paper and/or online quick guides, the learner should be able to

  1. Replicate their specific new technology skills using the guide(s) as a prompt.
  2. Be able to self-learn new skills using only the guides.

This type of learning process use forward-looking assessment by working on skills that allow the learner to self-learn similar skills.

Two criteria that would distinguish mastery of the skills would be:

  1. The ability to demonstrate mastery of a new skill learned with verbal prompts from the instructor.
  2. The demonstrated ability to self-learn how by using the paper TechMarks to learn to use the online TechMarks.

Standards for assessing the mastery of the new skill could include:

  • Adequate mastery of the new skills would be characterized by the demonstration of the  new skill with significant dependence on the TechMarks.
  • Very good mastery of skills would be characterized by the demonstration of the  new skill with moderate dependence on the TechMarks.
  • Excellent mastery of skills would be characterized by the demonstration of the  new skill with little to no dependence on TechMarks.
  • Mastery of skills would be characterized by the demonstration of the  new skill with no dependence on TechMarks; a thorough understanding of the skill would be demonstrated by the ability to teach the skill to someone else.

Students would be able to engage in self-assessment by practicing their new skills at home, taking TechMarks with them to try new skills, and/or teaching the new skill to someone else. If they have issues and something isn’t working the way their remembered it should, they could practice self-trouble-shooting using the TechMarks.

Instructor feedback would occur during the one-on-one training session and the follow-up group session, with prompts that guide the learner to use the TechMarks as guide. These session will also serve as self-assessment for the instructor to verify that the TechMarks are thorough, have intuitive wording, and cover most common trouble-shooting issues.

Teaching methods conducive to achieving these learning outcomes:

  1. One-on-one instruction in which the instructor teaches the skill by prompting the user through the steps and trouble-shooting listed on the TechMarks. Have the learner develop a tech skill “bucket list” in priority order.
  2. “Assignment” for learner to use the learned skill at least twice during the week, using the TechMark as a prompt and if needed, for troubleshooting.
  3. Optional assignment to take an additional TechMark home and self-teach a new skill.
  4. Meet a week later in small group “Tech Support” sessions to briefly discuss and demonstrate the mastered skills, with peer and instructor feedback and encouragement. Challenge the group to figure out a new skill using a TechMark without any instructor feedback.