Hypermedia & Multimedia

Hypermedia and Multimedia

Modified: 2024-04-15 (9:03 PM CDST)

Today, everyone is familiar with and uses multimedia, almost without thinking about it. But, it's good to look back some 50 years to how hypermedia and, later, multimedia began and became so ubiquitous. The path was incremental and depended on software and hardware improvements. Among those were the personal computer itself; it became more and more powerful. The Internet gave both a big boost although, it too, had to become faster. Storage at all levels: personal computers and Internet servers, had to become larger. Streaming video, taken for granted now, only became possible after technologies matured.

Hypertext and Multimedia

Definition of Hypertext

text
nonlinear
predates Internet and WWW
uses hyperlinks to navigate
Kardas and Milford (1996):
- probably the best example of a hyperspace is the Internet itself
- hyperspaces have no inherent, a priori, organization
- this page, and all of my others, are examples of me imposing a post hoc organization on a very tiny part of the Internet
- at the same time, I also create new pages (e.g., like this one) that add more content (and a little organization) to the hyperspace that is the Internet
- Note: others can and do take my pages and repurpose them to their own uses
  - One page had linked to my general psychology page on Maslow and Rogers but capitalized my name using: "Kardas" not "kardas"
  - The correct page address is: http://peace.saumag.edu/faculty/kardas/Courses/CogSci/Maslow.html
    not http://peace.saumag.edu/faculty/Kardas/Courses/CogSci/Maslow.html (clicking on this link leads to an error: Object not found! Error 404)
    - in this case, case make a difference :-)
  - little errors are a problem in URLs

Wikipedia on Hypermedia

Extension of hypertext that adds graphics, audio, and video
- Hardware, software, and connection speed all had to improve to make usable hypermedia possible
Vannevar Bush: Memex (from "MEMory" and "EXtender")
- First idea (1939) about what would later become hypertext
- Inspired by the rapid and vast accumulation of knowledge
  - (search engines and informatics are current types of tools related to the idea behind MEMEX)
Gopher
- Preceded WWW
- Started at the University of Minnesota (e.g., the Golden Gophers) in 1991
  - But the university did not fully fund it
- Metaphor, too, for tunneling through the Internet (like a gopher)
- Text only system
- Berners-Lee, the man behind the WWW, tried to get Gopher programmers to help him with what became the WWW, but was turned down
- There are still a few Gopher servers operating
- Here is a screen shot of an iPhone Gopher client
Aspen Movie Map
- The first multimedia?

Video of the Aspen Movie map
Compare to my: magnolia arkansas approach at night
- So, what was once earth-shattering is now routine. Anyone with a smartphone and a YouTube account can best the Aspen Movie Map
I like this one too because I make the trip to Texarkana all too often! This one is scary!
What about Google Earth?
- The Google Earth (Streetview) picture taking car was in Magnolia a few years ago (photo: Magnolia Reporter 2 March 2015)

505 Hazel Cir, Magnolia, AR 71753

HyperCard

Apple and Bill Atkinson (1987, and before the WWW)
Card metaphor
Stacks of cards
Had its own language: HyperTalk
Black and White (color came later, but clunky)
I created a general psychology course on HyperCard and tested two classes. One class received regular lectures using the HyperCard stacks the other studied the stacks on their own, came to class but only to interact with me personally about the course (no lectures).
These two approaches are often called "sage on the stage" or "guide on the side." There were no significant differences in test scores but the lecture class preferred the class itself.
The "guide on the side" class accessed the material in a Mac computer lab (now gone) after I had installed (by hand, aka "sneakernet" the HyperCard stacks on each computer. Yes, any changes required me to change the stacks on all computers.
That ended my attempts at online around 1992 (and pre-Internet) teaching until now. ;-)
Unfortunately, HyperCard ran into a development dead end and html and other web languages took its place.

Sample Card	Sample Graphic	Stack Structure

My general psychology stacks were designed for in class use as pre-PowerPoint lecture aids and others for individual study (see above left)
Graphics, too, could be displayed in class (see middle panel), the structure of the stacks is displayed on the right panel
In class, I could display pre PowerPoint lecture notes. Students could access the lectures in the lab and print them
The stacks also included a Glossary, Pictures, Specific Examples, and Biographies
- Pavlov's Biography
  - FYI: I made the scan using a 4" handheld scanner. Yes, it's still in a drawer somewhere in Peace Hall.
