Learned some new things about text formatting with HTML

• font size: in CSS definitions, best practice is to define the base font size in px, in the body styles definition, then the remaining sizes in ems. So the base size is set to an absolute size and the other styles will be a percentage of that. This follows from the inheritance rule that the child styles will inherit the parent font size as an absolute, then modify it by a defined percentage.
• HTML syntax: <tag attribute="value">
• W3C defined font families, 5 of them: Serif, Sans-serif, Monospace, Fantasy (Curlz, Jokerman), Cursive (Zapf-Chancery, Lucida Handwriting)
• blockquote tag: The text indent button in DW actually adds a blockquote tag around the selected block (p or div) of text
• physical versus logical styles: HTML text styles come in two philosophically distinct categories. Physical styles define the appearance, such as <b> or <i>. Logical styles set the appearance of a type of information, such as <code> or a <cite> (for a citation), or, yes, <em> and <strong> (see below). Logical styles aren't defined in the code, however, but by the browser, so if you want control over those definitions you must define them in your CSS. There are some logical tags I'd never heard of, like Variable, <var>, Sample, <samp>, Keyboard, <kbd>, Definition, <dfn>, Deleted, <del>, and Inserted, <ins>.
• bold and italic: <b> and <i> tags are physical, whereas <strong> and <em> are logical tags. It is considered "better practice" to use the logical tags rather than the physical.

Learned something new about hyperlink styles

In my Dreamweaver CS3 reading I learned something new about defining hyperlink styles in your CSS. It was stated that the four link styles had to be defined in a certain order for them to work properly, namely a:link, a:visited, a:hover, a:active. I didn't know why and I'm sure I haven't always followed this practice, so I did some research. First, I found a really good tutorial about defining link styles using Dreamweaver's interface here. But this still didn't explain why the special order, and I was beginning to think it was one of those professional things where it's just done that way and if you don't you'll be made fun of. Then I found a fantastic post at meyerweb that explains it perfectly. I can't explain in a nutshell but it's worth reading. What I have done is thought of a mnemonic to remember the order: Let's Visit Hyperlinks Always (LVHA). Of course this isn't necessary if you're using Dreamweaver to define the styles because the order is right there in the drop down, but it seems so much easier to just write that CSS by hand than going through all those clicks.

Web site project

I've been thinking more about my web site project, this web site that (I hope) my students will use to find their way through programming their Lego robots. I'd like them to be able to find out how to use commands in program structures, get ideas for projects, and share their own ideas for programming and projects. I've got some PHP and MySQL under my belt from a couple other web sites so I'm going to use it here to create a database of Logo robotics programming commands with descriptions and examples of each, and maybe even pictures of sample projects. So I've done a brief sketch of the information architecture for the site, or maybe this is an early version of the flow chart. Basically, I'm looking at a page for people to find commands or project ideas, a page for them to add their own commands and project ideas, and a page for me to administer the database. I guess I'll also add a page about me, too. And then they just better use it. I don't want to go to all this trouble for no use. I guess what I hope is for them to add some content and then widen the audience to a broader Logo robotics community and hope they find it useful as well.

One of the keys will be making it look nice with an enjoyable, easy, and intuitive interface. So I hope to achieve that in this class, and the PHP/MySQL can come later. I know that's a bit backwards, but it'll still work. Famous last words, right?

McLuhan, The Medium is the Massage, notes

• pg 22: "the mass audience can be used as a creative, participating force." I guess reality TV is the lowest common denominator of this phenomenon. Does Youtube represent this? or is all Web 2.0 a step further than he imagined?
  
• pg 22: Interesting that he sees television as participatory. Now it's seen as a passive activity.
• pg 41: "Electric circuitry is an extension of the central nervous system." And then, when the reach of any one of our senses change, we change. Maybe robotics is interesting because of this, an extension of our senses that changes what and how we can perceive. If you can make and program something to gather data or send a message, you not only gain control in the world, but have special knowledge of how to see things in a new way.
• Also, re: electrical circuitry, is blogging an extension of self? and with so many doing it is this a new mass participation in this global village? But one problem is blogging does not help one understand the circuitry at all, it's still magic, like HTML was in the beginning.
• First was oral literacy, then print literacy, now what?
• pg. 117: We are visually biased.
• pg. 125: He says "Television completes the cycle of the human sensorium." He says it abolishes writing, and therefore, I think, the linear thought of the printed word. If we extend the medium of television to include web browsing, maybe we have a key to why people have such a hard time following textual directions on web sites. With such an overwhelmingly visual medium people turn off their linear, textual thought processes. So often I have to help teachers simple read instructions on the page in front of them when they are trying to complete tasks. What would be a more effective way to communicate instructions?
  

About Me Colors