- Bombykol Example (moth's chemical pheromones)
  - A publisher actually paid me to use this diagram in another textbook.
- Anterograde Amnesia (definition)
  - The inability to make new long-term memories
As noted on our history page, Cognitive Science students in the 1990s wrote their own HyperCard stacks

HTML (hypertext markup language)
- HTML is still the most common way to create web pages but most people do not code in html directly. Instead, they use an editor.
- Many applications (editors) can create hypermedia (I'm using Adobe Dreamweaver. At one point in the class (see the class history) students created HyperCard stacks, and later html pages using the Claris Home Page application. Later still, many students used PowerPoint or other software to make class presentations (see below)
Here is the html for the beginning of this page. Coding in this manner is not something I care to learn. Fortunately, DreamWeaver does it for me.
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Hypermedia & Multimedia</title>
</head> <body>
<h2>Hypermedia and Multimedia</h2>
Modified: 2020-04-16 (16:31:22)
<hr>
text
<hr>
History of Hypermedia and Multimedia
Hypertext and Hypermedia (Multimedia)
<ul>
Why is multimedia important? This page highlights the use of web based materials and differentiates between:
- Front-end development or what users see
- Back-end development or the code that creates the web page
- Full-stack development or front-end and back-end together
- The page also discusses:
  - Architectural design or how a back-end developer (usually) create the framework for the web page
  - Aesthetic design or how the page appears on screen and how easy it is for users to navigate successfully
  - Information design and interface design or how information is transformed for users to access successfully and with a minimum of errors
Images
- A picture really is worth a thousand words
- Obviously, images are one of the key components of multimedia
- The images below show how I have changed over the years. (The 1974 picture is me in grad school, pity my poor professors!)

1951

1956

1974

1998

2019
Photo by Christian Kardas

Graphics

Charts, tables, animations and more

Infographics

Convey more information, may be interactive

Arkansas State Salaries

Only includes salaries over $40,530

Does not include college or university salaries

Videos

Users are more likely stay on a site with videos

How to replace a showerhead

I don't know about you, but I have used "how to" videos a lot recently. I have yet to create one, however.

Streaming Media

YouTube, Netflix, and Hulu
- A colleague and I chatted about the potential for streaming video many years ago and realized that many obstacles remained to be overcome: bandwidth, storage, and the ubiquity of online users.
- Today, many of those problems have been overcome and have changed the nature of video entertainment drastically
Let's review the history of TV
- In South Arkansas we used to only have channels 3, 6, and 12, or the ABC, NBC, and CBS affiliates, respectively.
- Later AETN came on channel 9
- All of those stations broadcast their signals on air via transmission towers and TVs received them via external or internal antennas (rabbit ears, famously) Antennas today do not work with digital signals without installing a digital converter (Walmart has them)
- Below is a photo of the external antenna my son and I installed early in the 21st century. It is pointed toward Shreveport, fyi. We do not use it any more.

Cable TV (CATV) began, at first, as a way of getting users outside of on air broadcasting limits access to TV. Later it became popular more widely, especially because of added channels
VCRs
- SONY's Betamax came first
- Later VHS won over the market
- Soon, video stores popped up everywhere and some became national brands (Blockbuster)
  - FYI: I first noticed the woman who became my wife (34 years and counting) at a Magnolia video store where she worked
- Now nearly all the video stores are gone, replaced by:

Streaming Media
- Music
  - SONY's Walkman was first successful portable music player, it used cassette tapes at first, this one was on sale on eBay recently for nearly $800. (Got one in the box? I'll give you $10 for it :-)
  - Napster: music streaming from peer-to-peer computers
    - Shut down later by copyright laws
    - FYI: I downloaded a lot of audio files before it became illegal
  - iPod: Apple's music player
    - First model was really a repurposed 5mb hard drive
    - Apple worked out deals with artists and audio companies to secure copyrights
    - Users could download songs for $0.99 each and artists received royalties
    - iPods got smaller and smaller
    - Revived the music industry
    - FYI, I still have the first model
- YouTube, Netflix, and Hulu
  - YouTube
    - Created in 2005
    - Bought by Google in 2006 for $1.65 billion
    - First video: "Lazy Sunday" (2009) on Saturday Night Live (it's a takeoff on Rap music, fyi)
    - I like YouTube see my channel epk49 (not required, btw) Street Sweeper in Action was my most watched video of mine (2900 views), obviously most users are not envisioning that kind of street sweeper. Most likely they are thinking of an automatic firearm.
    - Now, however, my two most watched videos are Marco Polo (21,000 views, 28 Aug 2012) and Analog Watch (6,000 views, 28 Jan 2012, and created for THIS CLASS, wow!)
  - NETFLIX
    - Began in 1997 as a way of mailing videos on DVDs
    - Lost money early
    - Blockbuster declined NETFLIX's offer to become their video streaming service
    - NETFLIX persisted and began its own streaming service
    - The rest is history. NETFLIX is now a mega corporation and few even remember Blockbuster
  - hulu
    - Available to the public in 2008
    - Stream older TV shows
    - Led to "cutting the cord" meaning not watching CATV or broadcast TV that much
  - Smart TVs
    - Connect to the Internet
    - Can download apps
    - Some can serve as controllers for smart home functions (e.g., lights or locks)
Media Formats
- Let's pause and consider the phenomenon of media
  - Definition: (dictionary.com)-
    (usually used with a plural verb) the means of communication, as radio and television, newspapers, magazines, and the internet, that reach or influence people widely: The media are covering the speech tonight.
  - Some media:
    - line in the sand
      - the Christian fish symbol
        
        alledgedly one would draw an arc in the sand with foot, a stranger who was also a Christian would complete the symbol. After, if was erased.
- Problem: How do we preserve information when the medium changes?
  - Example: I cannot show you the HyperCard stacks my students made because they are now incompatible with modern computers.
- Problem: How do we communicate information over extremely long periods (say 10,000 years)? Imagine us burying some environmental poison that might still kill people who did it up 10,000 years later. How do we warn them?
  - Communicating Danger Across 10,000 Years
    - Language will not help (remember Beowulf?)
    - What shapes or markers might work?
    - This is an essay question, fyi
  - Communicating with Aliens
    - Media carried by Voyager spacecraft (video)
    - Carl Sagan narrates the video and shows the graphics encoded on NASA's Golden Record
Media in the Classroom
- History
  - Blackboard and chalk
    - FYI: I still have a box of chalk in my office. Some of my nightmares involve having only a teeny piece of chalk and a blackboard that is too smooth to write on.
  - Mimeograph Machines
    - Mimeographs in Schools
      - Made copies from stencils usually in purple
      - Watch the video on the site above
  - Punched Cards
    - Punched cards were the media that contained programming instructions for the earliest computers
    - FYI: in my BASIC programming class (1970) the program consisted of a box of IBM cards in the proper order. After writing the program students walked the cards to a card reader.
    - Dropping your box of punched cards and watching them scatter was a disaster
  - Opaque Projectors
    - Used to project hard copy materials
    - Teacher would insert and raise the material for projection
      - Noisy and hot machines
PowerPoint
- History
  - Developed in 1984 by Forethought
  - Started as "Presenter" and implemented on Mac platform first
  - Names: Presenter->SlideMaker->OverheadMaker->PowerPoint
  - Microsoft bought Forethought in 1987
    - Released new Mac version and first PC version
    - Windows version followed
  - Now used widely
- PowerPoint Live (video works)
  - Using PowerPoint Live requires that presenters have Microsoft 365 subscription (I don't have one)
  - Viewers do not need that subscription
- Death by PowerPoint
  - Not using PowerPoint effectively
  - How to avoid it
    - Prepare for your audience ahead of time
    - Set an engaging tone early
      - Use handouts to support main points
      - FYI: I always recommend a one page, two-sided handout
    - Create readable slides
      - In dark rooms use use dark backgrounds and bright foregrounds'
      - In bright rooms use light backgrounds and dark texts
      - Be consistent: background, font, size
      - Pick animations and graphics carefully
    - Don't overload your audience's cognitive capacity
      - Use one idea per slide
      - Use no more than 6 lines/slide
      - More slides with less information on each is better that fewer slides crammed with information
    - Be a good presenter
      - Rehearse
      - Be prepared for glitches
        
        FYI: A SAU job candidate's PowerPoint was interrupted because Microsoft "decided" to update her laptop just after she started. She should not have allowed automatic software updates!
      - Don't just read your slides. The audience can do that by itself.
  - In years past, students in this Cognitive Science class worked in groups to prepare classroom presentations using PowerPoint or other presentation software.
  - Here are some old student presentations about Hypertext and Multimedia
    - 2020
    - 2017
Other Presentation Software
- As you might imagine, the success of PowerPoint has led to other software platforms to make presentations

Visme	Prezi	Keynote	Slides	Slidebean
Zoho Show	Google Slides	Canva	Beautiful.ai	Microsoft Sway

Obviously, presentations are a big part of modern life

Memes
- BTW: "memes" are older than the Internet
  - a meme, back then, was defined as the analog to a gene
  - but, where genes's information had to be transmitted sexually (e.g., you actually began with physical half copies of genetic information from you mother and father)
  - memes, on the other hand, could be transmitted cognitively. So, a joke could be a meme. A sacred text was definitely a meme.
  - Internet memes are similar except they are transmitted on the Internet. Many go viral (in the non-lethal meaning of that word)
    - Bernie Sanders's mittens meme (video)
      - Notice the multimedia skills of the persons creating the memes