I found it hard to get inspiration for a web page color scheme by looking at photos. A photo's colors are so grounded in what they inhabit and web page colors are abstract, hard, and too much themselves by contrast. So I don't know if this will translate, but I was thinking sunsets and I have a lot of sunset pictures from out of our living room window, but those all seemed too dark, so I found a sunrise picture from a trip to Mohonk and I think it might work. But just the sky part, not the dark mountain. I think this is a monochromatic color scheme, with the main color being blue and the inclusion of shades of blue and gray and some orange highlights. I think the background should be light blue to give a light feeling and the navigation should be a combination of dark blue/gray and orange. The place I'm eventually heading with this web site is a robotics help site for my students, so I may want to make the colors more saturated than they are in this picture.
Anyway, here is the page I ended up making: http://openblackboard.com/class

E-paper

I can imagine so many instructional situations in which some kind of electronic paper would be really useful. Just plug in a USB e-paper screen and pull up a tutorial beside your laptop while you follow its directions on your main screen; pull your e-paper scroll out of your pocket during a field trip in the park and jot down some notes around the picture of what you're identifying; plug several into an "e-paper hub" and load a document on all of them at once. I have students who don't want to refer to the tutorials I'm spending hours making for them because it's too hard or confusing for them to switch screens to do what it tells them to. Last week, a student said she couldn't work on her computer because her neighbor was watching the tutorial on her computer so she could follow the steps on her own. I could give them paper to avoid this difficulty, and sometimes I do, but the screen allows for a much richer multimedia experience.

E-paper will be in schools eventually, but it will take a while. Just today, Wacom and E Ink announced development of an electronic paper product that you can write on with a Wacom pen. It's going to be really expensive when it hits the consumer market but at some point it will be feasible for students to carry around flexible plastic displays that they can view any document in and write on it. Until that day, I'll just keep following the story and keeping track of it on delicious.

Web site evaluation

The One Laptop per Child web site is very pleasing to look at and navigate as well as being informative. It is the antithesis of a busy web site. The home page is deceptively simple. All you see is the iconic message on the left and the title of the site in the upper left. The icons spell out "One Laptop per Child" as you look at them left to right, so this would be how it establishes its "brand." But then upon mousing over them you see that the icons are the central navigation for the site as a word appears below representing that page's content. Clicking on one of them brings you to one of four sections (vision, laptop, participate, children).

Visual consistency is achieved as the iconic message/navigation is maintained on each sub-page and used for the site navigation throughout. Aside from the site title in the corner the rest of the page is white, so this phrase establishes its central importance very quickly by being right up front and center. The message is visually engaging as well with its dramatic color scheme, featuring highly saturated primary colors and one secondary color. The colors aren't in their pure form, though, so the yellow is more of a goldenrod, the green more grassy green, the blue a sky blue, and the red edging toward pink. I believe they were carefully chosen, because this makes them more interesting to the eye and (at least to me) they have a calming effect rather than the brash feeling pure primary colors would have. The color palette is maintained throughout the website as each section keeps the main color of its navigation icon. The web site layout is bounded by vertical lines that separate sections of text from each other and imply a rectangular boxy structure without being heavy-handed. The layout also achieves a kind of consistency in structure by separating the text sections with the vertical lines in the same way the icons on the front page and in the navigation are separated. Thus the visual flow is left to right as you look across the main sections in each sub-page.

Overall, I think the site's pleasant and simple appearance really facilitates a positive feeling in the user and makes them happy to be getting the information from the site. There is a lot of good information, so I'm glad the site's design facilitates it's dissemination well.

Learning from robotics

My students are completing a culminating assignment for the Temperature-measuring robot project in which they simply have to write what they learned from the experience. The following is a partial list, but all of it is fascinating and inspiring. I love how some of the learning is specific to programming and engineering and some is about how to confront problems in general, what to do when you are frustrated:

• I learned that making the robot take a temperature overy second is way too often. The water cools very slowly. You end up with about 700 temperature readings if you make it take the temperature every second.
• I learned that it is extremely difficult to make sure you have the correct program in Microworlds.
• We learned that data that appears on Microworlds can also be exported to create a graph on microsoft Excel.
• I learned how to convert celsius to fahrenheit on the computer which can be very useful.
• It was fun but hard.
• I learned that you cannot put loop and the program’s name together or else your system will crash.
• Robotics was really fun, and I learned a lot of things.
• One of the most valuable lessons I learned from making the temperature recording robot is that you must be patient and try again.
• We also learned that there are many ways to tell the RCX to export its data into Excel.
• I learned from making a robot that in order to make a successful robot the base must be sturdy. Without a sturdy base the whole robot breaks off.
• A little enthusiam works to in order to make it a great project!
• I learned how to use the loop command, the “athisway” and “athatway” commands, and I also improved my skills at making graphs on Microsoft Excel.
• I have learned from this project how to program a light senser, how to use a temperature senser, and to create a pully wheel.
• I had never worked with a temperature thermometer before and it was interesting to work with.
• When programming the temerature recording robot you need to have the thermometer firmly stuck on to the robot so when it quickly jerks down into the cup it does not fall off.
• I learned how to program the robot to take the temperature of the hot water, and how to send the temperatures through the RCX to the computer.
• I have learned that when making a program you have to make sure that you have not made any mistakes in the program.
• Making the robot that records temperatures is very hard and people who make it will encounter many problems.
• I learned that you can never do too many things at once because we tried to drive the robot and do it mechnically at the same time. This is hard and it is almost impossible.
• It was really interesting watching how the tempratures would constantly be changing throughout 10 minutes.
• I think that the most interesting thing that we learned, to me, was how to convert the tempratures into the graph on Excel.
• I learned how to use a gear to move a temperature sensor up and down into a cup.
• It takes a lot of patience to program and make the robot record the temperatures. You have to do it many times and there are many things that can go wrong.
• Also, I learned that you must make sure that you do not get someone else’s signal because it really messes up your temperature experiment.
• Overall, I learned many programming, organizing and engineering methods and skills over the course of this experiment.

Temperature Measuring RCX

I am just wrapping up a big project with my 7th graders making temperature measuring robots. The students programmed a robotic arm to lower a temperature sensor into a cup of hot water, send the temperature values to Microworlds EX once a second until the water temperature reaches a lower limit they have set (room temperature). Microworlds prints the temperatures in a text box until the RCX stops sending them. Then a button is pressed which exports the values to separate rows in Excel, where the students graph the data. I'm really impressed that my students stuck with this process because many elements of the system were difficult to problem-solve, even though we did it together. Here's one of the robots a pair of students designed, built and programmed. Very clever!

Here is another design. This one has a wicked action on the arm. What you can't really see and hear in the video is that they programmed a series of beeps and blinking lights before the arm swings over.

Fun With the Super Cricket

Learned a lot of stuff today testing components of the Super Cricket:

• The difference between the photocell sensor and the infrared sensor is the former detects levels of ambient light while the latter is affected by light values reflected back to it. The photocell sensor would therefore be good for triggering processes in reaction to the room lights being turned on or off, while the ir sensor would be a good line follower or for triggering a sorting system. It's cool to see them at work using a little program to output their values to an LED bus and watch them change as you move them around:

to get-light
display sensora
wait 10
get-light
end

• I also figured out how to store values and upload them to a text file. Here's the program:

to rec-data
resetdp
repeat 10
[display sensora
record sensora
wait 10]
end

• Once the data's recorded, uploading it is easy in Cricket Logo. Just click Cricket>Upload data, and in a few clicks you can upload it and save it as a text file that's easy to import into Excel.
• It's really fun to play with the LED bus. After downloading a procedure that prepares it to receive the LED assignments, you can download any letters you want. Here's the prepping procedure:

to display-bits :d1 :d2 :d3 :d4
bsend $110
bsend 64
bsend low-byte :d1
bsend low-byte :d2
bsend low-byte :d3
bsend low-byte :d4
end

• The values for :d1 :d2 :d3 :d4 have to be in hexadecimal format and they give a couple examples, such as that 'A' is $77. I had no idea how I was going to figure out what value each letter of the alphabet was, but my colleague wouldn't rest until he figured it out and he found this list someone at UMass had compiled. I'd like to know how they figured it out, brute force or programming. So my name is display-bits $7b $50 $30 $76.
• After a little email correspondence with the fine folks (maybe just folk) at Gleason Research, I also learned that I can make our RCX temperature sensors work with the Cricket with a little hacking. They sell a 9V motor adapter, which connects the RCX lead to a motor plug on the cricket. So I thought maybe I could put sensor plugs on the 9V motor adapter instead (the only difference is the motor plug has two holes and the sensor plug has three.) and connect it to the temperature sensor lead. Apparently it will work but the values it returned have to be converted to real temperature values. To achieve this you have to find the values returned for some known temperatures, and in the words of Fred, "do a curve fit in Excel." I'll be talking to a math teacher to figure out how to translate that into a conversion formula. But it's great that we'll be able to use all these temperature sensors we have rather than buy new ones made for the cricket.
  

Animate with Pencil

Pencil is really amazing! Get it here. My only complaint is it seems you can't set your own size for the canvas. I guess I could get around that by figuring out how to make vector drawings instead of bitmap. So below I've exported an animation to SWF, uploaded that to a server, then pasted Flash-generated object tag HTML into this post referring to the uploaded file so it'll show here:

How to Merge With Formatting from Excel to Word

Have you ever had a specially formatted value in an Excel field you are trying to merge into a Word document or merge to email but the formatting won't come with the data? So a formula like =SUM(B2:B16) is formatted so the result will show as currency in the cell but all you get in your merge result is 4893. Or you have a percentage that you format as percentage to two decimal places but you get 12.467633847898736 in your merge? I looked for a fix for this for a long time before I came across a forum (that I can't find now, sorry) that laid it out simply. Wrap your formula in a text command that specifies the formatting to give it. Sounds ugly, but it's really as easy as it looks:
=TEXT(SUM(B2*C2),"$0.00")
will get the currency format to show up in the merge document. A colleague needed a phone number to show up properly and this is what worked:
=TEXT(E2,"(000) 000-0000") where cell E2 holds the raw phone number (9176567321).